React inline visual editing: now's the time.
summary
A concrete claim: a CMS built as reusable React components that editors edit inline while developers keep code in the repo. It ships a visual API (text, rich text, image, repeater), hosts content on React Bricks APIs, optimizes images to a CDN, and already serves 8,000 users and corporates like Bank Mediolanum and The Weather Channel. Code examples use Next.js (supports Gatsby and Remix), Tailwind-agnostic styling, iframe style-sync and bundle-size workarounds, and a roadmap toward Next.js app dir server components.
AI-written summary · about
chapters (18)
- 0:00React inline visual editing intro
- 1:09Problems with CMS platforms
- 2:41Evolution of web tools
- 6:36Visual vs structured CMS freedom
- 8:48React Bricks solution intro
- 10:12Bricks turn components editable
- 12:45Live demo editing interface
- 16:18Custom bricks in React code
- 21:21Reuse content with bricks
- 23:53Dev experience and time savings
- 25:19Challenges building React Bricks
- 27:48React Bricks enterprise plans
- 29:12Why not just a page builder
- 30:38Q&A: Deployment and hosting
- 32:50Q&A: Iframes and CSS conflicts
- 35:53Q&A: Nesting bricks
- 38:22Q&A: React updates
- 39:26Closing remarks
related talks
28mReact Inline Visual Editing Now’s The Time
29mReact Bricks: a CMS with Visual Editing for Next.js and Gatsby based on React Components
25mReact Bricks: a CMS with visual editing based on React components
45mCreating a WYSIWYG editor using ReactJS
25mRich Text Editing with React
28mHow to View and React without a Head
41mCreating collaborative editing UIs in React
21mIntroducing React View: A Set of Tools that Closes the Gap between Users, Developers