Time for REST APIs to Rest Forever ⚰️ All hail GraphQL 🌈

Problems with REST which GraphQL solves:

  1. Baggage of extra data: Presently with REST what happens is that, whenever client request data fro the server, server doesn’t care what is asked. It returns all it has got on that particular endpoint. You get a huge load of JSON. Most of which isn’t even required. This over-fetching of data must be stopped! Upon using GraphQL, client is taken seriously by the server. Server only responds with ONLY what is asked. Nothing extra. Yes, the query made by client is specific. But imagine the roundtrips, memory, bandwidth you will save. Immense.
  2. Orchestrating information from multiple endpoints is impossible: Imagine a scenario where client has requested for data which requires response to be a mix of data from different resources. If the number of resources is less, a smart developer may be able to manage with REST. But if the number of resources increases, it’s going to be hellish. GraphQL doesn’t have any concept of “multiple endpoints”. There is only one endpoint which holds ALL the data. So when client asks for data, it becomes easy to give a response in less time. (Let’s keep in mind that GraphQL sits between client and server.)

So how is GraphQL a panacea for these problems? Where’s the magic?

Mind blowing engineering is the magic. GraphQL is made by Facebook. Make sure you visit their website here.

Source: GraphQL official site
Source: GraphQL official site

Let’s get some hands on experience of this powerful best! 😈

(I’ll be using NodeJS because that’s my favourite.) I am not going to explain NodeJS part. I am assuming you have basic understanding of the same.

Step 1: Getting started

Open your terminal and make a directory for the project and initialise package.json.

$ mkdir graphql-example
$ cd graphql-example
$ npm init

Step 2: Gathering dependencies

  1. Apollo Server: Production ready server for GraphQL
  2. GraphQL: To run the queries
$ npm install --save apollo-server graphql

Step 3: Set up Apollo server

Apollo server will handle our queries by GraphQL. In this example, we will be using a simple array of items. In real world app, your data resources may be PostgreSQL or MongoDB or DynamoDB etc.

const { ApolloServer, gql } = require('apollo-server');//Our data
const menu = [
{
item: 'Pizza',
price: '100',
},
{
item: 'Lasagna',
price: '150',
},
];
//Building schema in GraphQL
const typeDefs = gql`
type Menu {
item: String
price: String
}

type Query {
menu: [Menu]
}
`;

const resolvers = {
Query: {
menu: () => menu,
},
};

const server = new ApolloServer({ typeDefs, resolvers });

server.listen().then(({ url }) => {
console.log(`🚀 Server ready at ${url}`);
});

Step 4: Start the server

$ node index.js
This is our playground!

Step 5: Running the query

So left side is your query and right side is your response.

{
menu {
item
}
}

FINISHED. Congratulations!

I hope you enjoyed reading it. Please clap if you liked it. Thank you. 😁

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store