Posts not updated when created via Netlify CMS - reactjs

Question

I've created a new post through Netlify CMS however the posts are not updating on the Gatsby site. I thoroughly followed the add Netlify CMS to existing sites documentation and everything seems to be working fine except the posts is not showing up on my site.
Here are the links to my site with repo and the config.yml file:
My site: https://my-blogger.netlify.app/
My repo: https://github.com/mohammedasker/blogger
config.yml
backend:
name: git-gateway
branch: master
media_folder: "static/media"
public_folder: "/media"
collections:
- name: "blog"
label: "Blog"
folder: "src/content"
create: true
slug: "{{year}}-{{month}}-{{day}}-{{slug}}"
fields:
- { label: "Layout", name: "layout", widget: "hidden", default: "blog" }
- { label: "Title", name: "title", widget: "string" }
- { label: "Slug", name: "slug", widget: "string" }
- { label: "Draft", name: "draft", widget: "boolean", default: true }
- { label: "Description", name: "description", widget: "text" }
- { label: "Publish Date", name: "date", widget: "datetime" }
- { label: "Body", name: "body", widget: "markdown" }
Additional information
I've noticed in the deploy details that the path value is null in "gatsby-node.js" and this might prevent the post from being updated. That being said, the problem continues to persist when the deploy was all green.
Build log:
8:26:23 PM: Build ready to start
8:26:25 PM: build-image version: ca811f47d4c1cbd1812d1eb6ecb0c977e86d1a1d
8:26:25 PM: build-image tag: v3.3.20
8:26:25 PM: buildbot version: be8ecf2af866e16fa4301cc5c14de2ccbbb21cf4
8:26:25 PM: Fetching cached dependencies
8:26:25 PM: Starting to download cache of 139.0MB
8:26:26 PM: Finished downloading cache in 725.651881ms
8:26:26 PM: Starting to extract cache
8:26:32 PM: Finished extracting cache in 6.022644176s
8:26:32 PM: Finished fetching cache in 6.792240623s
8:26:32 PM: Starting to prepare the repo for build
8:26:32 PM: Preparing Git Reference refs/heads/master
8:26:33 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'public' versus 'public/' in the Netlify UI
8:26:33 PM: Starting build script
8:26:34 PM: Installing dependencies
8:26:34 PM: Python version set to 2.7
8:26:34 PM: Started restoring cached node version
8:26:36 PM: Finished restoring cached node version
8:26:37 PM: v12.18.0 is already installed.
8:26:38 PM: Now using node v12.18.0 (npm v6.14.4)
8:26:38 PM: Started restoring cached build plugins
8:26:38 PM: Finished restoring cached build plugins
8:26:38 PM: Attempting ruby version 2.7.1, read from environment
8:26:39 PM: Using ruby version 2.7.1
8:26:39 PM: Using PHP version 5.6
8:26:39 PM: 5.2 is already installed.
8:26:39 PM: Using Swift version 5.2
8:26:39 PM: Started restoring cached node modules
8:26:39 PM: Finished restoring cached node modules
8:26:39 PM: Started restoring cached yarn cache
8:26:39 PM: Finished restoring cached yarn cache
8:26:40 PM: Installing NPM modules using Yarn version 1.22.4
8:26:40 PM: yarn install v1.22.4
8:26:40 PM: [1/4] Resolving packages...
8:26:41 PM: success Already up-to-date.
8:26:41 PM: Done in 0.84s.
8:26:41 PM: NPM modules installed using Yarn
8:26:41 PM: Started restoring cached go cache
8:26:41 PM: Finished restoring cached go cache
8:26:41 PM: go version go1.14.4 linux/amd64
8:26:41 PM: go version go1.14.4 linux/amd64
8:26:41 PM: Installing missing commands
8:26:41 PM: Verify run directory
8:26:42 PM: ​
8:26:42 PM: ┌─────────────────────────────┐
8:26:42 PM: │ Netlify Build │
8:26:42 PM: └─────────────────────────────┘
8:26:42 PM: ​
8:26:42 PM: ❯ Version
8:26:42 PM: #netlify/build 3.0.1
8:26:42 PM: ​
8:26:42 PM: ❯ Flags
8:26:42 PM: deployId: 5f25a5bfbf80940007d20ec6
8:26:42 PM: mode: buildbot
8:26:42 PM: ​
8:26:42 PM: ❯ Current directory
8:26:42 PM: /opt/build/repo
8:26:42 PM: ​
8:26:42 PM: ❯ Config file
8:26:42 PM: No config file was defined: using default values.
8:26:42 PM: ​
8:26:42 PM: ❯ Context
8:26:42 PM: production
8:26:42 PM: ​
8:26:42 PM: ┌───────────────────────────────────┐
8:26:42 PM: │ 1. Build command from Netlify app │
8:26:42 PM: └───────────────────────────────────┘
8:26:42 PM: ​
8:26:42 PM: $ gatsby build
8:26:45 PM: success open and validate gatsby-configs - 0.025s
8:26:46 PM: success load plugins - 0.796s
8:26:46 PM: success onPreInit - 0.009s
8:26:46 PM: success delete html and css files from previous builds - 0.012s
8:26:46 PM: success initialize cache - 0.006s
8:26:46 PM: success copy gatsby files - 0.032s
8:26:46 PM: success onPreBootstrap - 0.007s
8:26:46 PM: success createSchemaCustomization - 0.058s
8:26:46 PM: success Checking for changed pages - 0.000s
8:26:46 PM: success source and transform nodes - 0.145s
8:26:46 PM: success building schema - 0.359s
8:26:46 PM: error Your site's "gatsby-node.js" must set the page path when creating a page.
8:26:46 PM: The page object passed to createPage:
8:26:46 PM: {
8:26:46 PM: "path": null,
8:26:46 PM: "component": "/opt/build/repo/src/templates/blog-post.js",
8:26:46 PM: "slug": "/2020-07-30-you-should-join-the-100daysofcode-challenge/",
8:26:46 PM: "context": {}
8:26:46 PM: }
8:26:46 PM: See the documentation for the "createPage" action — https://www.gatsbyjs.org/docs/actions/#createPage
8:26:46 PM: not finished createPages - 0.020s
8:26:47 PM: ​
8:26:47 PM: ┌─────────────────────────────┐
8:26:47 PM: │ "build.command" failed │
8:26:47 PM: └─────────────────────────────┘
8:26:47 PM: ​
8:26:47 PM: Error message
8:26:47 PM: Command failed with exit code 1: gatsby build
8:26:47 PM: ​
8:26:47 PM: Error location
8:26:47 PM: In Build command from Netlify app:
8:26:47 PM: gatsby build
8:26:47 PM: ​
8:26:47 PM: Resolved config
8:26:47 PM: build:
8:26:47 PM: command: gatsby build
8:26:47 PM: commandOrigin: ui
8:26:47 PM: publish: /opt/build/repo/public
8:26:47 PM: Caching artifacts
8:26:47 PM: Started saving node modules
8:26:47 PM: Finished saving node modules
8:26:47 PM: Started saving build plugins
8:26:47 PM: Finished saving build plugins
8:26:47 PM: Started saving yarn cache
8:26:47 PM: Finished saving yarn cache
8:26:47 PM: Started saving pip cache
8:26:47 PM: Finished saving pip cache
8:26:47 PM: Started saving emacs cask dependencies
8:26:47 PM: Finished saving emacs cask dependencies
8:26:47 PM: Started saving maven dependencies
8:26:47 PM: Finished saving maven dependencies
8:26:47 PM: Started saving boot dependencies
8:26:47 PM: Finished saving boot dependencies
8:26:47 PM: Started saving go dependencies
8:26:47 PM: Finished saving go dependencies
8:26:47 PM: Error running command: Build script returned non-zero exit code: 1
8:26:47 PM: Failing build: Failed to build site
8:26:47 PM: Failed during stage 'building site': Build script returned non-zero exit code: 1
8:26:47 PM: Finished processing build request in 22.237427248s
Updated: Added "gatsby-node.js" file
const path = require(`path`)
const { createFilePath } = require(`gatsby-source-filesystem`)
exports.onCreateNode = ({ node, getNode, actions }) => {
const { createNodeField } = actions
if (node.internal.type === `MarkdownRemark`) {
const slug = createFilePath({ node, getNode, basePath: `pages` })
createNodeField({
node,
name: `slug`,
value: slug,
})
}
}
exports.createPages = ({ graphql, actions }) => {
const { createPage } = actions
const blogPostTemplate = path.resolve(`src/templates/blog-post.js`)
return graphql(`
{
allMarkdownRemark {
edges {
node {
frontmatter {
path
draft
date
}
fields {
slug
}
}
}
}
}
`).then(result => {
if (result.errors) {
return Promise.reject(result.errors)
}
result.data.allMarkdownRemark.edges
.filter(({ node }) => !node.frontmatter.draft)
.forEach(({ node }) => {
createPage({
path: node.frontmatter.path,
component: blogPostTemplate,
slug: node.fields.slug,
context: {},
})
})
})
}

Answer 1

You have to re-build to update contents, since Gatsby is a static site generator.
After only build, you could check updates because Gatsby fetch updated datas from Netlify CMS when you build.
But you can implement real-time update with Netlify CMS, you need to add markdown pages.
https://www.gatsbyjs.org/docs/sourcing-from-netlify-cms