1. Install dependencies

In order to use Contentful as a CMS, the first step is to install the following dependencies.

1. gatsby-transformer-remark
2. gatsby-source-contentful
3. @contentful/rich-text-react-renderer
4. @contentful/rich-text-types

npm install gatsby-transformer-remark gatsby-source-contentful @contentful/rich-text-react-renderer @contentful/rich-text-types

2. Update gatsby-config.js

After installing the dependencies update the gatsby-config.js file

On the top of the file paste following code

require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`,
})

After that add the following code to the plugins array

    {
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: `843vngvcufpj`,
        // Learn about environment variables: https://gatsby.dev/env-vars
        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
      }
    }

if (process.env.ENVIRONMENT !== 'production') { dotenv.config(); }