GraphQL – Introduction
Nowadays, most of the mobile applications have the requirement of fetching the data from the server where that data is stored either on a server or database. And as we know, it’s the responsibility of the API to provide an interface to the stored data that satisfies the application’s need.
A common way to fetch data from a server has been using REST for a long time. Therefore, REST was a good match for many applications.
Now the question is, why GraphQl came into existence?
The way APIs are constructed till now, has been challenged by three factors:
- Increased mobile usage generate needs for efficient data loading
- A variety of different frontend frameworks and platforms are available
- Fast development & expectation for rapid features development
For a very long time, REST has become the standard for designing web APIs.
But REST APIs are inefficient when a client asks for changes in their requirements frequently.
To overcome the limitations or extend the features of REST APIs, the use of GraphQL came into existence. GraphQL is more efficient, flexible, and faster than REST as it resolves most of the problems that used to occur in REST APIs.
What is GraphQL?
GraphQL is a new API standard that provides a more efficient, powerful, and flexible alternative to REST. It was developed and open-sourced by Facebook and now it is maintained by a large community all over the world.
Data Fetching with REST vs GraphQL
As we can usually collect the data with a REST API by accessing several endpoints.
- /users/<id> endpoint to fetch the initial user data.
- /users/<id>/posts endpoint that returns all the posts for a user.
- /users/<id>/followers that returns a list of followers per user.
On the other hand, in GraphQL you’d simply send a single query to the GraphQL server that includes all data requirements. The server then responds with a JSON object as per the requirement.
Does REST lead to Over-fetching or Under-fetching of data?
Yes, one of the biggest problems with REST, over-fetching and under-fetching. This occurs because reaching endpoints that return fixed data structures is the only way for a client to download data. And designing the API in such a way that it can provide customers with their exact data needs is very difficult.
What is Over-fetching?
Overfetching means that a client gets more information than what actually is required through the API.
What is Under-fetching?
Under-fetching is also called the n+1 request’s problem. Under-fetching means that a particular endpoint doesn’t provide enough of the required information. In this case, the client will have to make additional requests to get the required information.
Companies using GraphQL
Today, several different companies, such as GitHub, Twitter, Yelp, and Shopify, uses GraphQL in their production. And probably, these are just a few names.
If you want to have a look at some more brands using GraphQl, then refer this link Who’s using GraphQL?
And now you know what graphQL is and why it is better than REST. Now, this is the right time to move on to the core concepts of GraphQL.
Core Concepts of GraphQL
In this section, we will see some fundamentals of GraphQL, which includes the syntax for defining types, sending queries, and mutations.
What is Schema?
When working with a GraphQL API, the schema is one of the most important concepts. It specifies the capabilities of the API and defines how clients can request the data.
Basically, a schema is a collection of GraphQL types. However, there are some special root types, when writing the schema for an API:
type Query { ... } type Mutation { ... } type Subscription { ... }
What are Queries?
In REST APIs, data is fetched from specific endpoints. Each endpoint has a defined structure of the information that it returns.
In comparison to REST, the approach of GraphQL is different. GraphQL APIs typically only exposes a single endpoint, instead of having multiple endpoints that return fixed data structures. This is because the structure of the data that’s returned is not fixed, it’s completely flexible and the client decides what data is needed.
The client sends more information to the server to express its data needs – this information is called a query.
Ex: –
{ allNames{ name } }
The `allNames` field in this query is called the root field of the query. Everything after the root field is called the payload of the query. In our example name is the query’s payload.
This query would return a list of all names currently stored in the database. Here’s an example response:
{ "data": { "allNames": [ { "name": "dhiraj" }, { "name": "smit" } ] } }
Notice the name in the response, but the id is not returned by the server. That’s exactly because the name was the only field that was specified in the query. If the client also needed the persons’ ID, all it has to do is add one more field in the query.
Input
{ allNames{ id name } }
Output
{ "data": { "allNames": [ { "id": "1", "name": "dhiraj" }, { "id": "2", "name": "smit" } ] } }
In GraphQL, we have zero or more arguments in each field, all we need to do is to specify in the schema. For example:
{ allPersons(last: 2) { name } }
This query gives us the last 2 persons’ names.
What Are Mutations?
After fetching information from a server, many applications also need to change the data that’s currently stored in the backend. With GraphQL, these changes are made using mutations. There are three kinds of mutations:
- Creating new data
- Updating existing data
- Deleting existing data
Mutations follow the same syntactical structure as queries, but they always start with the mutation keyword. Here’s an example:
mutation { createTest(name: "sanket") { test { id name } } }
What are Subscriptions?
GraphQL offers the concept of subscriptions because many applications today have a real-time connection to the server in order to get immediately informed about important events.
Subscriptions using the same syntax as queries and mutations the only difference is it starts with a subscription keyword. Here’s an example:
subscription { newPerson { name } }
After a client sends this subscription to a server, a connection is established between them. Then, whenever a new mutation is performed that creates a new Person, the server sends the information about this person over to the client:
{ "newPerson": { "name": "Dhiraj", } }
How to use GraphQL in Django (Python) ?
Python is a general-purpose programming language, One of its most famous library is Django, which allows us to quickly prototype and build full web feature web applications with less code.
Last but not least, there’s a library called Graphene and Graphene-Django, exposing a simple and powerful API for creating GraphQL servers while building Django-based web applications.
Conclusion
GraphQL might seem a bit complex when using it for the first time because it’s a technology that reaches across many areas of modern development.
So whether you actually use it or not, it’s worth familiarizing yourself with GraphQL, as many big product-based companies and frameworks are adopting it, and in the next few years, it might become one of the key building blocks of the web or app development.
Hope you have found this blog helpful, thanks for reading.