Gatsby Mdx Netlify Cms Starter

Overview

The Gatsby + Gatsby-MDX + Netlify-CMS StarterExtended is a project that builds upon the Gatsby starter and provides an example for using Gatsby-MDX with Netlify. It aims to enhance the CMS editing workflow with support for React components and customizable page templates. With this starter, developers can incorporate MD and MDX files as pages and easily configure the CMS to render markdown content. The project also allows for local development and provides a local admin panel for verifying CMS config changes.

Features

• Support for React components in CMS editing workflow using MDX
• Automatic rendering of .MD and .MDX files as pages
• Ability to swap page templates based on CMS key
• Support for CMS configurations that save markdown in frontmatter fields with an MDX-enabled markdown renderer component
• Ability to hide pages from being editable by the CMS
• Extension of Netlify CMS editor to support insertion of React components
• Ability to swap default HTML elements in posts for React components, providing greater control

Installation

To use the Gatsby + Gatsby-MDX + Netlify-CMS StarterExtended, follow these steps:

1. Clone the repository

git clone [repository url]

2. Install dependencies

cd [project directory]
yarn install or npm install

3. Start the local development server

yarn develop or npm run develop @ localhost:8000

4. Make changes to the markdown files in the local .md directory

5. To see the changes reflected, stop the dev server, remove the Gatsby cache by running “rm -rf .cache”, and restart the dev server.

6. Access the local admin panel at localhost:8000/admin to verify changes to the CMS config.

7. Build the project for deployment

yarn build or npm run build

Summary

The Gatsby + Gatsby-MDX + Netlify-CMS StarterExtended is a powerful tool for building websites with Gatsby and leveraging the features of Gatsby-MDX and Netlify CMS. It allows developers to easily integrate React components into the CMS editing workflow, automatically render MD and MDX files as pages, and customize page templates based on CMS keys. With its support for markdown in frontmatter fields and the ability to hide pages from the CMS, the StarterExtended is a versatile solution for content management. Its local development environment and admin panel make it easy to test and verify CMS config changes. Overall, the StarterExtended enhances the capabilities of Gatsby and Netlify CMS, making it a valuable tool for website development.