The best CMS for Gatsby with visual editing

Gatsby is a great framework to generate a blazing fast static website using a headless CMS like headless WordPress or Contentful.

Many web agencies are switching from the monolithic Wordpress to a solution based on a headless CMS and a React front-end based on the Gatsby framework.

Getting started with Gatsby

Starting from v3 (now in alpha), React Bricks fully supports Gatsby.

From the React Bricks CLI you can choose one of the 2 Gatsby starters:

  • Website with Tailwind CSS
  • Empty project

Benefits of React Bricks over a headless CMS with a GraphQL connector

1. Direct Visual editing

A direct visual editing experience like Elementor, but on a fast React frontend.

2. No framework lock-in

Your site is framework-independent: you could switch from Gatsby to Next.js or viceversa in a matter of minutes, just setting up a new starter connected to the same app.
No need to change from a GraphQL connector to direct REST API calls, no change of "Image" component (in your bricks you don't use the Gatsby or Next "Image" component, but the one from React Bricks, which stays the same across platforms).

Why React Bricks is the best CMS for Gatsby.js?

React Bricks is great for developers, because you define the content blocks using React components. Each content block React component has also a "schema" static property that defines how props like the background color are edited via sidebar controls, validation rules etc.

In the JSX you can use the React Bricks library visual editing components, like Text, RichText, Image, Repeater, to have a visual editing experience like the one you can have with Wix, but with your own design system (so that you make your customers or marketing team happy, too).