Building a Decoupled Site with Drupal 8 and Gatsby Part 1

Submitted by galactus on Sun, 04/26/2020 - 02:54

Drupal + Gatsby

In this blog post, I'm going to discuss how to configure JSON API in Drupal 8 and exposing node to JSON format.

We are going to create a gallery of heroes of Mobile Legends (mobile multiplayer online battle arena) and exposed it to JSON format.

Alright, Let's get started!

  1. Create a custom content type "Hero".

  2. Create a vocabulary class and add a new term.

  3. Add image, class field.

  4. Enable JSON:API and JSON API Extras module.JSON module
    The JSON:API module provides zero-configuration out of the box.  Use JSON:API Extras to customize your API. JSON:API Extras provides a means to override and provide limited configurations to the default zero-configuration implementation provided by the JSON:API module.
  5. Configure JSON:API Extras. Edit "Hero" resource and disable the fields that we don't need.

    JSON API Extras configuration
  6. Only keep these fields.

    Field class
    Field image

  7. Create a "Hero".

    Create Hero
  8. Visit the resource path /jsonapi/hero



In the second part of this blog post, I'm going to discuss how to display the data from Drupal 8 to Gatsby so stay-tuned.