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<User> 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.