Everything You Need to Get Your GQL Server Production Ready

Rate this content
Bookmark

There are always a lot of questions and conference talks about bringing GraphQL servers into production, but there aren’t a lot of good concrete steps and actions to follow. In the workshop Uri (The founder of The Guild) will walk you through The Guild’s process of bringing GraphQL Server into production.

We will add:

- Powerful Caching
- Logging, Monitoring and tracing
- Security features like Auth, Error Masking, Persisted Operations, Depth and Rate limit


If you are planning to have your GraphQL server running in production, this is a must have workshop for you!

This workshop has been presented at GraphQL Galaxy 2021, check out the latest edition of this Tech Conference.

FAQ

GraphQL Mesh is a tool that allows you to transform and integrate data from various sources (like REST, SOAP, gRPC, SQL, and more) into a unified GraphQL API. It automates the process of generating a GraphQL schema from these sources, which can significantly simplify the development process, ensure type safety, and allow you to query multiple data sources with a single GraphQL query.

Envelope is a plugin system for GraphQL that enhances server capabilities by allowing for highly customizable extensions. It offers advanced features like caching, performance enhancements through GraphQL JIT (Just-In-Time compilation), and support for modern GraphQL features such as live queries and defer/stream directives. Envelope facilitates easier integration with various server environments and improves maintainability and security of GraphQL servers.

GraphQL offers several advantages over traditional REST APIs, including efficient data fetching by allowing clients to request exactly what they need, reducing over-fetching and under-fetching issues. It also simplifies the API by using a single endpoint and improves real-time capabilities with features like subscriptions. Additionally, GraphQL provides a strong type system and introspective capabilities that make APIs easier to develop and consume.

Yes, GraphQL Mesh can handle various types of APIs including REST, SOAP, gRPC, SQL, and more. It can integrate these different data sources into a unified GraphQL schema, providing a consistent API layer over disparate data sources. This capability allows developers to work with various backends using the GraphQL query language, simplifying frontend development and backend integration.

GraphQL JIT, or Just-In-Time compilation, is a performance optimization technique used in the execution of GraphQL queries. By compiling queries into highly optimized executable functions during runtime, GraphQL JIT reduces the execution time and improves the throughput of GraphQL servers. This results in faster response times and better scalability, especially for complex queries or high-load environments.

GraphQL Mesh supports schema federation by allowing multiple GraphQL services to be combined into a single schema. It can merge schemas from different sources seamlessly, handling schema stitching and federation transparently. This enables organizations to split their GraphQL APIs into multiple services while still presenting a unified API to the clients, facilitating better scalability and maintenance.

Uri Goldshtein
Uri Goldshtein
130 min
08 Dec, 2021

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Uri from The Guild introduces GraphQL and its advantages over REST. Implementing GraphQL in production involves starting with a simple use case and using a product-driven schema approach. Code generation plugins and tools like GraphQL Mesh simplify the implementation of GraphQL. The workshop demonstrates how to install GraphQL Mesh, generate a schema, and configure sources. Envelope, a plugin system for GraphQL, provides customization and flexibility, simplifying server development and enhancing security.

1. Introduction to The Guild and GraphQL

Short description:

Uri, a member of The Guild, shares about the group's work and the open-source tools they build. The Guild focuses on sustainable open-source development and ensures their tools are used in production. The tools can be used separately and are designed to be flexible. Uri introduces GraphQL and its advantages over REST, such as reducing round trips and over-fetching. He mentions the project to improve graphql.org and invites others to contribute. The client can query the GraphQL Engine, which executes the query and returns the requested data.

So I'm Uri. I'm a member of a group called The Guild. How many of you heard about The Guild? No one? I've heard. Okay, cool. So I'll just share a bit. The Guild is a group of open source developers. I personally started this group a couple of years ago. I used to work at Apollo. I was actually in the team that started Apollo. We built another thing called Meteor. It was a JavaScript framework, and we thought what would be the next version of Meteor. Back in the day, it was just the days that Facebook opened source to GraphQL. So we thought that maybe the next version of Meteor will be based on GraphQL. And that's how we started Apollo Client, and Apollo Server, and GraphQL Tools Library, and many things that are still popular today.

So I started there at Apollo, and then after a while, I decided to build another group that is structured a bit differently to basically build a sustainable open-source. So the libraries will be well-maintained for the long run, for many, many years, and there wouldn't be pressure of, like, there would be less pressure of selling a product but more of just making sustainable open-source. So that's the yield, like, tools that we build today are GraphQL Code Generator that I'll talk a bit about today, GraphQL Mesh, Envelope, GraphQL Inspector, GraphQL Modules. Very new, we took over GraphQL Yoga, if some of you have heard in my talk, I'm doing also the keynote for GraphQL Galaxy, and in the keynote I'm gonna announce something about that, so you will know that even earlier than everyone. We basically today are the biggest open-source group in GraphQL, and we also do a lot of work that is outside of the GraphQL realm, like with OpenAPI and all kinds of other APIs, like JSON Schema, grpc, all kinds of other, so we do work there as well, so that's a bit about us, and how we work is that we work with actually clients, with companies. We build open-source tools, and then we consult, and also help them introduce the tools, and improve the tools, and things like that, so all of the tools are being built out of real necessity, like that we don't open-source a tool that none of our clients are actually using in production, everything open-source is something that we use in production, so you can know that you can rely on it, and you know there's an actual need for it, and it's not like something we're selling to you, or we do it for popularity reasons, or things like that, so that's a bit about the Guild, every member of the Guild is a member that actually contributed to open-source before they joined the Guild, and also sometimes maybe it's hard for you to find our libraries, because all of the libraries are under people's names, and not under the Guild name, we believe this is a better model for a more sustainable open-source, it's very rare, it's not something that is very common, but that's how we do it today.

I mentioned the Guild in the beginning, we build a lot of different tools, I won't talk too much about that, but just that all of our tools are built in a specific way, both in the open-source way that I mentioned at the beginning, and also they complete a full platform, so the idea is that it provides you with everything you need from the backend to the frontend to build an app, but you could use them completely separately, we're not pushing you to use them, it's not like a vendor locked platform, each tool could be used by itself, we try to break down these tools into the smallest pieces we can, so they will be the most flexible that's possible. And I'm mentioning it now because I think it's important and that's also part of the reasons of why we created some new tools that I would introduce today, because we think in that way actually we can solve things better. And so, I'll touch a bit about that and I'm also doing my introduction to the tools. I'll share maybe a tutorial with you that I think in my opinion, it's better structured compared to other GraphQL tutorials out there because it separates some things. So, I'll get to that soon. But let's go back to the basics of GraphQL. Again, everyone here knows probably a bit about what GraphQL is. It's a query language. You could describe the data that you want to query in a schema. That data could be any data. That's the interesting part about GraphQL. It's a query language, but unlike SQL, where you need to structure your data and your tables in a certain way, here, you could basically create a schema, query that schema, get predictable results. But that schema could describe any data. It could be something you layer on top of a REST API, which is very common. It could be just a file. It could be a database. It could be anything that you have, any data that you want to query, an Excel spreadsheet, anything. So that's interesting because you can now start building graphs of data, of whatever data you have. And you can also layer it in places that are, let's say, that maybe you didn't think about before. I hope I can touch upon it again. So I'm skipping this one. It's just an example of, with REST, you could like query any, if you want to get a list of chats and stuff like that, then you're gonna like query back and forth and maybe you need multiple requests and response. And you could build custom REST endpoints, right? So it's not always true. You could build the perfect REST GraphQL endpoint and you will still get exactly what you want. But that means that that work is being done on the backend. With GraphQL, the client could just describe what they want and get exactly what they want. So extra round trips is like something that a lot of people are talking about as a, I don't know, is something that GraphQL could solve and also over fetching, right? Like you might have an endpoint and in this case it's a certain endpoint for repos on GitHub and you're going to get tons of information that you might not need. So over the wire where that matters, you're going to get a lot of information. This is just something I copied from GraphQL.org. By the way, we are now kind of like we rebuilt the infrastructure for GraphQL.org and we were trying to make it the better resource. So, one thing if any of you are actually interested in documentation and helping your team on board and things like that, I hope to make graphql.org the best place to go and learn about GraphQL and to find all the resources and everything I'm saying now, hopefully you won't need to talk to me. You can just go to graphql.org. So, if any of you are interested in helping, this project didn't move so much for many years and now we to cover it and hopefully we can make graphql.org a better website. So yeah, so, you know, GraphQL what everyone is displaying is that like, I can query for just the data that I need and I can send one query and get back one result. Today we're going to talk about more advanced stuff as well. A bit about, you know, maybe an illustration of how it works. So we have a client and let's say some data sources and in the middle we put, let's call it the GraphQL Engine instead of a GraphQL server. And I hope you can, later on you'll understand why I'm calling it an engine and not a server. So, and we can describe the data of all these data sources using a schema. So you write that schema. There's many different ways of running that schema. We can talk today also about like different ways of writing a schema, that schema could, it could be written merely. And that manual schema could be written in what's called an SDL. So the actual language of GraphQL, what you can see here on the left, but it's gonna also be written with code. So you could write like classes that represents these data structures and there's plus and minus or objects that represents these data structures. And there's plus and minuses for both approaches. And there's also different libraries for all these approaches. If you're interested in that, let me know because I have a lot of opinions about that. So we describe the schema and then the client can basically query for a certain thing that they want, let's say in this case, the user with AB2 and a name, and then the graphical engine would get that query and will execute it in the most efficient way they can. So they would go and fetch maybe the user and then extract from the user object the name and send us back what we actually need.

2. GraphQL's Function and Benefits

Short description:

GraphQL automates a lot of the data work we do, awaits and orchestrates network calls, and shapes data as needed. It provides network performance, a schema of the data graph, orchestration, automation, and the ability to model data from different sources. These are the benefits of GraphQL.

And if we want more information about the user, let's say we send a bigger query, so maybe the servo will get us back the user object and then the graphical engine will actually fetch in parallel the name and the messages if they can see that it can. And then maybe the content can come from a completely different source, but the way we modeled it, we modeled it like the client sees the data, wants to see the data and we modeled it like messages and their content are basically look like the content is basically the same. It's part of the messages object so then the client gets back one single results and it doesn't matter how complicated the server is or how many data sources or how many services your backend has. For the client they get the representation of the data that they expect, which is an important point, I think when we'll get to talk a bit about GraphQL mesh, which I'll talk, I hopefully get to talk today.

You will see that there's two different philosophies of how do we describe the schema of the data? The schema that is basically all of our data sources together in a graph or the schema that the client actually needs. And I hope to show you today that those are, might be two different schemas. So, yeah, so that's like a basic illustration of how GraphQL works, very basic. Now let's dive a bit deeper into that just to understand, because for me, when I talk about GraphQL, I actually just see that there's a function. So I'll show what that function is actually and what that function is actually doing.

So when we describe the data, we also write resolvers. Resolvers are the way to tell GraphQL how to fetch each field. In this case, you know, we have a function. Let's say we want the user's name. So we basically create the function that we know what is the object that it's gonna get as inputs. We know what the inputs that were getting into the function. In our case, it's like a user object, let's say. The parent of, the parent resolver, the entry point for the graph. And then we can execute any code we want. It's basically a function. So we can do whatever we want in that function, including calling another server or anything, and we need to return a string because we defined a string. So that's what we need to do when we create a GraphQL server or a GraphQL engine.

Now, everything you're gonna see in this slide is basically a slide that I'm trying to explain to you like the basic work of what the GraphQL function is doing internally. So everything here, I always, when they show that slide, I ask people to think while they are seeing that slide, where do you write the code today? So the GraphQL function basically gets these resolver functions that were created in the schema. Then it creates, and the other argument that it gets is a query. Really, think about it as a function that's called GraphQL and gets two variables, two inputs. One is called executable schema is that definitions that we see on the left, and their functions. And the other argument is that query that might change between different calls. And then what the GraphQL function will do is that it will get that id 10 that we got on the top, on the query, and execute the first box, the first function. And it will get back an a result. That result would be a user object, let's say. Now it knows by the credit that we need a name and a message. So what GraphQL will do is it will take the boxes and will execute them in parallel because it can, because both of these boxes are actually requiring the same parent value. So it will execute them in parallel. One box, the name will give us the string, we're done. So it will put that in the right place. Then the messages, we actually get three different messages, objects. And for each one of them, we want the title and the date. So now the GraphQL engine will actually run all these different boxes for all the different results. And when the results will arrive, because all of this is async, every box here is an async function. So we can call a remote endpoint or something like that. When the results will get, it will put all the results in the right structure in the right place and will give us back the results. That's the GraphQL function.

Now I think, so what we saw here is GraphQL not only like just minimizes the data that we send over the wire or something like that, but actually GraphQL automates a lot of the data work that we do ourselves, maybe in code or in other means. So GraphQL awaits and orchestrates all the different network calls that we needed to make and all the different actions that we needed to take in order to get the data that we want. And then it also shaped the data in the way that we want. And I think that's the biggest benefit of GraphQL in most environments. In most environments, it's not about necessarily saving some bytes over the network, but actually automating a lot of the data work that we do anyway. And the data work is done in many different ways. It could be done on the client, it could be done on a server, it could be even done on like data analytics services and stuff like that, they query many different services from many different data sources, get the data that they want, and then do some analysis. So all of these could potentially benefit from GraphQL. So, that's kind of like what I just said, like we get network performance, we get like schema of the data graph, but also we get orchestration and automation and we get to have relationships and to model all of our data in a certain way, even if there's many different sources that might not necessarily be connected otherwise. So those are some of the benefits that I think GraphQL has. By the way, if it's very basic, let me know and if you have questions or you want to take me into other directions while I'm saying that, then also let me know.

Watch more workshops on topic

React Performance Debugging Masterclass
React Summit 2023React Summit 2023
170 min
React Performance Debugging Masterclass
Top Content
Featured WorkshopFree
Ivan Akulov
Ivan Akulov
Ivan’s first attempts at performance debugging were chaotic. He would see a slow interaction, try a random optimization, see that it didn't help, and keep trying other optimizations until he found the right one (or gave up).
Back then, Ivan didn’t know how to use performance devtools well. He would do a recording in Chrome DevTools or React Profiler, poke around it, try clicking random things, and then close it in frustration a few minutes later. Now, Ivan knows exactly where and what to look for. And in this workshop, Ivan will teach you that too.
Here’s how this is going to work. We’ll take a slow app → debug it (using tools like Chrome DevTools, React Profiler, and why-did-you-render) → pinpoint the bottleneck → and then repeat, several times more. We won’t talk about the solutions (in 90% of the cases, it’s just the ol’ regular useMemo() or memo()). But we’ll talk about everything that comes before – and learn how to analyze any React performance problem, step by step.
(Note: This workshop is best suited for engineers who are already familiar with how useMemo() and memo() work – but want to get better at using the performance tools around React. Also, we’ll be covering interaction performance, not load speed, so you won’t hear a word about Lighthouse 🤐)
React Hooks Tips Only the Pros Know
React Summit Remote Edition 2021React Summit Remote Edition 2021
177 min
React Hooks Tips Only the Pros Know
Top Content
Featured Workshop
Maurice de Beijer
Maurice de Beijer
The addition of the hooks API to React was quite a major change. Before hooks most components had to be class based. Now, with hooks, these are often much simpler functional components. Hooks can be really simple to use. Almost deceptively simple. Because there are still plenty of ways you can mess up with hooks. And it often turns out there are many ways where you can improve your components a better understanding of how each React hook can be used.You will learn all about the pros and cons of the various hooks. You will learn when to use useState() versus useReducer(). We will look at using useContext() efficiently. You will see when to use useLayoutEffect() and when useEffect() is better.
React, TypeScript, and TDD
React Advanced 2021React Advanced 2021
174 min
React, TypeScript, and TDD
Top Content
Featured WorkshopFree
Paul Everitt
Paul Everitt
ReactJS is wildly popular and thus wildly supported. TypeScript is increasingly popular, and thus increasingly supported.

The two together? Not as much. Given that they both change quickly, it's hard to find accurate learning materials.

React+TypeScript, with JetBrains IDEs? That three-part combination is the topic of this series. We'll show a little about a lot. Meaning, the key steps to getting productive, in the IDE, for React projects using TypeScript. Along the way we'll show test-driven development and emphasize tips-and-tricks in the IDE.
Designing Effective Tests With React Testing Library
React Summit 2023React Summit 2023
151 min
Designing Effective Tests With React Testing Library
Top Content
Featured Workshop
Josh Justice
Josh Justice
React Testing Library is a great framework for React component tests because there are a lot of questions it answers for you, so you don’t need to worry about those questions. But that doesn’t mean testing is easy. There are still a lot of questions you have to figure out for yourself: How many component tests should you write vs end-to-end tests or lower-level unit tests? How can you test a certain line of code that is tricky to test? And what in the world are you supposed to do about that persistent act() warning?
In this three-hour workshop we’ll introduce React Testing Library along with a mental model for how to think about designing your component tests. This mental model will help you see how to test each bit of logic, whether or not to mock dependencies, and will help improve the design of your components. You’ll walk away with the tools, techniques, and principles you need to implement low-cost, high-value component tests.
Table of contents- The different kinds of React application tests, and where component tests fit in- A mental model for thinking about the inputs and outputs of the components you test- Options for selecting DOM elements to verify and interact with them- The value of mocks and why they shouldn’t be avoided- The challenges with asynchrony in RTL tests and how to handle them
Prerequisites- Familiarity with building applications with React- Basic experience writing automated tests with Jest or another unit testing framework- You do not need any experience with React Testing Library- Machine setup: Node LTS, Yarn
Master JavaScript Patterns
JSNation 2024JSNation 2024
145 min
Master JavaScript Patterns
Top Content
Featured Workshop
Adrian Hajdin
Adrian Hajdin
During this workshop, participants will review the essential JavaScript patterns that every developer should know. Through hands-on exercises, real-world examples, and interactive discussions, attendees will deepen their understanding of best practices for organizing code, solving common challenges, and designing scalable architectures. By the end of the workshop, participants will gain newfound confidence in their ability to write high-quality JavaScript code that stands the test of time.
Points Covered:
1. Introduction to JavaScript Patterns2. Foundational Patterns3. Object Creation Patterns4. Behavioral Patterns5. Architectural Patterns6. Hands-On Exercises and Case Studies
How It Will Help Developers:
- Gain a deep understanding of JavaScript patterns and their applications in real-world scenarios- Learn best practices for organizing code, solving common challenges, and designing scalable architectures- Enhance problem-solving skills and code readability- Improve collaboration and communication within development teams- Accelerate career growth and opportunities for advancement in the software industry
Build with SvelteKit and GraphQL
GraphQL Galaxy 2021GraphQL Galaxy 2021
140 min
Build with SvelteKit and GraphQL
Top Content
Featured WorkshopFree
Scott Spence
Scott Spence
Have you ever thought about building something that doesn't require a lot of boilerplate with a tiny bundle size? In this workshop, Scott Spence will go from hello world to covering routing and using endpoints in SvelteKit. You'll set up a backend GraphQL API then use GraphQL queries with SvelteKit to display the GraphQL API data. You'll build a fast secure project that uses SvelteKit's features, then deploy it as a fully static site. This course is for the Svelte curious who haven't had extensive experience with SvelteKit and want a deeper understanding of how to use it in practical applications.

Table of contents:
- Kick-off and Svelte introduction
- Initialise frontend project
- Tour of the SvelteKit skeleton project
- Configure backend project
- Query Data with GraphQL
- Fetching data to the frontend with GraphQL
- Styling
- Svelte directives
- Routing in SvelteKit
- Endpoints in SvelteKit
- Deploying to Netlify
- Navigation
- Mutations in GraphCMS
- Sending GraphQL Mutations via SvelteKit
- Q&A

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Don't Solve Problems, Eliminate Them
React Advanced 2021React Advanced 2021
39 min
Don't Solve Problems, Eliminate Them
Top Content
Kent C. Dodds discusses the concept of problem elimination rather than just problem-solving. He introduces the idea of a problem tree and the importance of avoiding creating solutions prematurely. Kent uses examples like Tesla's electric engine and Remix framework to illustrate the benefits of problem elimination. He emphasizes the value of trade-offs and taking the easier path, as well as the need to constantly re-evaluate and change approaches to eliminate problems.
Using useEffect Effectively
React Advanced 2022React Advanced 2022
30 min
Using useEffect Effectively
Top Content
Today's Talk explores the use of the useEffect hook in React development, covering topics such as fetching data, handling race conditions and cleanup, and optimizing performance. It also discusses the correct use of useEffect in React 18, the distinction between Activity Effects and Action Effects, and the potential misuse of useEffect. The Talk highlights the benefits of using useQuery or SWR for data fetching, the problems with using useEffect for initializing global singletons, and the use of state machines for handling effects. The speaker also recommends exploring the beta React docs and using tools like the stately.ai editor for visualizing state machines.
Design Systems: Walking the Line Between Flexibility and Consistency
React Advanced 2021React Advanced 2021
47 min
Design Systems: Walking the Line Between Flexibility and Consistency
Top Content
The Talk discusses the balance between flexibility and consistency in design systems. It explores the API design of the ActionList component and the customization options it offers. The use of component-based APIs and composability is emphasized for flexibility and customization. The Talk also touches on the ActionMenu component and the concept of building for people. The Q&A session covers topics such as component inclusion in design systems, API complexity, and the decision between creating a custom design system or using a component library.
React Concurrency, Explained
React Summit 2023React Summit 2023
23 min
React Concurrency, Explained
Top Content
Watch video: React Concurrency, Explained
React 18's concurrent rendering, specifically the useTransition hook, optimizes app performance by allowing non-urgent updates to be processed without freezing the UI. However, there are drawbacks such as longer processing time for non-urgent updates and increased CPU usage. The useTransition hook works similarly to throttling or bouncing, making it useful for addressing performance issues caused by multiple small components. Libraries like React Query may require the use of alternative APIs to handle urgent and non-urgent updates effectively.
Managing React State: 10 Years of Lessons Learned
React Day Berlin 2023React Day Berlin 2023
16 min
Managing React State: 10 Years of Lessons Learned
Top Content
Watch video: Managing React State: 10 Years of Lessons Learned
This Talk focuses on effective React state management and lessons learned over the past 10 years. Key points include separating related state, utilizing UseReducer for protecting state and updating multiple pieces of state simultaneously, avoiding unnecessary state syncing with useEffect, using abstractions like React Query or SWR for fetching data, simplifying state management with custom hooks, and leveraging refs and third-party libraries for managing state. Additional resources and services are also provided for further learning and support.
From GraphQL Zero to GraphQL Hero with RedwoodJS
GraphQL Galaxy 2021GraphQL Galaxy 2021
32 min
From GraphQL Zero to GraphQL Hero with RedwoodJS
Top Content
Tom Pressenwurter introduces Redwood.js, a full stack app framework for building GraphQL APIs easily and maintainably. He demonstrates a Redwood.js application with a React-based front end and a Node.js API. Redwood.js offers a simplified folder structure and schema for organizing the application. It provides easy data manipulation and CRUD operations through GraphQL functions. Redwood.js allows for easy implementation of new queries and directives, including authentication and limiting access to data. It is a stable and production-ready framework that integrates well with other front-end technologies.