From REST to GraphQL: My First Impressions and Setup Experience

marella hemanth — Tue, 27 May 2025 06:25:39 +0000

Recently, I started exploring GraphQL while working on my MERN stack project. I learnt this through some youtube videos and some
other sources.
https://graphql.org/

What is GraphQL

GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data.It is created by Facebook and released public in 2015
GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.
It's like REST, but you only ask for the data you need.

Ask for what you need,get exactly that

GraphQL queries access not just the properties of one resource but also smoothly follow references between them.
While typical REST APIs require loading from multiple URLs, GraphQL APIs get all the data your app needs in a single request.
Apps using GraphQL can be quick even on slow mobile network connections.
Add new fields and types to your GraphQL API without impacting existing queries.

Lets Explore some Core concepts

1.Schema : It is a Blueprint of your GraphQL Api.

2.Queries : used to fetch Data.

3.Mutations : Used to modify data (Create, Update, Delete).

4.Resolvers : Functions that handle the logic for queries/mutations.

5.Types : Scalar: String, Int, Boolean, ID, Float

Object: Custom data types like Book, User, etc.

Input: Used for sending objects in mutations.

Lets see the setup for the GraphQL through VScode.

1.buildSchema(...): Defines a GraphQL schema using a special string format.

2.type Query: Every GraphQL schema must have a Query type — it’s the entry point for read operations.

3.hello: String: You define a field called hello that returns a string.

4.Line 14 is your resolver function.It maps to the field defined in your schema (hello).

5.When the client runs { hello }, this function runs and returns 'Hello Naresh IT!'.

6.Here comes the actual GraphQl Middleware

app.use('/graphql', ...): Connects the GraphQL middleware to the /graphql route.

schema: It Passes the schema you defined.

rootValue: The resolver functions.

graphiql: true: Enables the GraphiQL UI, a browser IDE where you can test your GraphQL queries.

Now Based on above Code to Run This Query open browser and run

{
  hello
}

you'll get


{
  "data":{
      "hello":"Hello Naresh IT!"
    }
}

So, in short GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data.I hope this makes your concept clear and understandable.

Official Website : https://graphql.org/
How to use Playground : https://graphqlzero.almansi.me/
GraphQL Playground: https://graphqlzero.almansi.me/api

See you later with more intresting topics 👋

Javascript Notes

marella hemanth — Sat, 25 Jan 2025 13:53:17 +0000

All Concepts from beginner to advanced might be helpful for Interviews

https://pdf.ac/F4CaF

My Portfolio

marella hemanth — Fri, 03 Jan 2025 14:49:44 +0000

Hola Guys i just finished my portfolio yet it may not be responsive but can you suggest me any ideas to improve it further and take it to next level and if you have any sort of suggestions feel free to give me ,I'm a junior web developer only 😁.

Forem: marella hemanth

From REST to GraphQL: My First Impressions and Setup Experience

What is GraphQL

Javascript Notes

My Portfolio