Log in
FeaturesLearnDemoBlogPricingDocs

The best CMS for Next.js with visual editing

React Bricks is the first CMS built in React, for React and Next.js which true visual editing. You can provide to your content editors a great editing experience like that of Wix or Elementor, but with a great developer experience, too.

Getting started with Nextjs

Using React Bricks CLI you can choose one of the 4 Next.js starters:

  • Website with Tailwind CSS
  • Website with Tailwind CSS and i18n
  • Empty project
  • Empty project with i18n

What is Next.js?

Next.js is a great framework to develop React apps and websites with great performance and SEO optimization.

Next.js in fact has the ability to use SSR (Server-Side Rendering), SSG (Static Site Generation) or ISR (Incremental Static Regeneration, which is unique to Next.js).

SSR, SSG... what does it mean?

Here I will explain quickly what all these acronyms mean and what I suggest for the common use cases. If you want to learn the tradeoffs in depth, you may also read my article Server Side Rendering vs Static Site Generation vs Incremental Static Regeneration.

Server-side rendering

With Server-side rendering (or SSR), the React rendering process is run on the server and a HTML page with content is produced, so that the search engines' web crawlers can see the content of the page without having to execute JavaScript. Once the page is loaded, the client application starts, matching its status with the server-generated DOM.

SSR is great when you need SEO and you want to be sure that the user has always the latest version of a page, even if it means a higher load on the server (because Node.js needs to render the pages server side, instead of just returning a static page).

Static site generation

Static site generation may sound like a thing from 1998: the server returns a static HTML version of your website, generated at build time.

Actually there's much more, because the build process optimizes images, creates optimized junks of JavaScript code that are lazy-loaded and, as soon as the client app starts, it has the power of a single page app, with link preloading etc.

Static site generation is great anytime you don't have a very big number of pages (because that could make the build time too long) and your content doesn't change very frequently (because otherwise you need to rebuild very frequently).

Incremental Static Regeneration

Incremental Static Regeneration is a way to have the advantages of both SSR and SSG avoiding the pitfalls of both.

With ISR, every time a page is visited, it is rendered server-side (SSR), but then it is cached as a static page, so that the next visit will receive it much more quickly and with no server load. You can specify a stale time so that, after the stale time, to the next user is returned the static page, but meanwhile the page is renewed via SSR.

In this way you can have many pages, because you don't have the long static generation at build time, but, most of the times (for the most visited pages), the page is served very quickly as a static page.

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

React Bricks has four different starters based on Next.js (with or without Tailwind, with or without internationalization). The starters with internationalization leverage the i18n routing of Next.js. All the starters use the latest Next.js 11.

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).