Tutorial: Hello World GraphQL Content API

In this tutorial, you will create and query a Hello World endpoint using the GraphQL Content API (GCA). As part of this process, you will create a content type and publish assets that you will query for using the GraphQL explorer.

This tutorial has two tracks depending on how you want to complete it:

• Editorially—An option for those who want to complete this tutorial solely in Brightspot.
• Programmatically—An option for those who want to complete this tutorial in both an IDE and Brightspot.

As part of the effort, you will complete the following steps:

1. Create a content type called Post and publish two assets from it.
2. Create a GCA endpoint and configure it so that it allows queries of Post assets.
3. Use the GraphQL explorer to fetch data from assets of the Post type.

Assumptions

This tutorial assumes the following:

• Familiarity with GraphQL
• Familiarity with the editorial process of creating a content type in Brightspot

Step 1: Creating a content type and publishing assets

Create a content type Post using one of the two methods described in the module below. After doing so, publish two assets in Brightspot of the Post content type. You will query for these assets later in this tutorial.

import com.psddev.cms.db.Content;

public class Post extends Content {

    private String message; 
}

Publishing assets

1. Depending on the path you take to reach this step, do one of the following:

   • Editorially—Navigate to the dashboard.
   • Programmatically—Log into Brightspot.
2. In the header, click add.
3. From the Misc Content Types list, select Post.
4. In the Message field, enter This is my first message.
5. Click Publish.
6. Click more_horiz, located to the right of the Publish button, and then select Copy This Post.
7. In the Message field of the new asset draft, enter This is my second message.
8. Click Publish.

You now have two assets of the Post content type you created that you will query later in this tutorial.

Step 2: Creating and configuring a basic GraphQL Content API endpoint

In this step, you will create a basic GraphQL endpoint using one of the two methods described in the module below, and then configure the endpoint such that it allows queries for assets of the Post content type.

import java.util.Set;

import com.psddev.dari.db.Recordable;
import com.psddev.dari.db.Singleton;
import com.psddev.graphql.gca.GCAEndpoint;
import com.psddev.graphql.gca.GCASchemaSettings;

@Recordable.DisplayName("Hello World")
public class HelloWorld extends GCAEndpoint implements Singleton {
      
    @Override
    public Set<String> getPaths() {
        return Set.of("/graphql/content/hello-world");
    }
    
    @Override
    protected GCASchemaSettings getSchemaSettings() {
        return GCASchemaSettings.newBuilder()
            .mutableEntryClass(Post.class)
            .build(); 
    }
}

Step 3: Querying for Post assets

You can now use the GraphQL explorer to query for Post assets.

1. Depending on the path you take to reach this step, do one of the following:
   
   • Editorially—Continue to step 2 (as you are already on the endpoint edit page).
   • Programmatically—In Brightspot, do the following:
     
     1. Click menu > Admin > APIs.
     2. From the Endpoints list on the left, select the Hello World endpoint you created.
2. In the top right of the screen, click more_horiz, then click GraphQL Explorer.
   
   Note

   Your role must have developer permissions in order to use the GraphQL explorer. For details, see Creating a role.
3. In the query panel in the middle, paste the following query:
   

   query MyQuery {
     Query {
       Records(from: {type: Post}) {
         ... on QuerySelect {
           __typename
           items {
             ... on Post {
               __typename
               _id
               message
             }
           }
         }
       }
     }
   }

4. Execute the query by clicking the Play icon. Your result should look similar to the following code snippet.
   

   {
     "data": {
       "Query": {
         "Records": {
           "__typename": "QuerySelect",
           "items": [
             {
               "__typename": "Post",
               "_id": "00000191-be89-d8ae-abf1-fe9b8e9b0000",
               "message": "This is my first message"
             },
             {
               "__typename": "Post",
               "_id": "00000191-be8a-d8ae-abf1-fe9b5c090000",
               "message": "This is my second message"
             }
           ]
         }
       }
     }
   }

You have now created a Hello World endpoint using the GraphQL Content API (GCA), and configured it such that you can now use it to query for content.