Implement the GraphQL query

In this part of the tutorial you’ll first implement the GraphQL query you created earlier in the tutorial to fetch data, then create mappings for the content types you’ve already added to Content Hub ONE, and then you’ll retrieve data from the app. During all of this, you’ll modify various files in the starter kit so you can open and view the website.


A predefined query for media items is used so that media items do not need to be included individually, and the query is broken out into files for each content type.

To implement the GraphQL query:

  1. In Visual Studio Code, open the starter kit repository and go to the /graphQL folder.

  2. Create a copy of the Recipe folder and name it Events.

  3. In the Events folder, create two copies of the recipe-query.ts file. This file defines the query.

  4. Name these three files speaker-query.ts, agenda-query.ts, and event-query.ts.

  5. Open each of the three files and modify them as shown in the following code samples, changing all mentions of recipes to the equivalent mentions of speaker, agenda, or event. For each file, ensure the new text matches the case of the original.

Do you have some feedback for us?

If you have suggestions for improving this article,