wordpress-gcb/gutenberg-control-blocks-lite

GCB Lite is a WordPress plugin that lets you write a single React component and have it show up correctly in two places: the Gutenberg block editor where content writers make edits, and your live public website built with Next.js. Normally, building a custom WordPress block means writing three separate pieces of code that describe the same thing (an editor preview file, a saved markup file, and your actual frontend component), and these three versions tend to drift apart over time. GCB Lite removes that duplication. The way it works is that a block in the editor points to a React component living on your Next.js frontend. When someone is editing content in wp-admin and needs to see a preview, WordPress calls your frontend server to server and shows the returned HTML. When a real visitor loads the public page, that same component renders the page directly. There is no React code running inside WordPress itself, only the HTML that gets sent back and forth. Each block can choose its own way of rendering. If a block includes a render.php file, WordPress runs that file locally like a standard block. If it does not, the plugin instead calls out to your frontend to get the HTML. This means you can adopt GCB Lite just for its typed content fields and keep everything in plain PHP, or build blocks entirely in React, or mix both approaches block by block. To create a block, you define a small JSON file describing its content fields, such as a text heading, an image with a focal point picker, or a group of toggle buttons for alignment. The plugin reads this file, builds the correct WordPress attributes automatically, and generates the editing panel for you, so there is no need to hand write editor code. The project includes a live demo site and a companion Next.js starter repository showing working examples. It is written in JavaScript.