Building a Serverless GraphQL API For Any Datasource With StepZen

Hello, everyone. Thanks for joining. So, I see you already shared my screen. I believe everyone can also hear me. So, that's good.

So, today's workshop will be about building a serverless GraphQL API and we're going to do this using a tool called Stepsen. And with this tool, you can create a GraphQL API for any data source. So, I don't know if you saw the prerequisites for today's workshop. So, if you want to work with MySQL or Postgres today, then you will need to have a Docker running as well. So, if you don't have Docker on your machine just yet, now's a good time to install it. And also, ng-work. That's something we'll be using to create a remote port to your local system, because how Stepsen works, it's going to take remote connections. So, that can be your database. It can be an existing rest API, existing GraphQL API and build a serverless GraphQL API on top of those sources. So, that's why we need ng-work as well in order to expose the, all the local database you're running with Docker to remote network. But it's up to you if you don't have Docker installed, or maybe you don't know how to use Docker, which is not actually needed. You don't need to understand how Docker works. You just need to install it and run one command. And then you should be able to run the database in your own system. But if you don't want to use Docker, you don't want to use a database, then you can use a rest API, which I'll also provide you with later on once we go to the assignments.

So, that's for starters. I hope you're all looking forward to this, to this workshop. If you don't have any experience with GraphQL yet, then that's also perfectly fine. Please let me know in the chat. So, I have an idea how much stuff I should explain and how much I shouldn't explain. That will be useful to everyone, I think. So, then we have more time to actually build some code. And then I have more time to help you with any questions you have. So, if you GraphQL yet, please use Discord or the chat to ask questions during this presentation. So, that will also be the format. I will do a short presentation first. I think it will be roughly 20, 25 minutes. Then I will explain the assignments. I will show you where to find the code we'll be using today. I'll show you how to run the Docker. And then you can start building a GraphQL API. And then I'll probably put you in, let's see, we're around 20 people here. I'll probably put you in four or five breakout rooms. So, you have smaller groups to ask questions to each other as well. And I can hop on and hop off to different breakout rooms. So, I hope that's all clear. If not, then just use the chat and Zoom to ask questions. Maybe for more technical questions, it's easier to use the Discord because then people can reply, and we won't lose the answers. That's a nice feature of having the Discord. It's easier to send links there because you're already in a browser. So, use Zoom if you have any questions regarding the things I'm telling you right now, and use Discord if you have any technical questions or want to share links with other people.

Then a Discord might be easier. So, what is today about? So, we're going to be building a Serverless GraphQL API using StepZen on top of your existing data sources, and you probably all have different reasons to join this workshop, and maybe if we have time later on, we can talk about your projects a bit as well, probably when I put you in your breakout rooms.

So, who's this talk for? And this workshop as well. So, what I often see happening, and I've built lots of GraphQL APIs in my time. I started with GraphQL in 2016 when it became a public library, and the first thing I always see when building GraphQL APIs, it's super easy to get started. If you want, you have a GraphQL API running with some things like Apollo or Prisma or any other GraphQL library out there, basically, within a couple of hours, you can attach your existing data sources, you can attach REST APIs, or GraphQL APIs, and it's super easy to build that first GraphQL API. But then once you start scaling things, I often find out, and I heard this all the time from different engineering teams as well, it's pretty hard to scale a GraphQL API if you don't have the whole knowledge about GraphQL, if you don't know how the graphs work, if you don't know how data is related to each other. So building a GraphQL API is probably easy, you build your schema, you build your first five resolvers. But after that, things get tricky because that's where you actually need the GraphQL in-depth knowledge, where you need to knowledge about databases, you need to knowledge about underlying systems. And so scalability for GraphQL APIs is always tricky. If you look on the internet, there's tons of benchmarks for existing GraphQL libraries, GraphQL server libraries, find out which one is the fastest. And those are basically up to the GraphQL engine of those systems. So how fast is their engine, how fast are they able to parse GraphQL query language, and how fast are they able to retrieve it from the underlying data sources. And so for a small GraphQL API, it's super easy. If it grows, it gets bigger, scalability really comes sneaking around the corner. So this talk we'll be talking about GraphQL servers, how to create them, and scalability. And then after this short talk of around 20 minutes, we'll start working, building some code.

So a little bit about myself. So my name is Roy, you can find me on Twitter with the handle at githackteam. If you're not on Twitter yet, it's super useful to share information with each other, especially in the tech world on Twitter. To me, at least, it taught me a lot using Twitter. There's a lot of bullshit on there, but there's also a lot of useful information. So if you don't have Twitter already, please create an account and start interacting with other tech people because it's super useful for you. I work with a company called StepZen and StepZen is the tool I'll be using today, and with this, you can create GraphQL API on top of existing data sources. You might also know me from my books, my other talks, about a year ago, I released a book, Full Stack GraphQL. So if after this talk you think StepZen is not the tool for me and you want to build a server completely, do it yourself from scratch and scale it to lots of users, then definitely ask me about the book later on today, because in there, you'll see how to build a server yourself explicitly from scratch, build all the results yourself, build the whole schema yourself, build middleware, build context, all these kinds of things, which can be quite complex. It's all explained in the book.

So if you're in this workshop, you probably also think why am I in this workshop? What I want to get out of this? Probably you want to build a GraphQL server. During this workshop, you want to know how you can take existing concepts, existing patterns and apply them your own project or maybe just interesting GraphQL, which is also perfectly fine. So there are a number of reasons to build a GraphQL server. Typically teams that start building GraphQL server have experience with other APIs such as REST or gRPC or SOAP, and they want to have a GraphQL server in order to optimize the client requests. So that's one of the most common use cases I see for GraphQL is people want to optimize the client request. So you have a client, maybe you have multiple clients, they have, they're of course sending network requests to your API, to your database, to whatever is exposing an API, and you want to optimize those requests because maybe there are lots of people using your clients, or maybe there are just lots of people sending requests, so you want to optimize these things. So GraphQL is perfectly fine for optimizing client requests. Another common use case is microservices, so imagine you maybe have 3, 4, 5, 6, maybe tens of microservices. They all have their own API, it can be REST, it can also be GraphQL, and you want to merge those things together into one data layer or API gateway. And that's something GraphQL is perfectly fine at. It's something StepZen can also do, there is a great, there's a great blog on our website about how you can do this with StepZen, how you can create a data layer or gateway for your microservices. This is something GraphQL is also useful for. And then of course you have legacy services, and this is not per se GraphQL specific, but it is something StepZen and other tools are doing very good, creating a layer around your existing legacy services so you don't have to worry about breaking things when changing things to a legacy service, because instead you'll be building a GraphQL API based on those legacy services, so you don't have to worry about changing the legacy code because you don't have to. Instead, you build a GraphQL API on top of it, which is fully performant and is helping you scale the existing legacy services, and then one by one migrate things out of there. So these are use cases. So it's either optimizing client requests, working with microservices or wrapping legacy services. So these are things GraphQL is perfectly good for. And If you want to build a GraphQL API, there are multiple ways to do so, and this is something I briefly touched in the introduction. There are multiple ways to create GraphQL servers. There are tons of libraries out there. You can build it from scratch yourself, maybe something like Prisma or Apollo or Fastify, or you can use something like StepZen in order to generate one for you based on top of your existing data services. And there are reasons to use all of these patterns. There are multiple ways to do so.

And every team is different. Every company is different. So it's about which approach best fits your company. So the first approach I want to discuss with you is the code-first GraphQL server. And this approach is especially popular in people that are using things like TypeScript or other type languages because with a code-first GraphQL server, you start by writing code. So the first thing you do is defining types for your resolvers, you write your resolvers, and then based on those things, a schema is auto-generated. So this is typically what a code-first GraphQL server package is doing. It is helping you create something code-first by building resolvers, by generating a schema based on the resolver logic that you built. And then, of course, it's going to make it possible for you to build a GraphQL server using both the resolvers that you build yourself and then the schema that was generated for your resolvers. A nice example of this could be Type GraphQL, which is a very nice library to build your own code-first GraphQL server. And what you're doing over there is you define types, you define resolvers, and then those types are, of course, the return types for these resolvers, and then a schema will be generated. And I believe NestJS, so not NextJS with an X, but NestJS with an S. They've also created an API framework, and one of the things you can do is create a GraphQL API with that framework. They also have a code-first approach to GraphQL. So you don't write your own schema, you write your own resolvers, and the schema gets generated for you. And this is really cool, but it's also hard to have a separation of concern. So you have your resolvers, you have types for the resolvers, and then it generates the schema for you, which is really cool, but also it doesn't give you the separation of concern, because your schema is very coupled with your resolvers. So if you change something in your resolvers, your schema will change, which can be problematic if you have multiple teams working on things, you may have multiple clients using your API. So whenever something changes in your resolvers, the schema will change, which might break your API. But also, maybe another team is changing something in your resolvers, which then will break your schema and will break other users' clients. So it's something to think about when working code-first. It's a really nice approach for maybe smaller teams or for microservices. But if you have like a monolithic GraphQL API, it's a bit harder to do this approach. So not having a separation of concern could be a reason to not use the code-first approach. And that's why there's also the SDL-first or schema-first approach to building GraphQL servers. And there are literally two things, so you have schema-first which basically is write your schema first. And then you have SDL-first which is write your schema first in GraphQL server design language. So it's a subtle difference. It's basically the same, but the libraries that are offering these services are a bit different. So you have schema-first, which is building a schema in any kind of way you want. So you can build a schema with GraphQL SDL, schema design language, or you can build a schema maybe programmatically with other frameworks. The schema-first SDL-first approach, it all starts with writing your schema. So you need to write your schema, you can define your GraphQL types there, you can define relationships, like operations as queries, operations. And then you write your own resolvers as well. So you don't only write your schema, you also write your own resolvers, and then you place them together and you create your GraphQL server. And this is really cool because it gives you complete control of everything. So you write your schemas, you build your resolvers, and then you create a server. It is very decoupled, so multiple teams can work on different things, you can even generate types from your schema and use them in your resolver again. So it's highly decoupled, but also it's a lot of work because writing both resolvers and schemas is a lot of work. It also is the problem that these things can get out of sync. So maybe one team makes a change to your schema while the other team changes the resolvers. If these things aren't aligned, if they aren't in sync, it can lead to errors, can lead to breaking things, besides that it's also a lot of work. So like I said, building the GraphQL server with your first five resolvers or maybe one or two operations is fairly easy, but actually scaling the thing and making it larger to use is something that can be a bit more problematic. But of course, there's also a solution, and as always, there are multiple solutions, and the solution we'll be using today is StepSense. So with StepSense, you can create a GraphQL API from your schema directly. So instead of building resolvers and schemas yourself, you can only write the schema and the resolvers will be made for you. So it's comparable to the schema-first or SDL-first approach. You write your schema, and in your schema you'll be using custom directives to tell GraphQL where data is coming from. So every operation or every type can have its own custom directive that defines where the data is coming from, and based on this it will generate resolvers and a server for you. So we have built a GraphQL engine.

You don't actually see it as a user because it's built in Go, it's running serverless, it's running somewhere in the cloud, but the only thing you're, as a user, up steps and you're seeing is GraphQL schema design language. So you built your GraphQL schema with custom directives, you define where the data is coming from, and then based on those data sources, we'll build the resolvers and the server for you.

So what we're doing for you with our own service is doing introspection on your data source. So if you define that a query or any other operation is coming from a database, we'll run an introspection on the database, we're gonna see what your database looks like, we're gonna look at the tables, and then we're gonna make sure that data has been getting from there from you most efficiently. We do the same thing for rest APIs, we're going to try and introspect it, we're going to see if there is any API specification written, and then we'll use that API specification to make sure that your schema is aligned with whatever is your data source. And we can do this for my SQL, Postgres, REST APIs, also existing GraphQL APIs. So if you already have GraphQL APIs and you want to merge them together, maybe do some schema stitching or federation, then you can use StepStem for this. And if you have any questions about how the GraphQL engine works, I can explain them them later on.

So like I said, we have custom directives. We have roughly three custom directives to connect your data source. It's either a directive ADBQuery, which works with SQL databases like Postgres and MySQL, but also other things like MariaDB and any kind of flavor of SQL you have. Then we have a directive for REST APIs, which is called addREST. So the use of any REST API, but also with NoSQL databases that expose a REST API, because there are many in NoSQL databases that have already REST APIs on top of them. You can also connect them using this directive. And then of course, the addGraphQL directive, which is perfectly fine if you want to do things like federation, or maybe you want to connect other backends that expose a GraphQL API inside your existing infrastructure, which might be SQL might be REST APIs might be NoSQL databases with a REST API. So the possibilities are quite endless here. So you can connect any backend or data source using these custom directives. And then the magic that we do for you is, we make sure it's performant by introspecting your data source, making sure whatever you define your schema is efficiently being generated to GraphQL. And then we also give you a fully performance serverless GraphQL API. So it truly is a cloud first solution. You don't have to worry about deployment yourself, because we are handling deployment. So instead of instead of you having to deploy it somewhere else, maybe some like Verso, or Heroku, maybe even Google Cloud, we do all these things for you. So you don't have to worry about them. If you are an enterprise, of course, we can also make sure that you can host them yourself if that's what you truly want. That's, of course, up to you as an enterprise user. But if you're a regular user, you just want to build something really nice with GraphQL, you maybe have a cool startup or scale up, you don't, you're not in the enterprise Enterprise world yet. Or maybe you're just perfectly fine with having us running all the deployments for you, then this is really the way to go.

And Step 7 works with using only GraphQL SDL. So if we look at some examples, you don't have to write any resolvers. Instead, you just write a schema, you write them all in GraphQL schema design language. And then you can define and connect all these data sources, create your operations there, create your types. It looks roughly like this. So on the left side, you would have an example for mysql or postgres on the right side for rest. You can see we're using directives in order to connect these operations. So you can see we have a mysql database or a postgres database, we have a type country in our schema. There's two fields, we have also two operations to find one to get a list of countries, or one to get a country by its country code. And you can see this data is coming from, it's coming from my SQL database on the left side. And now you can see we forgetting all the countries, we have just defined our type, which is my SQL, and then our table, which is table countries, and then for the second operation you can see there's also a query defined. So you can also take control of this yourself. So instead of having us handle sending the queries to your database, you can also define which queries should be executed in order to get this data. And this is really for power users because we've built this engine. And we've made sure that the data is getting there most efficiently. But of course, if you want to take more control, then that's something that's And on the right side, you can see the same schema. Instead of using MySQL, the data is coming here from an existing REST API. So you can see the endpoint, myapi.com slash countries, is a REST API endpoint that returns a list of countries. And then of course, you can also define the code yourself by appending it to the URL. So those are two ways to create a connection from a GraphQL Schema with StepZen to the existing MySQL, Postgres or REST API. And then you can connect any back end using directives. So of course, you can also connect other GraphQL APIs as a data source. And this is particularly useful if you're looking to do something like federation, and StepZen is also offering federation.

It's a bit different than federation you might know from other companies. But instead, it will make sure that the data you have here is being harnessed most efficiently and only using GraphQL SDL. So if you want to use federation with StepZen, you don't need to alter any underlying services. Instead, you can just tell us where the data's coming from, and then we'll make sure that we merge the data and give you one schema for all these federated services instead.

To give you an idea of what this looks like. So this is roughly an example. You have a type, you have the fields, you have the operations and then you can just run StepZen Start from your terminal. And then it will generate a GraphQL schema, a GraphQL server based on the schema. So it'll ultimately deploy it for you. It will create a local host example for you. And then of course, we can add other types as well. So add a type language, and then we can connect these things together to a previously created type. And then you can even create more operations. And then whenever you press Save, so let me press Save here, then, yeah, it will start redeploying again. So once I save this, it starts redeploying, and it creates a new version of server I just created. So this is roughly all the code you need, because you need to log on with StepZen, you need to run StepZen Start, you need to give a GraphQL schema to it. So we have this schema with a type called country, it has some fields, it also has a relationship with another type called language, based on a query that defined in our type later on. And that's all connected to here. So if you want to create a GraphQL API, you only need GraphQL schema design language and nothing else. You can run it from a JavaScript project, you can run this from TypeScript, Python, it doesn't really matter, because it's all platform agnostic, you're not tied to specific programming languages. The only thing you need to use is GraphQL schema design language and nothing else.

So if you build your back ends in Python, you can connect their endpoints, their REST endpoints, or the GraphQL endpoints with StepZen. If you created your back ends in Go in JavaScript, TypeScript, it doesn't really matter, because it's not tied to any specific programming languages, just GraphQL schema design language. And of course, you can also merge third-party or SaaS APIs in this tool. So if you're using Google Cloud or Google authentication for something, if you're using SaaS APIs, maybe as a CMS, so headless CMSs, you can merge them all together, right in StepZen. So you're not tied to your own APIs or your own databases. If you have connection to any other database, maybe from a partner, maybe from a third party, or maybe from a SaaS company, you can connect them all together in StepZen.

And to give you an idea about how this works, we quite recently released a new tool, which we will not be discussing today. Or maybe we can do it later on if we have time, because today we'll mostly be focusing on building a server using GraphQL schema design languages. But if you find it interesting, you can go to graphql.stepzen.com. And over here, we created GraphQL Studio, which is quite an easy way for you to find combinations of APIs we curated. These are from third parties or SaaS providers. And then right from your browser, you can run them there and you can create a server on top of it. So in the right top corner, you can already see as soon as you start playing here, it already creates a GraphQL endpoint for you, which you can then use to start building stuff stuff on top of it. So you don't need you don't need to create an account if you want to use the studio. But of course, if you want to start building APIs on top of your own data sources, it's best to create an account, because then you can really alter these things your own as well. The Stepsin studio is a great way to explore what Stepsin can do for you. And then in this workshop, we'll dive a bit deeper. And we really started looking at how to build the server yourself. So the information for today is can be found in our documentation. So stepsin.com slash docs, and then go to quickstart. And there you can find the easiest ways to get started, but I'll run you through it. We also have our own Discord. So for today's workshop, it's probably easiest if we use the Discord from the conference. If you're not in there, I believe the link is in the chat. I'll try and share it again. So this is today's Discord in the for this workshop, we'll use it today. You can also use the communicator with other people in this Zoom as soon as we start going to the breakout rooms. And in this slide, you can see your own Discord channel, which I'll share later on today. So if you start becoming a steps and user, start building your API, then this Discord is really convenient to start using questions to our team, to the engineers in there and people are really, really helpful and really want you to start using this tool and answer your questions.

So for today, let me stop the presentation there. So for today, I've created a GitHub repository for you, in which you find the code for today. Put it in here. So so if you will be going to GitHub.com slash steps and samples, you can find this one here. So this is a repository for today. Let me put it in chats. So the assignments can be found on this link. Close that as well as notifications. So this is the workshop I created for today, you can find it on GitHub.com, and then steps and API workshop. I'll put a link in chat. So please have a link there. I'll put it in the discord for now. Examples for today, examples and assignments.

So in here, you can find multiple things. I would advise you start by reading the README. So welcome all we're in this workshop. You'll start creating a GraphQL based API, top of popular data sources, like REST, MySQL, PostgreSQL, GraphQL with StepZen. So to get started, you need StepZen CLI installed. And then free StepZen account. So please use the time to create these things to install the StepZen CLI. And then create the account you need to run the CLI. And then we have three types of data you can use. We have a MySQL database, we have a PostgreSQL database, and we have a REST API. And you can use all these things to create the code for today. So you can choose any of the three three popular data sources. So at first just pick one, either go for MySQL or PostgreSQL, if you have Docker installed. If you don't have Docker installed, or maybe you're afraid to use Docker, you can use the REST API instead. You don't need any prior knowledge to use Docker in this example.

So, example, if you pick MySQL, you can find multiple things in here. You can find our pre-populated data, so it'll create some initial data for today. In here you can also find a Docker Compose file, and in here you can see we set up a user for you, so a demo, a demo password. We also insert the data for the initial thing. And the readme here is pretty complete. So if you want to start setting up MySQL for today's assignment, you can need to create a local database using Docker. You also need ng-rock and ng-rock on your device with an account. Because I explained this at the beginning of the workshop, but I'll I'll tell again for people that joined later on. So StepZen is using a remote connections in order to create a GraphQL API for you. So if you're in this Docker, it will create a local database but in order to expose this local database to the Internet, you will need ng-rock. So have a look at the readme, it's all explained there. So we install Docker. You need to set your ng-rock authentication token and then you can run a docker compose command in order to start your MySQL or Postgres database. So for Postgres it's the same. It will edit the Postgres database, you will learn about using ng-rock except you'll be using a different port because Postgres typically runs on a different port and then you can start building this GraphQL API on top of it. So let me show you what this would look like. So I have Docker installed on my device. So if you want to start building this just go here to code, copy this, go to your terminal, run git clone, and then this URL it will clone the repository to your device and then from there you can just open your code any editor you might use, probably people are using different editors so that's fine. And in here let me check if I'm on the name branch, I'm on the main branch, okay, that's perfect. I can find the Docker Compose an example there so I would go to CD, my SQL, and Docker Compose up, and then it will it gives an error. What did it do? I probably don't have Docker started yet so let me start Docker first. Docker Docker, are you starting? Yes, so it's starting. So now my Docker has started, and then Docker Compose up again. Fusion refused. It's still not started. It's started now, and now it should be running. Let me see if I have the command correct. Yes, so now it will start creating my MySQL database. And then the next thing I should be doing is using ng-rock to create a TCP port. And with this TCP port... I need to find the port of MySQL. It's running on 3306. 6, and then it will start my local tunnel, and then this URL is something I can use to connect StepSnap. And before we head over to creating the breakout rooms, let me see if we have any questions. So, I see a question from Benjamin.

So, how would it work if you need to fetch data from multiple endpoints in a single resolver? So, yes, that's something we'll be doing in the assignments. So, your question will be answered when you start making the assignments. So, maybe we can use the chat or the hands if you want to start building using MySQL. And if you have Docker installed, do people have any issues running Docker? If you want to start building with MySQL. So, no hands, so no chat question is usually good. So, I'm going to show them if you want to start using MySQL, then you know how to run Docker and you maybe have even tried it already. So, for Postgres, it works the same. You can just go to readme there. It's the same drill. You need to have Docker, you need to have NgRock. You run docker-compose up within the Postgres directory, of course, and then instead of port 3306, you would have to port 5432. But it's all explained in the readme. I think it would make sense now to show you how this works. So, we have our port running, then our index file. We can tell the server we're using MySQL in example. We save it, and then we have a GraphQL file defined here, and we have our configuration here. So, whenever you started the local tunnel, make sure to copy this URL and put it in your config.yml file because that's where the configuration is put, this configuration for MySQL. And then you should be able to run section start commands after you've logged in. And then it will start creating the GraphQL server for you based on everything that's there.

So, I see I need to update my CLI. It's a nice moment to do this, anyway. So, that's one of two things you need. So, you need to have the CLI installed, and then of course this repository.

So, any hands for people having issues getting the repository running on their device? Okay, that's good. So, let me update the CLI, and I can give you an example of how to get this started. So, while we wait for this to get going, we wait for my CLI to update. Oh, just update it. Yeah, so now I should be able, so, I have my index file. I've defined that I'm going to use a MySQL database. I've made configuration. I've added the connection details for a MySQL database. And then I should be able to run the CLI. Might need to log in again. Let's check. No, it's already deployed. And then it will create two things. So it will create a local proxy to your GraphQL API. Copy, paste it in this, let me find my browser. It's here. So it will create this GraphQL playground for you based on the things we've specified in our code. So we have configured our MySQL database. We have told us the initial schema comes from here and then we have an initial schema here. So all these types should be present in my database. So I could start checking here. So I have a query. I have a query to get books, and get some books. Oh, from brackets, books, give me a list of books. Some name. Yeah, so this list of books, where is it coming from? So I have my index file, I can find it's coming from MySQL. And in here you can find a graphical file that shows the books is coming from a database, MySQL, books, and the table books. So it's basically doing a select all using the fields that we request. So if we request a name, it will do a select name from books. We do different things here. If we maybe add, does we have author ID? It will select name and author ID from books. So you know the drill. That's basically it in terms of what I wanted to explain to you. I think now would be a nice moment to interrupt me with questions. And otherwise, I'll start creating the breakout rooms. So I hope you all find the code for today. So it's on GitHub and the steps and samples organization and then steps and API workshop. And like I said, you can use either MySQL postgres or REST. For MySQL and Postgres, you need Docker. For the REST API you don't, because if you go to the Readme here, you can see it's using the My.JSON server to create a free rest based API. And we have some endpoints like to get books. It's a REST end points. We'll get some books for us, REST endpoints to get a specific book and to get all the books again. So that's basically it. If you want to use REST, if you want to use MySQL or Postgres, it's a bit more complex because you need Docker. So let me see what it looks like with REST.

So first make sure you have the Steps and CLI installed and create a free account because you need both in order to actually run this project. And then choose one of three pre-populated data sources and then add the data source you selected to the configuration file.

So, the solution was also here. You can see how to set things up like this. You would have a schema defined. So each of these repositories, you go to the code, each of them will have a Readme how to set them up and each of them will have an initial schema. So the schema is using the basic setup in order to get you started quickly.

So, if we would go to the config, not config, if you go to the index and we say we want to use a REST API, you can do it like this. Now it will take our REST API. It will redeploy this thing. And then if you would go here, so before the data came from MySQL database and now it's coming from Books, Next, it will take this name, it will run this, it will get this data from the REST API, which we defined here. So here is the REST API defined to get books. And then this is the REST API. So whenever you run this query, it will get this data from the REST API. And if you're using MySQL, if you're using Postgres, it will do the same thing, but instead of the REST API, it'll take the data from somewhere else. But that was it for the first question mostly. You can find the solutions here as well.

So for the second, check the connection of the data source by running the query to get a list of books and their names. So you should be able to do this query if you have either MySQL, Postgres or REST defined. There are some tips in order you, well, if you might get stuck, hopefully these tips will help you. And if you get stuck, then please send me a message or use the chat to ask this question if you got stuck somewhere. And for the third question, it showed how you can use a custom directive like the materializer. So StepZen has multiple custom directives. If we will go to the docs, zoom in a bit, we have the custom directive, designer schema, signed interfaces, contents, no, not this. You should search for it. Yes, it's in a link APIs part. Something's here, materializer, linking multiple, ah, here it is. So linking multiple GraphQL types. Also put it in the chats that we have on Discord. Find it where it is, it is here. Materializer, directed. So with Materializer you can link things together. So you can see here. So if you have a type called location and you want to have something else, AppMaterializer is there. So in the code we also have this. So we have, if we would go to a different branch. So all the solutions are in different branch. Let me see which branch we have, get branch. Get check out exercise three. Now we're in a different branch. And here you can see we've added the field author on book. So the data from book came from any of our data sources. The data from author also comes from our data sources. So we have the REST API to get author's information. We can see we have three and they all have an ID. And then for books, you can see all of an author ID linked. So we want to link the REST API to get all the authors together with the REST API to get all the books. And then we want to use author ID as a relation. So in the code you can see we have materializer query author. So we have a query here to get one author.

It takes an ID. It uses the ID to append it to the URL. And then we say, name ID. So this one is coming from the field author ID that we have right here. So you can see it has the relationship and this is where it links together. So whenever you use the query book, you also use author. It will make the relationship using this connection query.

We will go here. You can see we have books, we have name, and then we want to have author. Doesn't auto completely yet. So let's refresh. We have this one. And then we want to use author. We can use author ID in example, but we want to have the actual author. As we use to materialize it to connect it two together. And then we're going to say name like this. So now it connects the author. We can see I've got the Kirstie wrote the first two books and it uses the connection of this. So we have an author ID here. And of course this one has an ID as well. And you can see the link up together. Right one and one, one on one, two and two, two and two. So this is how the connection is made. So it links up the author ID to author based on this query. So basically what it actually does is it sends the query to get books using the author ID. And at the same time, it will also use this query to get an author with an ID. So maybe one, and then get the name. This is basically what happens.

So it will take, as an example, we want to take book ID one. The actual end of the hood, it will take two queries. It will get the query to get all the books and then it will get the query to get the author for any of these relationships. And now we've linked together REST APIs so it means it's maybe not as efficient as you want because it still needs to send all the REST API requests, but still as an end user, as a consumer of the API, you've got everything in one place, which is actually, well, a very nice way to have things because this way it's way more, it's way more clear where everything is coming from and how you would get the data and how things are connected together.

So that's basically the first three exercises. So if you would go to the GitHub, you can see there are multiple questions. So far, we've looked at question three. Of course, here's the question one, we set up a data source, then we check the connection to your data source. And then for question three, what we're doing here is make the relationship between books and author, which we've just done. Now what we want to do is, question four, so we made this connection, we were able to get a book with a name and an author and ID. The solution is also here, if you want to look at it later. You see, we have a type called book, add to materializer to it to make the connection. And for type four, we're going to say, let's connect another data source to the data you've explored in the first questions. So you can not only enrich the data by using MySQL and REST together, you can also add a third party API like Google Books. Google Books has an API, which is relevant to this discussion, because what we have is a database or a REST API with book information about authors and the book itself. And then we can connect the Google Books API together. So Google has a public API that you can open like this. So it's a REST API. In here, you can see for the ISBN, this one, I'll just make it more explicit. So for ISBN 978 et cetera, it finds the book The Murders in Ruhmorg, which is also in our database, I believe. So we will go back and just add books here with a name. Like this, you can see all the books are here.

And also this book is here. And of course, we also have an ISBN in our database, which is an identifier for a book. So every book that's being sold, being published, it has its own ISBN, which is a global identifier. And for this, we can say this global identifier, we can also find information on the Google Books API for it. Going like this.

So yeah, this is all this information. So it has a link to itself in the API. It has a volume info, like a title, which you already have. It has the author information, which we actually already have in our database. But it has additional information, like a publisher, publish date, a description, so our database doesn't have any descriptions for the book. So it's really nice that we can actually use this one from Google Books API. There's things like a page count, print type, rating. Not sure where these ratings come from, probably just Google. And also it has image links, so like a thumbnail. So based on this, we can also, we can extend their information with maybe description and a thumbnail, because this information we don't have in the database just yet. So we want to merge these things together. And for this, you can use StepZen, of course, because what StepZen does is make it possible for you to merge together information coming from multiple sources. So you could, example, use the REST API that we provided, you can also use the Postgres API database that we provided, or the MySQL database that was all provided, and then merge them together. And then for question number four, the idea is to also merge this Google Books API in there. So you can also merge any third-party API that can be Google Books, it can be basically everything, and then add them as a resource to it. So you can add this request to this API of Google Books, which I have here, also as a query. So you can add another operation. So we have an operation to get books, to get a specific book, to get an author, to get a specific author. You can also add an operation to get an ISBN from Google Books. And then you should be able to use a query like this. And what's pretty cool is there is this online tool called JSON 2 SDL, which we'll open here. And what it does for you, it changes SDL into something you can use in a GraphQL schema. So an example, if you look here, you can paste all this JSON from the Google Books API, and then it will automatically create a GraphQL schema for us, based on this. So it has our queries. That's the information about the volume, the one like description, the links to images. All these things we can use for this exercise. So for exercise number four, let's take like 15 minutes for it. So at five, we can do it all together in this room. So please take your time to try it yourself, and let me know if you have any questions in the meantime. And then we'll be back at five Central European time. Not sure what your time is at, but in 15 minutes. So let me know if you have any questions, and then I'll take your 15 minutes to work on this exercise. So start the recording for the people that left early.

Yeah, so for question number four, what we want to do, we want to connect another data source that you explored in the first questions. We found the Google Books API, right? So this is a nice way to add extra information to our schema. So what we want to connect is basically this Google Books API, we can use the ISBN to make the connection, because every book has an ISBN connected. And we can fill it in a Google Books API, and then we're able to use this information to set up everything here.

So what we want to use is a description, and we also want to use the thumbnail. Because if we look at our current API, we only have the book name and author in different database tables, or in different rest APIs. So we also want to connect additional information. The Google Books API, we can connect it to our GraphQL API as well. So what we can do is we take all the JSON from here, and we just put it in here. So this is a nice tool. It's called json2sdl.com. Something we at Steps and Build. And with this, you can convert your existing JSON to something you can use in GraphQL. And in here, we can just... So what happens is everything gets converted into a GraphQL type. Okay.

So what does this look like? So if we go to our examples, so let's go to exercise four. So if I edit a new type of schema, it's called googlebooks.graphql. It adds one query called Google Books and it returns Google Book results. And it basically just calls this API and it inserts the ISBN and then returns the information that we found in the API. So how do you get the types? So an example, if we look here, we can see we have type Google Book results, this fields items because we go to our API. You can see it also has fields items. So JSON2SQL actually helped us in creating this type. So we can see here, we have type item. You just copy paste it and add it here. I've actually renamed it something more readable, of course you can also just use this, rid of this one. And then the typeset we'll be using is basically just volume info because what we want to have is the description and the image link, which are all in there. So what we do here is basically just remove everything. And we've type item, which is type volume info. I just created types, I created myself, let's get rid of them. Go back to JSON to SDL, you can see we have volume info, which looks like this, also automatically converted for us. Let's copy paste it. And let's also put it here. You can see a lots of fields we can use, but all we want is the description and the image links, right? So we can delete all the other ones that we won't be using. And then the last one we need to find is image links, which is probably also defined right here. So here it's quite cool. I sit here and see, we will be using thumbnail only. So now it's important because all the things we have here, those are all either a scholar types in GraphQL or their relationship to a type that is defined here because otherwise things will break. If I save this, it's gonna start re-deploying on Stepzen. And conflict content has changed. So let me see what happens here. Ah, we need to insert it here, Google Books. That's all correct. And then it's deploying. So now it's deployed on Stepzen. So if we would go here. Just refresh it for sake. So we've now added the Google Books API here as well as a query. You can find it here, Google Books, and we just need the ISBN in order to get a Google Books results. So we can type Google Books, ISBN.

Maybe use, I don't know, let's do something different. So let's try and get our ISBNs. So let's find book with ID one in our database or in our existing REST API, take the ISBN and take the name. Okay, now we have it, ISBN. And then create a Google Books query that we created below. We're going to take this nice ISBN from Murder on Orient Express. And then we're going to get our description items because it's deeply in essence data. We need to go volume info and then we can get description. So cool. So this information is coming from our REST API and this information is coming from the Google Books API, which is this one here. So description is whatever is found here. So it's like a short description. And what you can also do is get the image in here. So image links, and then get our thumbnail. And then you can see, we can get this nice little thumbnail here. Paste it. This looks like, so this will be the cover of the book we're using. And then in a front end, you can easily query this thing and then get started quite easy. But some problem I have with this, the data is deeply nested, right? So we have Google Books, we have items, volume, description, image links, thumbnail, which is deeply nested, which is because of the Google Books API. So this returns the data in a format that we don't really like. So what we can do is try and refactor this. And with StepStand there are some things built in that makes it easy for you to do that. So one thing we can do is using result root. Result root. And then here you can actually define the root of the data that we'll be using. So we only get info from volume info through our items. So what you can do here, you can say items, and items is an array, so do it like this, and then volume info. So we're gonna tell it that this is our result roots. Where did we get? So now. And so now it should be flattened. So this results will just be this thing. We could copy this here. Now we should be able to get rid of this because we already flattened it a bit. So this query, where is it? It's here. It should no longer work because we cannot query field items. Instead we flattened it. So volume info will be the root. Instead of items, we need to delete here some things as well. We should be able to do this thing. Now we already flattened it. We still get the error because we need to restart the Explorer actually to make it visible to everyone. And now the only thing we need to flatten is image links and thumbnail, right? Because it's still not that nice. So we can use setters for this. We can do setters. And then we can say, how do we do this exactly? We say something like name. I don't know. Let me just briefly exercise number five, which this one, git stash it. And then I don't have to guess it for you. So git, get out exercise number five, okay. Okay, we can close this one and save it, please.

And then we can see, we also have to set up here. So the setter says field thumbnail in our Google book is coming from image links.thumbnail. So this result image links thumbnail and this one, which is coming from the Google books API, because images are defined like this and heavily nested JSON. You can see, we use this setter and then save this. It should be deployed and then this should no longer work. And instead you can just query thumbnail here directly. Verify it and run. So that's how you do exercise number four and five.

And then for the last exercise, number six, the idea is to merge these two things together. If we go to exercise number six. So we already did this one. You go to six. What I want to do here is I want to create one query that combines both books and Google Books. And there are multiple ways to do this. You can easily do the App Materializer directive that you already saw, but you can also use another directive called Add Sequence to make a sequence of queries. So you can have multiple queries that follow each other and based on the results, it will be collected and combined together. So let's take like, I don't know, let's say let's take the next 70 minutes to work on this. And if you have any questions, please let me know, so it would take 70 minutes and then we get back to work on this together and I'll show you the solution.

So for the final exercise, you needed to combine the new Google Books API that we inserted in exercise four and five and combine them with your existing data source. So it can be either the REST API that we held there, but also one of the Dockers for a MySQL or Postgres. Let me get my screen up here. And in order to do so, you needed to create a sequence of queries. So at Step 7, we have multiple custom directives. You have used the custom directives to connect data source like a DB query or at REST. We saw the materializer directive to combine queries within a type and then we also have a sequence directive which lets you take a sequence of queries and then accumulate the results from all these queries and then collect the output and return one block of information instead of different queries. How does this work? We get to our code. Let me go to the branch for exercise number six. So question number six is also, yeah, so bring together these things using that sequence query and then you should be able to, let me get the markdown preview. Yeah, so we want to have one query to get books information and then we want to have the combined information from a different API. So previously we had this one, so we had a query to get a book or the query to get information from Google books and probably this no longer works, it still works. And now we want to combine them. And for this, I created a new file called collections. And in here, I have two things. So I have a query to collect information and I have an operation that has a sequence. So what it does, it's called get books. First, it calls the query get books. So first it calls this one. So to get all the books. And then from the books, it will take the keyword, detect the ISBN fields. So this field and the user's input for this query because the other one is Google books. So whenever you call the query get books, it will first call query get all the books, then it will call the query to get a single book based on the ISBN that comes from this query. And then once returns, it takes all the fields and then it collects them like this. So we have a collect query that takes everything that's returned from the first and the second query. And then it combines them into one using a connector. And then the result type will be book result. So to collect query will be done for every result. So every result from books, every results from Google books, it will bring them together. And then the output of all the books will be an array of book results. And look result is the output of just one connector. So you've defined it here as a query, but it doesn't calls anything on the back end.

The only thing it does, it takes the results from these queries, merges us together, and that returns you all the info from just one point. So this is a nice way to bring together your data. And what you also could have done, you could have gone to the rest standpoint, or you could have said, is maybe like, hey, I want some meta information. I don't know, maybe it's book meta. And then what you could have done here is also maybe use the materializer to connect the Google Books one. So that could have been a way to solve this, but instead we use the sequence in order to have a sequence of operations and then return one thing. So what is also nice for her, you could also use a sequence in order to do authentication. So first you authenticate the user. Once it's authenticated, you go to the next step in a sequence. And once it's not, you can just kill the sequence and collect different information. So that is one way to do this.

And then we had some bonus questions as well. I'm not sure if we have time for it, but instead I can also show you how to do it. So we've been using the REST API for most of the part now, but instead we could also use an example, MySQL API. So go to MySQL, then we need to run the commands to start the Docker. So this will start a Docker, that's already running. And then if we go to the thing we should see, we also should have, read me over here. So this starts a local Docker, but what StepZen needs is a remote container. So it needs to be able to connect remotely to this Docker or to this database because StepZen is running in the cloud. So if you're developing stuff locally, you need to create this tunnel. As soon as you deploy your database, you're fine because a deployed database is available to external networks. So we're just gonna start this external tunnel. It gives us TCP routes that we can use in our config.djamal. This will be running our MySQL thing. And then in our index file, we should say, we also take the MySQL database. Like this. And now we probably get an error because all these things are already there. We already have things named book, names author. So what do we want to do? So we have for MySQL database, we have book here. Let's get author out of there because we want to get our book from MySQL. Let's get author out. Yes. So now all the author errors are gone because we're going to get a book from MySQL and then we go to the rest API and I'm going to say book shouldn't be here because books come from MySQL and we get everything related to book out of there. And just save it. This is gonna redeploy. And then we should be able to maybe not do this query. Refresh for starter. So now if we do a query to get books, I'm gonna get the name of the book, ISBN of the book, we're gonna go for author and the author name. Now if we run this, you can see we have books, we have name ISBN, which is coming from MySQL because this says here that's query of books, it's getting a DB query, MySQL is getting stuff from the books table, but then it also says that things, information from author, it comes from materializer and a query author, and the query author is defined here in the schema for rest API. So you can see it right here. So this brings together MySQL and REST. And then of course, we also have the Google Books API. She said here in our collection. So with this, we can get name description, ISBN, thumbnail, and this combines the Google Books API with MySQL. In this case, we were running this instead of REST, we can do a books. Name, ISBN, and then thumbnail we saw before, and then this should also run. And now it gets this information from MySQL and this from the Google Books API. And you could go even further and also throw in the REST API to get an author field. This is something you could do, now you need to make some changes here as well. So what you could do is at author, just pick this one there. And then put it in our collection. But then we don't have the author ID there. So you need to make sure that you also collect this one. It's probably an integer or something. So you could also connect it like this and then make sure to also collect it. So to collect the author ID. So you know the drill. So basically just putting in all these things here. And then you can also connect the REST API to it. So then you have multi-connected, and we have MySQL, REST and the Google Books API.

So then you have multi-connected, and we have MySQL, REST and the Google Books API. And then you can do the same for Postgres. So it isn't, well, it's quite sophisticated, but it looks like less work than it is. Of course, it's also making sure that you understand what StepZen is doing, what GraphQL is doing, and then bring all these bits and pieces together.

So that's basically it for this workshop. And then I would like to know, are there any questions from people? We've now saw how to use StepZen, you know how to connect different data sources, but maybe people have questions about maybe StepZen as well, but maybe other GraphQL parts? So I think we have about 50 minutes left to discuss these things.

Okay, so there we go. Okay, well if there aren't any questions, then thanks a lot for joining this workshop. I hope you enjoyed and learned some new tricks for it. Make sure if you haven't already to create a StepZen account to be able to run this workshop. Let me again share the link with you and also the link for the StepZen Discord. So this will be the place where you can ask additional questions. So after this workshop, you feel some things need to be explained again or some things might be interesting to you, make sure to join our Discord and ask your questions there because this is the best place to ask questions as soon as you start integrating StepZen for your company. So thanks everybody. I hope you enjoyed the workshop and maybe we see each other again at some time during the conference. So thank you. Enjoy your evening if you're in Europe and the rest of your day if you're somewhere else.