38
loading...
React CMS: The missing link
You are a developer. You love your headless CMS.
Having an API with no hassles and a modern front-end feels great.
Having an API with no hassles and a modern front-end feels great.
Do you think your users are happy too? Think again.
Content creators want to have a solution that is easy and inspiring to use, possibly with no instruction to read.
Wix is such a tool, with its point and click interface.
An headless CMS, with its gray forms and complex interface, is neither easy nor inspiring.
Wix is such a tool, with its point and click interface.
An headless CMS, with its gray forms and complex interface, is neither easy nor inspiring.
Designers want to be able to express the corporate design system and be sure that nobody will ever break it.
This is why they don't like visual editing, as it often implies too much freedom. Designers want flexibility (for themselves) and constraints (for content creators).
This is why they don't like visual editing, as it often implies too much freedom. Designers want flexibility (for themselves) and constraints (for content creators).
Do you like going back and forth between your headless CMS to define fields and your code to fetch these fields and use them in your React app?
Wouldn't it be great if you could save time, stay in your editor and define there your fields, as you do for the props of React components?
Wouldn't it be great if you could save time, stay in your editor and define there your fields, as you do for the props of React components?
The missing link is a framework that has decoupled APIs as a service, but lets you define your content blocks as components (for example React or Vue components), providing some magic to enable visual editing over the texts and images. The props of this components enforce constraints so that designers can be sure that nobody will break the design. As a plus, it would be great if the schema of components could self-document itself.
... so I created it ;P
Its name is React Bricks.
Its name is React Bricks.
Content blocks are React components. No back and forth between the front-end and the headless CMS. Define the fields as props on your component, get visual editing for free from React Bricks
Props like background or anything you need can be changed via sidebar controls (you can choose a standard control like text, number, select, color, etc. or provide a custom component).
<Text>, <RichText>, <Image>, <Repeater> components.Props like background or anything you need can be changed via sidebar controls (you can choose a standard control like text, number, select, color, etc. or provide a custom component).
The editing interface is very easy and familiar with Visual editing and a Sidebar to change props, with no way to break the design.
In the Playground you get the documentation for all of your content blocks for free.
In the Playground you get the documentation for all of your content blocks for free.
You can configure everything: add custom fields on the page accessible via hooks, provide your own components for rich text rendering or for the sidebar controls, validate props, change ui like logo or responsive breakpoints, set user permissions...
You bet! The starter projects use the latest Next.js versions with a blazing fast statically generated website.
Images are optimized for responsive view and lazy load and served from a fast global CDN.
You can provide a build web hook to let your editors trigger a rebuild on the server with the click of a button.
Images are optimized for responsive view and lazy load and served from a fast global CDN.
You can provide a build web hook to let your editors trigger a rebuild on the server with the click of a button.
React Bricks is written in TypeScript and fully typed.
Scaffold a project in seconds using the CLI.
The Documentation is very complete.
You may start from the Step-by-step Tutorial where you gain points... with a final surprise!
Scaffold a project in seconds using the CLI.
The Documentation is very complete.
You may start from the Step-by-step Tutorial where you gain points... with a final surprise!
Of course I am, but I am sincere when I tell you that I love creating "bricks" of content in React and seeing our customers happy while creating content.
But don't take my word for it. We have big startups like CapBase and Casavo powering their websites (and empowering their marketing) with React Bricks. And Swizec Teller wrote a great post about React Bricks.
But don't take my word for it. We have big startups like CapBase and Casavo powering their websites (and empowering their marketing) with React Bricks. And Swizec Teller wrote a great post about React Bricks.
@matfrana @jaredpalmer @ianstormtaylor @tannerlinsley @rauchg @Gatsby I think stuff like this is the future! Please DM me if you find ways that Gatsby can support you better.
22:45 PM - 11 Mar 2020
@matfrana @ReactBricks @wesbos @kentcdodds @mjackson @markdalgleish @JoshWComeau @devdevcharlie @swyx @ken_wheeler @jaredpalmer @tlakomy @tannerlinsley @flybayer I've wanted to see something like this for a long time; will check it out.
21:57 PM - 23 Mar 2021
@matfrana @ReactBricks @wesbos @kentcdodds @mjackson @markdalgleish @JoshWComeau @devdevcharlie @seldo @swyx @jaredpalmer @tlakomy @tannerlinsley @flybayer Looks fuckin sweet
21:55 PM - 23 Mar 2021
Swizec Teller published ServerlessHandbook.dev
@swizec
Okay @ReactBricks is the first visual website builder to make me reconsider markdown
swizec.com/blog/react-bri…
swizec.com/blog/react-bri…
17:06 PM - 09 Feb 2021
Please, let me know what do you think about React Bricks.
What do you like (or not) about it? What would you use it for? How may I help you start with a project?
What do you like (or not) about it? What would you use it for? How may I help you start with a project?
38