The Concept of GraphQL

Understand the basic concept of GraphQL in this lesson.

Introduction to GraphQL

When developing a back-end application, many approaches can be chosen. Two popular approaches for developing back-end applications include REST API and GraphQL. GraphQL was created as an alternative to the REST API approach.

GraphQL is a query language that can be used for back-end applications, especially APIs. When using GraphQL, the client requests the required data (for example, the client only asks for the title and description of the product instead of all the data from the product) from the GraphQL server. Then, the server that implements GraphQL sends a response that only contains the client’s required data without sending other data that the client doesn’t need.

GraphQL can be implemented by many programming languages, like JavaScript, NodeJS, Python, Java, Go, and more. GraphQL can also be implemented with any database, such as relational and non-relational databases.

Components in a GraphQL application

The GraphQL application has two main components: schema and resolver.

GraphQL Schema

Schema is a query structure that can be used by the client that uses the GraphQL application. There are two main types of schema types: query schema for fetching the data and mutation schema for manipulating data such as create, update, and delete operations.

The structure of the schema in GraphQL is as follows:

schema_type schema_name {
   attribute_name:attribute_type
}

Here is an example of a schema for product data:

type Product {
   id: ID!
   name: String! 
   price: Int!
}

In the example above, the schema for product data is created with attributes. The ! mark means the value of the attribute must be filled or not empty.

Here is an example of a query schema used to get all the product data:

type Query {
   products: [Product!]!
}

In the schema above, the [Product!]! syntax means the attribute products has a type of collection that contains product data. The ! mark exists, which means to get the product data, the product’s attribute, like name or price, must be specified.

When creating a mutation schema, two components must be defined. Those components are the schema for data input and the resolver to handle the request or the data input.

The basic structure for input schema is as follows:

input inputName {
   attribute_name:attribute_data_type
}

Here is the basic structure for the resolver, which is stored inside the Mutation schema:

type Mutation {
   resolver_name(input: InputName): ReturnType
}

Here’s an example of a mutation schema for creating a new product:

input NewProduct {
   name: String!
   price: Int!
}

type Mutation {
   createProduct(input: NewProduct!): Product!
}

As seen in the schema above, the data input structure for creating a new product is specified in the NewProduct schema. The resolver for creating a new product is defined inside the mutation schema called createProduct(), which uses the NewProduct schema as an input. The return type of createProduct() is the Product schema, which means the product is returned after it’s created.

GraphQL Resolver

A resolver is a component that’s used to handle the query specified in the schema. The resolver is similar to the controller or handler in the REST API application. The resolvers are implemented based on the schema.

Get hands-on with 1200+ tech skills courses.