Open-source alternatives to Gutenberg

Puck is a visual page editor and layout tool for React. It functions as a CMS page builder and component orchestrator, allowing for the design and arrangement of structured content pages through a drag-and-drop interface. The system utilizes a pluggable component registry to integrate external React components into the visual canvas. It employs schema-driven mapping and JSON-based serialization to store and persist page structures as portable data objects. The platform covers the domain of no-code page building and CMS content management, providing a visual reconciliation system to synchroni

React Email Editor is a drag-and-drop visual builder for creating responsive email templates, built as a React embeddable component. It also serves as an AI-powered email designer, a collaborative email design tool, and a React component library for composing emails programmatically with JSX. The editor represents designs as structured JSON and supports multi-format rendering for email clients, web pages, and PDF. What distinguishes this editor is its deep AI integration: users can generate full email templates from natural language, rewrite text with chosen intent, produce multiple text vari

Puck is a headless visual CMS and React visual page editor that provides a drag-and-drop interface for designing page layouts and managing content. It functions as a JSON-based content management system, storing page structures as JSON and exposing them via API for dynamic rendering within applications. The project enables dynamic route authoring by mapping visual editor instances to specific URL paths, allowing content editing for any page. It integrates a visual authoring layer into existing applications to facilitate the design of page structures using custom React components. The system

Blocks is a no-code website builder and component-based UI framework designed to create production-ready websites through a visual interface. It functions as a visual page builder that assembles layouts using pre-designed JSX component blocks. The system includes a visual theme engine used to manage brand identity through the definition of global colors and layout presets. This allows for the application of consistent visual themes across all pages of a site. The platform covers visual website building, JSX page construction, and brand identity management. It utilizes a schema-driven layout

LightTable is an extensible source code editor and integrated development environment designed as an interactive programming environment. It enables the evaluation of programming language fragments in real time to provide instant feedback on expressions. The workspace functions as a remote execution environment, connecting to and managing external servers to run code within remote processes. It allows for an interactive workflow where users can execute code fragments and track expression values without restarting the environment. The system provides source code editing capabilities, includin

GrapesJS is a framework for creating no-code visual editors that produce HTML and CSS templates. It provides a browser-based interface for designing website and newsletter structures using a drag-and-drop page editor. The project functions as a web builder framework, enabling the development of custom design environments. It includes a system for managing nested HTML elements, modifying layout properties via a graphical interface, and organizing components through a page layer hierarchy. The toolset covers digital asset management for organizing images and files, as well as the ability to pe

BlockNote is a block-based rich text editor and a real-time collaborative workspace. It uses a JSON-based data model to organize content into draggable, nestable blocks rather than a single flat document. The system functions as a high-level interface built on ProseMirror that abstracts document state into discrete, manipulatable content blocks. The project serves as a framework for integrating large language models into document editors, enabling context-aware text generation and AI-driven workflows. It also acts as a document export engine capable of converting structured block data into fo

Nerv is an isomorphic JavaScript framework and virtual DOM library used for component-based user interface development. It functions as a React-compatible library that maintains compatibility with the React 16 API. The framework is specifically designed as a legacy browser UI framework, providing the internal logic necessary to maintain consistent behavior in older environments, including Internet Explorer 8. Its capabilities cover isomorphic web rendering through server-side HTML generation and client-side hydration. The library also includes frontend error handling to intercept component c

Lexical is a modular rich text editor framework used to build extensible web-based editors. It functions as a state-driven content editor that maintains a serializable, immutable snapshot of document content to ensure predictable updates and accessibility compliance. The framework is distinguished by its plugin-based architecture and customizable node framework, which allow developers to extend editor behavior through specialized content nodes and encapsulated runtime logic. It also includes a collaborative editing engine capable of synchronizing document state across multiple clients in real

This project is a starter template and boilerplate for building isomorphic web applications using React, Redux, and Express. It functions as a server-side rendering framework that generates HTML on the server and rehydrates it on the client to improve search engine optimization and initial page load speeds. The project is distinguished by its focus on developer experience, featuring a configuration for hot module replacement. This allows for the real-time updating of the user interface and application state during development without requiring a full browser refresh. The framework provides c

Inferno is an isomorphic JavaScript framework and virtual DOM UI library used for building user interfaces. It functions as a server-side rendering engine that converts virtual nodes into HTML strings for the server and hydrates them on the client to optimize initial load speeds and search engine indexing. The framework features a synthetic event system that provides a normalized interface for handling browser interactions consistently across different web environments. It employs a reactive UI model to synchronize state-driven updates and reactive streams with the browser document object mod

TinaCMS is a headless content management framework that bridges local Git-based file storage with a visual, in-context editing interface. By treating your repository as the single source of truth, it enables developers to manage content as structured data files while providing editors with a browser-based dashboard to modify website content directly within a live preview. The framework distinguishes itself by transforming local files into a unified GraphQL API, which powers both the administrative interface and the application's data retrieval layer. This architecture allows for compile-time

This project is a framework for building static websites using the Hugo static site generator. It functions as a Markdown-based content management system and a page builder that utilizes Tailwind CSS to assemble modular utility-first blocks into final web pages. The system features specialized capabilities for creating academic portfolios, including a framework to import BibTeX publications and manage scholarly resumes. It also includes an AI website generator that produces deployable Markdown structures and content based on natural language descriptions. The platform covers a broad range of

Hyperapp is a functional JavaScript framework for building hypertext applications. It centers on a state management library and a virtual DOM system that creates in-memory interface representations to apply efficient updates to the browser screen via diffing. The framework avoids templates and JSX, instead utilizing function composition and dedicated tag wrappers to generate HTML structures and SVG elements. It implements a unidirectional data flow where a central state object is managed through transformation functions. The system covers declarative UI rendering and functional web interfaci

This project is a comprehensive instructional resource and tutorial guide for learning React and the broader frontend engineering ecosystem. It serves as a structured course covering the fundamentals of building user interfaces through component-based architecture. The project provides specialized guides on coordinating application data via Redux state management, integrating and mutating data using GraphQL and Relay, and building native mobile applications using a single codebase. It also includes a dedicated tutorial for verifying component behavior through unit testing, shallow rendering,

This is the comprehensive documentation website for the Vue 2 progressive JavaScript framework. It serves as a technical reference and development guide for building reactive user interfaces and single-page applications. The site provides a detailed JavaScript API reference and a web component directory. It covers the implementation of component-based architectures, reactive state management, and the use of a virtual DOM to synchronize application state with the browser. The documentation details capabilities including client-side routing, declarative DOM manipulation, and frontend build opt

Payload is a headless content management system and application framework that uses a code-first approach to define data schemas and administrative interfaces. By utilizing a centralized, type-safe configuration object, it automatically generates database schemas, API endpoints, and a fully customizable admin panel. The system is built on a database-agnostic architecture, allowing it to interface with various storage engines while providing a unified, type-safe API for server-side operations, REST, and GraphQL. What distinguishes Payload is its deep extensibility and developer-centric design.

This project is an educational course and a collection of frontend projects designed to teach the core concepts and architecture of the React library. It serves as a practical guide for building modular user interfaces through a series of hands-on project builds. The repository includes a technical implementation of a custom React renderer, demonstrating how to transform JSX elements into a document object model. It further provides examples of state management, specifically illustrating how to share global data across a component tree using the provider pattern to avoid property drilling. T

vue2-happyfri is a frontend development starter kit and application template for the Vue 2 framework. It provides a foundational codebase designed for learning and implementing the core ecosystem of Vue.js. The project serves as a reference implementation for building single-page applications by combining Vue.js with Vue Router for navigation setup and Vuex for state management examples. It demonstrates how to map URL paths to page components and maintain consistent application state across multiple components. The codebase covers high-level capabilities including client-side routing and cen

Decap CMS is a headless, Git-based content management system designed to provide a visual editing interface for static site workflows. By decoupling the administrative dashboard from the frontend, it allows users to manage content stored directly in version control repositories as structured data. The system maps visual form inputs to repository files, enabling non-technical contributors to update content without requiring direct code changes. The platform distinguishes itself through its Git-centric automation, which handles content lifecycles by creating commits, branches, and pull requests

This project is a web-based rich text editor designed for markdown content authoring. It provides a dual-mode interface that synchronizes raw markdown syntax with a visual WYSIWYG editing experience, allowing users to toggle between modes while maintaining a consistent document state. The editor distinguishes itself through a modular architecture that supports custom content blocks and plugin extensions. This system enables the integration of specialized features such as code syntax highlighting, chart rendering, diagram generation, and complex table formatting. It also includes a live previe

This project is a TypeScript React starter template and frontend development boilerplate. It provides a pre-configured project scaffold and foundation for building type-safe user interfaces, integrating essential tooling for typing, linting, and testing to accelerate the start of a web application. The scaffold distinguishes itself by providing a complete production asset pipeline that generates minified JavaScript and CSS bundles to optimize loading speeds. It includes a dedicated component testing suite for executing logic and snapshot tests in a simulated browser environment, alongside a h

This project is a JavaScript-based plugin framework for the Typora markdown editor. It provides a development platform to integrate custom functional logic, UI elements, and keyboard shortcuts into the editor environment. The framework distinguishes itself by offering a JSON-RPC remote interface, allowing external programs to control the editor and trigger plugin functions. It also includes a dedicated publishing system to export and upload markdown documents to external blogging platforms via API requests. The project covers a wide range of capabilities, including editor workflow automation

Vim-codefmt is a plugin for the Vim text editor that automates source code formatting by integrating external command-line utilities. It functions as a bridge between the editor and specialized formatting tools, allowing developers to maintain consistent style across diverse programming languages through a unified interface. The plugin operates by invoking external processes to transform buffer content, utilizing standard input and output streams to exchange data. It supports both full-file formatting and targeted adjustments for specific code ranges, ensuring that style enforcement can be ap

GitLens is a Git extension for VS Code that brings inline blame annotations, CodeLens authorship information, and an interactive commit graph directly into the editor. It provides a visual timeline of repository history with color-coded branch relationships, search, and filtering, alongside file-level annotations that show who last changed each line and why. The extension also functions as a cross-provider pull request manager, integrating with GitHub, GitLab, Bitbucket, and Azure DevOps to centralize PR and issue tracking within the IDE. What distinguishes GitLens is its AI-powered Git assis

This project is a tool for transforming live HTML web pages into editable Figma design layers by processing the document object model and CSS. It functions as a web-to-design converter and HTML-to-layer transformer that translates browser elements into design tool primitives. The tool captures live webpage sections across multiple screen widths to preserve responsive layout behaviors during the import process. It also includes a visual content editor that identifies live website components, allowing for the direct modification and publication of content entries from a browser view. The syste

Relax is a headless content management system and visual website builder. It allows for the creation and organization of digital content delivered via a GraphQL API to a React frontend, utilizing a component-based visual editor to construct web pages and layouts without writing manual code. The platform integrates a dockerized content manager for simplified deployment and uses a schema-driven approach to structure data architecture and entry types. It features a dynamic administrative experience built with React and Redux to manage site states and user interfaces. The system provides broad c