Build a Java Web Application Using GraphQL API and Spring Boot

Previous

Next

• 1
• 2
• 3
• 4

Prerequisites

• A text editor or an IDE -- IntelliJ IDEA, Spring Tool Suite (STS) or Visual Studio Code
• JDK 1.8 or later
• Gradle 4+ or Maven 3.2+
• Contentstack account

Note: We have assumed that you are familiar with Contentstack and the Spring Boot framework for this tutorial. If not, refer to the docs (Contentstack and Spring) for more details.

Set Up Your App

Through this guide, you’ll learn how to:

1. Create a Stack
2. Import Content
3. Create Delivery Token
4. Build and Configure the App

If you want to learn how to build a project from scratch, refer to the Build app from Scratch section.

1. Create a Stack

   A stack holds all the data (entries and assets) that you would need to create a website. Log in to your Contentstack account, and create a new stack.

   Note down the stack API key as it will be required in the further steps.

2. Import Content

   For quick setup, we have already created a zip file that contains the required content types, content (entries and assets), languages, and environments that you need to get the website up and running.

   You can directly import these resources into your stack by using our command-line interface (CLI):

   1. Install the CLI by running the following command in your terminal (command prompt):

      npm install -g @contentstack/cli

   2. Log in to your Contentstack account:

      csdx auth:login

   3. Download the content zip file, extract it, and note down its path to use in the next step.
   4. In the Import content command, pass the stack’s API key and the content location (noted in the above step) to import the content:

      csdx cm:import -A -s <stack_ApiKey> -d <path_of_folder_where_content_is_stored>

      For example:

      csdx cm:import -A -s bltw2******** -d "C:\Users\Username\Desktop\cli\content

   This command will import all the required components into your stack. Moreover, it will auto-publish the content to all the environments.

3. Create Delivery Token

   A delivery token lets you fetch the published content of an environment. You can create a delivery token for the “development” environment for testing that we will use in the next step.

   Later, while executing this app, you can create tokens for other environments.

4. Build and Configure the App

   You have two ways to get started with the app:

   • Build App from Scratch (optional)
   • Configure Prebuilt App

   Build App from Scratch

   This is an optional step.

   If you want to build your web project from scratch, go to Spring Initializr, enter your project details, and add the following dependencies:

   • Spring Web
   • Thymeleaf
   • Spring Boot DevTools
   • Lombok
   • Rest Repositories
   • Spring Web Services
   • Validation
     

   Clicking on Generate will download the web-application.zip file.

   You can now start writing the code in the web-application > src > main > java > com > contentstack > webapplication > MainApp.java file of the project.

   Then, run the application by following the execution steps mentioned in the Configure Prebuilt App step.

   Configure Prebuilt App

   We have created a sample app with the required details for quick integration.

   Download the website code

   You’ll get the zip file of the project. Unzip it and perform the following steps:

   1. Open the project in any code editor or IDE of your choice and go to the src > main > java > com.contentstack.graphqlspring > MainApp file.
   2. In this file, there are three instances for each GraphQL function: products, about, and contact.

      In these instances, set the properties as mentioned below:

      • setURL: Mention the stack’s API key and environment name where content is published.
      • setHeader: Mention the delivery token of the environment

      For example, refer to the syntax of products function:

      GraphqlBuilder gqlInstance = GraphqlBuilder.Builder.newInstance()
      .setURL("https://graphql.contentstack.com/stacks/<stack_api_key>?environment=<environment_name>")
      .setQueryString("{ all_product { items { title description } } }")
      .setHeader("<delivery_token>")
      .build()

      Likewise, refer to this syntax for about and contact instances.

   3. Finally, run the application by following any of the following methods:

      Method 1: Using IDE

      If you’re using IntelliJ IDE, right-click on the interface, and click on Run GQLTestApplication.main.

      

      After the app debugs successfully, you can view the output on port number 8080 (localhost:8080)

   Method 2: Using terminal (command prompt)

   1. Open the terminal and point it to the project’s root directory.
   2. Then, run either of the following commands in the terminal:
      • Using Gradle:

        ./gradlew bootRun

      • Using Maven:

        ./mvnw spring-boot:run

   3. Open another terminal that points to this project’s root directory and run this command:

      curl localhost:8080

Additional Resource: You can also use the Contentstack Java SDK and Spring Boot to build a web application. Read our Build a Web Application Using Contentstack Java SDK and Spring Boot guide for more details.