NextBlock™ is designed so the hosted CMS, the open-source starter, and the developer tooling all feel like the same product. The shared Nx workspace, typed block contracts, and reusable editor package keep product polish and developer velocity moving together.
One codebase
Shared foundation
Marketing pages, CMS screens, and the starter template evolve together instead of drifting apart.
Typed content
Blocks with guardrails
Zod schemas, defaults, and renderer contracts make every custom block safer to ship.
Editorial UX
Product-grade editing
The Tiptap layer gives editors a richer surface without hiding the underlying HTML power.
Monorepo Layout and Dependency Flow
The apps/nextblock directory contains the production Next.js experience, including the public site and authenticated CMS shell. The apps/create-nextblock CLI mirrors that foundation so teams can start from the same product decisions instead of rebuilding them from scratch.
- @nextblock-cms/ui - UI components, tokens, and shared design primitives
- @nextblock-cms/utils - translations, environment guards, and storage helpers
- @nextblock-cms/db - migrations, typed database access, and generated types
- @nextblock-cms/editor - the reusable Tiptap v3 editing surface
- @nextblock-cms/sdk - typed contracts for block authorship and validation
- @nextblock-cms/ecommerce - the premium commerce module when activated
Run nx graph and you can see exactly how changes ripple through the workspace. Path aliases from tsconfig.base.json and the shared Tailwind setup help keep design parity between marketing pages, admin screens, and generated projects.
Block Registry as Product Surface
The block registry in apps/nextblock/lib/blocks/blockRegistry.ts is the source of truth for available block types, Zod schemas, starter content, and editor or renderer components. Today that includes everything from text and heading to hero, section, posts_grid, checkout, and product_details.
Sections and heroes support nested column arrays, so layouts can be composed like real pages instead of flat content lists. Helpers such as getBlockDefinition(), getInitialContent(), and validateBlockContent() keep that flexibility strongly typed.
The Editing Layer
The @nextblock-cms/editor package wraps Tiptap v3 into a reusable editorial surface with slash commands, floating and bubble menus, drag handles, tables, task lists, character counts, and syntax-highlighted code blocks. It deliberately preserves richer HTML so advanced teams are not boxed into a simplified subset.
Inside the CMS Shell
Within apps/nextblock/app/cms, each feature area follows a repeatable pattern: list pages, create and edit routes, scoped client components, and server actions that wrap Supabase mutations. The result feels consistent for editors while keeping credentials and permissions on the server side.
Open Core Without Product Drift
The core CMS is open source under AGPL. Premium modules like @nextblock-cms/ecommerce remain source-available but are activated through package_activations and verifyPackageOnline(). That means the same shell can stay clean for open-source users while revealing commerce surfaces only when the license is active.
Why It Holds Together
The Nx workspace keeps libraries honest, the Next.js app enforces UI consistency, Supabase migrations codify access rules, and the Tiptap editor gives collaborators the same authoring experience regardless of deployment. When a team runs npm create nextblock, they inherit the full operating model, not just a pile of files.