GraphQL has become incredibly popular in the last few years

 most exciting thing to happen to APIs - there are a 

 of benefits to GraphQL and, in fact, I’d go so far to say as that 

As you probably know, REST is one of the most popular forms of structuring APIs over HTTP. (If not, you can 

 have mentioned they’ve heard of GraphQL and are interested in learning it.

I’ve used GraphQL for years, and here’s just a few reasons why GraphQL is a 

GraphQL queries mirror the data they request 🔍

With GraphQL, no longer will we ever need to make a request from the client for a specific set of data, but where a large amount is unnecessarily returned.

Before we tell our GraphQL API how we want each field in our API to be resolved, we’ll need to tell GraphQL the 

 of the resolved values of each of the fields. This allows GraphQL to provide 

 error messages when a query fails based on an incorrect value type.

GraphQL and TypeScript work splendidly together 🚀

 well together. In fact, numerous tools exist (like the 

 generate TypeScript definitions from a GraphQL API.

GraphQL and Apollo is a magical combination ✨

Many different tools currently exist around working with GraphQL but none we’ve come across as powerful as the 

Among a suite of many different tools exists the 

 package where a production-ready and intuitive GraphQL API can be built within a Node.js application.

The Apollo Client library also exists to allow 

 applications to fetch data from a GraphQL API with complete state management and in a declarative manner (with Hooks!).

Tons of organizations have started to adopt GraphQL to power their large scale websites and mobile apps. Here are some recent examples of the many different organizations adopting GraphQL.

<h1 data-node-type="titlePlaceholder" class="titlePlaceholder">Why GraphQL is the new REST</h1><p style="line-height: 1.3125em;">As I’ve mentioned before,&nbsp;<a href="https://2018.stateofjs.com/data-layer/graphql/" rel="noopener noreferrer nofollow">GraphQL has become incredibly popular in the last few years</a>.</p><p style="line-height: 1.3125em;">I consider GraphQL to be&nbsp;<em>the</em>&nbsp;most exciting thing to happen to APIs - there are a&nbsp;<em>ton</em>&nbsp;of benefits to GraphQL and, in fact, I’d go so far to say as that&nbsp;<strong>GraphQL is the new REST</strong>.</p><blockquote class=""><p style="line-height: 1.6em;"><em>As you probably know, REST is one of the most popular forms of structuring APIs over HTTP. (If not, you can&nbsp;<a href="https://www.infoq.com/articles/rest-introduction/" rel="noopener noreferrer nofollow">read more about that here</a>)</em></p></blockquote><p style="line-height: 1.3125em;">It’s not just me, either:&nbsp;<strong>GraphQL has exploded in popularity</strong>, In the&nbsp;<a href="https://2018.stateofjs.com/data-layer/graphql/" rel="noopener noreferrer nofollow">State of JavaScript survey</a>,&nbsp;<strong>over 60% of respondents</strong>&nbsp;have mentioned they’ve heard of GraphQL and are interested in learning it.</p><p style="line-height: 1.3125em;">I’ve used GraphQL for years, and here’s just a few reasons why GraphQL is a&nbsp;<strong>game changer</strong>&nbsp;in application development today:</p><h2><a name="graphql-queries-mirror-the-data-they-request-🔍" id="graphql-queries-mirror-the-data-they-request-🔍">GraphQL queries mirror the data they request 🔍</a></h2><figure class="photo figure-position-inline"><img src="https://s3.amazonaws.com/assets.fullstack.io/n/20201011224818387_s_E5039B6542016B2277713F494329D023E7B9D2547DF989996AF9CFAB7199F570_1572915674217_image.png" attachmentid="8547755c-3e74-4a3a-98fb-25b966a96e68" contenteditable="false" data-width="3840" data-height="1861"><div></div></figure><p style="line-height: 1.3125em;">With GraphQL, no longer will we ever need to make a request from the client for a specific set of data, but where a large amount is unnecessarily returned.</p><h2><a name="graphql-queries-are-strongly-typed-💪" id="graphql-queries-are-strongly-typed-💪">GraphQL queries are strongly typed 💪</a></h2><figure class="photo figure-position-inline"><img src="https://s3.amazonaws.com/assets.fullstack.io/n/20201011224936419_s_E5039B6542016B2277713F494329D023E7B9D2547DF989996AF9CFAB7199F570_1572915822371_image.png" attachmentid="b53d4fdd-819c-40a4-adcb-0466ce7b2311" contenteditable="false" data-width="3840" data-height="1856"><div></div></figure><p style="line-height: 1.3125em;">Before we tell our GraphQL API how we want each field in our API to be resolved, we’ll need to tell GraphQL the&nbsp;<em>type</em>&nbsp;of the resolved values of each of the fields. This allows GraphQL to provide&nbsp;<em>descriptive</em>&nbsp;error messages when a query fails based on an incorrect value type.</p><h2><a name="graphql-and-typescript-work-splendidly-together-🚀" id="graphql-and-typescript-work-splendidly-together-🚀">GraphQL and TypeScript work splendidly together 🚀</a></h2><figure class="photo figure-position-inline"><img src="https://s3.amazonaws.com/assets.fullstack.io/n/20201011225021431_s_E5039B6542016B2277713F494329D023E7B9D2547DF989996AF9CFAB7199F570_1572916154790_image.png" attachmentid="abeb8562-6ed9-4b79-aaf5-b13bb500eac4" contenteditable="false" data-width="3104" data-height="1770"><div></div></figure><p style="line-height: 1.3125em;">Since GraphQL and TypeScript are&nbsp;<em>both</em>&nbsp;strongly typed languages, they work&nbsp;<strong>incredibly</strong>&nbsp;well together. In fact, numerous tools exist (like the&nbsp;<a href="https://github.com/apollographql/apollo-tooling" rel="noopener noreferrer nofollow">Apollo Command Line Interface</a>) which allow us to&nbsp;<em>automatically</em>&nbsp;generate TypeScript definitions from a GraphQL API.</p><h2><a name="graphql-and-apollo-is-a-magical-combination-✨" id="graphql-and-apollo-is-a-magical-combination-✨">GraphQL and Apollo is a magical combination ✨</a></h2><p style="line-height: 1.3125em;"></p><figure class="photo figure-position-inline"><img src="https://s3.amazonaws.com/assets.fullstack.io/n/20201011225132774_s_E5039B6542016B2277713F494329D023E7B9D2547DF989996AF9CFAB7199F570_1572916639514_image.png" attachmentid="3f5fd056-93e2-4778-b1c0-3da35863c9ea" contenteditable="false" data-width="3104" data-height="1770"><div></div></figure><p style="line-height: 1.3125em;">Many different tools currently exist around working with GraphQL but none we’ve come across as powerful as the&nbsp;<a href="https://www.apollographql.com/" rel="noopener noreferrer nofollow">Apollo Platform</a>.</p><p style="line-height: 1.3125em;">Among a suite of many different tools exists the&nbsp;<a href="https://www.apollographql.com/docs/apollo-server/" rel="noopener noreferrer nofollow">Apollo Server</a>&nbsp;package where a production-ready and intuitive GraphQL API can be built within a Node.js application.</p><figure class="photo figure-position-inline"><img src="https://s3.amazonaws.com/assets.fullstack.io/n/20201011225209165_s_E5039B6542016B2277713F494329D023E7B9D2547DF989996AF9CFAB7199F570_1572916817437_image.png" attachmentid="e92ee3db-901a-413b-85b6-e5f0289d7ba5" contenteditable="false" data-width="3104" data-height="1770"><div></div></figure><p style="line-height: 1.3125em;">The Apollo Client library also exists to allow&nbsp;<strong>React</strong>&nbsp;applications to fetch data from a GraphQL API with complete state management and in a declarative manner (with Hooks!).</p><h2><a name="graphql-is-battle-tested-⚔️" id="graphql-is-battle-tested-⚔️">GraphQL is battle tested ⚔️</a></h2><p style="line-height: 1.3125em;">Tons of organizations have started to adopt GraphQL to power their large scale websites and mobile apps. Here are some recent examples of the many different organizations adopting GraphQL.</p><ul><li><p><a href="https://medium.com/airbnb-engineering/how-airbnb-is-moving-10x-faster-at-scale-with-graphql-and-apollo-aa4ec92d69e2" rel="noopener noreferrer nofollow">Airbnb moves 10x faster with GraphQL and Apollo</a></p></li><li><p><a href="https://medium.com/paypal-engineering/graphql-a-success-story-for-paypal-checkout-3482f724fb53" rel="noopener noreferrer nofollow">PayPal considers GraphQL a complete game changer for their checkout experience</a></p></li><li><p><a href="https://developer.github.com/v4/" rel="noopener noreferrer nofollow">Github makes v4 of their public-facing developer API in GraphQL</a></p></li><li><p><a href="https://about.sourcegraph.com/graphql/graphql-at-twitter" rel="noopener noreferrer nofollow">Twitter utilizes GraphQL for TweetDeck, TweetLite, and their mobile apps</a></p></li><li><p><a href="https://www.shopify.ca/partners/blog/graphql-admin-api" rel="noopener noreferrer nofollow">Shopify releases their developer facing Admin API in GraphQL</a></p><p style="line-height: 1.3125em;"></p></li></ul><p style="line-height: 1.3125em;"><br></p>

Learn

The newline Guide to Building Your First GraphQL Server with Node and TypeScript

Teach

Amelia Wattenberger

Author of Fullstack D3

Community

Why GraphQL is the new REST

Tags

Responses (0)

Masterclasses

Tutorials

Fullstack React with TypeScript