Some say that data is the new oil, but it isn’t enough to just have a vast amount of data - you also need to know how to use it efficiently. GraphQL is how you use data better. If you’re not clued up on GraphQL, the term could seem a little daunting. Today, we’re going to answer the question "What is GraphQL?" and show you what GraphQL is used for and why you should use it.
GraphQL is a syntax that describes how to ask a server for data. It’s used to send data requests to an API and load only that data for a client. With GraphQL, your apps get to decide what data they need and receive only that. GraphQL lets you ask for data in an organised way, which means you can build apps that are quick and efficient, even when network connectivity is poor. It’s a favoured tool among forward-thinking developers.
Simply put, GraphQL is a query language for your API. It’s an efficient query language because it allows you to control the data coming to your app from the server, making your apps more stable and faster as a result.
Traditionally, you would have had to make REST API requests to get the data you need. This is a cumbersome way to request data because it requires loading from multiple URLs. For every data type you need to know about, you’ll have to make a separate request. It’s up to the client (app) to distil that information, which is a slow process.
GraphQL takes the hassle out of making data requests, speeding up your apps in the process. It allows you to pull all the information you need in a single request. It does this by acting as a buffer between the server and the client.
To demonstrate what I mean, let’s think about a music app. In the app, you have a list of songs and artists. These are two separate data types, each with hundreds or thousands of entries in them. It may sound simple, but when you make a data request your app could have to sift through tonnes of data. That’s slow.
But that’s how a traditional REST API works. You have to make two separate requests between the client and the server to receive both song and artist. Your app then has to distil two separate lists to get the correct information.
GraphQL makes this way simpler. It stays between the client and the server at all times. It receives requests from the client, interprets these and sends a request onto the server. When it receives the data from the server, it changes the data output into a format the client wants and needs.
This modern syntax is used for making efficient data requests to servers. Its greatest feature is the fact that it allows you to only ask for the data you need. Because you get to decide how much data is returned from the server, your app can run more efficiently than with other query languages.
There are myriad companies using GraphQL right now. Some have been using it since 2012, like Facebook. Other users include Github, PayPal, Twitter, Sky and Hudl. All are making their apps more efficient by refining their data use.
Using GraphQL, you control the data coming to your app from the server
GraphQL makes apps quicker with less HTTP calls
You only get the data that you’ve asked for, making your code base more efficient
Want to use of data more efficiently in your apps? Then the GraphQL Bootcamp is for you. Our week-long intensive GraphQL training course helps devs upskill quickly.
Over five days, our students learn the fundamentals of GraphQL before moving on to learning advanced GraphQL API practices and how to apply this knowledge in the real world. We also show students how GraphQL can work hand-in-hand with React.
If you want to learn React and GraphQL, simply get in touch today!
We share our learning resources directly from our curriculum and we'd love for you to enjoy and learn from them!
Signup and learn about cutting-edge React thinking plus the latest news on our courses...
Looking to unsubscribe?
26 Mar 2019Introduction to Thinking in React
17 Oct 20185 reasons why advanced dev training will keep your company tech-relevant
25 Jan 2019
Share this on:
This website is built using Gatsbyjs. Curious about how this blog is implemented? It's open source so you can check the source code
Comments? Shoot me a tweet @reactjsacademy !