What is GraphQL

GraphQL is a data query layer.

GraphQL is a query language for your API, and a server-side runtime for executing queries using a type system you define for your data. https://graphql.org/

WHY?

This layer sits on top of backend services to can query which ever filed is necessary for frontend.

Backend API can have many purpose like deliver data for frontend, integrate with other third party services or maybe something else.

GraphQL comes from top down approach for front end, what data frontend needs it will fetch and deliver only those data to front end, nothing more nothing less.

By keeping front end requirement in minds it reduce multiple api call for data into a consolidated single api call to graphQL and graphQL will do multiple call to backend.

  • Distinct front-end clients for multiple platforms (web, iOS, etc.), each with different data requirements
  • A backend that serves data to clients from multiple sources (Postgres, Redis, etc.)
  • Complex state and cache management for both the frontend and the backend

Even with many other advantages, GraphQL’s single greatest benefit is the developer experience it provides. It’s straightforward to add new types and fields to your API, and similarly straightforward for your clients to begin using those fields. This helps you design, develop, and deploy features quickly

Typical Rest API end Point
This what it looks like when graphQL act as broker in between

Fragments

Fragments let you construct sets of fields, and then include them in queries where you need to.

Here’s an example of how you could solve the above situation using fragments:

Operation name

Here’s an example that includes the keyword query as operation type and HeroNameAndFriends as operation name

  • The operation type is either query, mutation, or subscription
  • The operation name is a meaningful and explicit name for your operation.

A directive can be attached to a field or fragment inclusion, and can affect execution of the query in any way the server desires. The core GraphQL specification includes exactly two directives:

  • @include(if: Boolean) Only include this field in the result if the argument is true.
  • @skip(if: Boolean) Skip this field if the argument is true.

Mutations

operations that cause writes should be sent explicitly via a mutation, like PATCH requests in REST.

if the mutation field returns an object type, you can ask for nested fields. This can be useful for fetching the new state of an object after an update

Enums or enumeration types are a special kind of scalar that is restricted to a particular set of allowed values.

enum Episode {
NEWHOPE
EMPIRE
JEDI
}

Interfaces

An Interface is an abstract type that includes a certain set of fields that a type must include to implement the interface.

For example, you could have an interface Character that represents any character in the Star Wars trilogy:

interface Character {
id: ID!
name: String!
friends: [Character]
appearsIn: [Episode]!
}

--

--

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