GraphQL Using Spring Boot (Code-First Approach)

Introduction

In this article, we will learn how to implement GraphQL API with the Code-first approach using SPQR library.

History

The issues that the REST method has like under-fetching & over-fetching is something which is resolved by GraphQL. GraphQL gives consumers freedom on which attributes they want instead of forcing consumers to have all attributes whether they want it or not. Historically, GraphQL started with a schema-first approach.

With a schema-first approach, it was very hard to maintain GraphQL schema & becomes very difficult to keep the GraphQL APIs in sync with schema.

As technology evolves & being an open-source initiative, the open-source community comes out with a code-first approach which is very easy to build & develop API & easy to maintain as well.

Tool(s)/Framework(s):

Editor  — IntelliJ Idea/Eclipse

Language  — Java 8 or above

Framework  — Spring boot

Communication medium  — GraphQL

Image Build Tool  — Docker

Orchestration  — Kubernetes(k8)

GIT Repo -

spring-boot/hello-graphql-service at main · shethaptech/spring-boot

Maven Dependency

Maven Dependency

Configuration

In application.yml, please refers to the configuration below.

graphql.spqr.gui.enabled — true/false — to enable GraphQL to query/mutate data

graphql.spqr.gui.pageTitle — page title for GraphQL UI

graphql.spqr.gui.target-endpoint — to access via REST API

graphql.spqr.gui.endpoint — to access GraphQL UI

graphql.spqr.base-packages — to scan resolver by @GraphQLApi annotation

graphql:
  spqr:
    gui:
      enabled: true   
pageTitle: Hello World  
target-endpoint: /graphql  
endpoint: /playground  
base-packages: com.shethap.tech.graphql

Model

Now, let’s define simple “User” POJO & we will implement CRUD operations using GraphQL code-first approach for retrieve/save/delete/update operations.

@data

@Builder

public class User {

private String name;

private Integer id;

private Date registrationDate;

}

Implementation

Here, in this section, we will try to understand a few important annotations which will help us to avoid writing GrapQL schema.

@GraphQLAPI  — this annotation is used for the GraphQL resolver. It can be used along with @Component/@Service.

For Ex:

@GraphQLApi

@Component

public class UserAPI

@GraphQLQuery  — This annotation is used to define the GraphQL query. It is almost the same as REST @GetMappping (HTTP GET method) which is generally used to retrieve data.

For Ex:

@GraphQLQuery(name = "getUsers", description = "to get all the users")

public List getUsers() {

return userService.getUsers();

}

@GraphQLMutation  — This annotation is used to define GraphQL Mutations. It is similar to REST PUT/POST/PATCH operations & used to save, update or delete the data.

For Ex:

@GraphQLMutation(name = "saveUser", description = "to save user")

public User saveUsers(@GraphQLArgument(name = "user") User user) {

return userService.saveUser(user);

}

@GraphQLArgument  — this annotation is used to provide input to the GraphQL APIs. It is similar to @RequestParam or @RequestPath which is used to accept the inputs.

For Ex:

public User saveUsers(@GraphQLArgument(name = "user") User user)

Testing

Please get the project from the git repo, setup the elicpse/IntelliJ workspace run the application.

Once application is up, please hit the URL which we have configured using graphql.spqr.gui.endpoint property, in our case, its “/playground”.

So, we can hit the below URL in our local setup & can see that GraphQL UI is up & running & we can verify our query/mutations.

GraphQL UI

Key takeaways

→ Code-first approach fasten the development.

→ Schemas getting generated automatically so no schema maintenance required.

→ Annotation driven so less line of code.

→ Easy to test & mock the APIs.

→ No seperate implementation required for GraphQL resolver & data fetchers which are required in schema-first approach.