DEV Community: NextBlock

Why We Chose JSONB for AI: How NextBlock CMS Bypassed the "HTML Wall" for Next.js 16

NextBlock — Fri, 01 May 2026 16:27:59 +0000

If you’ve ever tried to pipe Generative AI directly into a production-grade CMS, you’ve likely hit the "HTML Wall."

Traditional rich-text editors treat documents as unstructured strings. When you ask an LLM to generate a blog post, it usually hands back a blob of HTML. In a modern Next.js 16 environment, that blob is a performance ticking time bomb. You have to sanitize it, parse it, and hope it doesn't break your React Server Components (RSC) or trigger a massive re-render that tanks your Core Web Vitals.

When we built NextBlock Cortex, we made a fundamental engineering decision: AI never touches raw HTML. We store everything as strict, node-based JSONB.

Here is why that decision is the backbone of our performance.

The Problem: The "Sanitization Tax"
The "Old Way" of handling AI content looks like this:

AI generates a string of HTML.

Server receives the string and runs it through a heavy sanitizer like DOMPurify to prevent XSS.

Database stores the string.

Client fetches the string and has to parse it again to render it within a React tree.

Every step in this process adds latency. Worse, if the AI generates an unsupported tag or a broken

, your editor engine (like Tiptap or ProseMirror) will aggressively strip it out, leading to data loss and a disjointed user experience.

The NextBlock Solution: The Zero-Validation Pipeline
In NextBlock, we treat AI as a structured data constructor, not a writer. We use constrained decoding to force the LLM to output content that follows a strict Zod-backed JSON schema.

By doing this, we create what we call the Zero-Validation Pipeline:

Direct-to-DB: Because the AI's output is algorithmically guaranteed to be valid JSON that matches our database schema, we skip the parsing and cleaning phase entirely.

Atomic Transactions: The JSONB payload is inserted directly into the PostgreSQL column. If a token doesn't fit the schema, the inference fails before it ever touches our disk.

The Code: Mapping the Schema
By defining our content as a tree of nodes rather than a string, we ensure 1:1 compatibility between the AI, the DB, and the Editor.

TypeScript
// A simplified look at our content schema
const NextBlockNodeSchema = z.object({
type: z.enum(['heading', 'paragraph', 'image', 'codeBlock']),
attrs: z.record(z.any()).optional(),
content: z.array(z.lazy(() => NextBlockNodeSchema)).optional(),
text: z.string().optional(),
});

type ContentBlock = z.infer;
Why Next.js 16 Loves JSONB
The move to JSONB wasn't just about data integrity; it was a pure performance play for the Next.js 16 ecosystem:

Native RSC Rendering: Since the content is already a JSON object, we map it directly to React components. No dangerouslySetInnerHTML, no hydration mismatches, and no intermediate parsing overhead.

Turbopack & use cache: Standardized JSON allows for highly predictable caching. Using the new Next.js 16 use cache directive, we can cache AI-generated blocks at the edge with surgical precision.

Perfect Lighthouse Scores: By eliminating the "sanitization tax" and parsing lag, NextBlock maintains its 100/100 performance guarantee, even on pages heavily populated by AI-generated modules.

Conclusion: The Schema is the Product
In the era of AI-native applications, "the schema is the product." By moving away from legacy HTML and embracing strict JSONB, we’ve ensured that NextBlock isn't just faster—it’s smarter. Our data is readable by humans, renderable by React, and queryable by future AI agents without the mess of regex or tag-stripping.

NextBlock is currently in early access. If you're tired of "Frankenstein" WordPress architectures and want a CMS built for the 2026 tech stack, check us out on GitHub.

Finally, a Modern CMS for Developers: Introducing NextBlock (Open Source)

NextBlock — Mon, 26 Jan 2026 20:51:07 +0000

How we are breaking the cycle of bloated legacy platforms and complex headless configs with Next.js 16 and Supabase.

Every web developer knows the pain of choosing a Content Management System (CMS). It often feels like you are stuck between a rock and a hard place.

On one side, you have the “old guard” (like WordPress). It’s familiar, sure. But it is often bloated, slow, and — thanks to a reliance on endless plugins — a potential security minefield. On the other side, you have modern headless systems. They offer raw speed, but they can be a headache to set up, a nightmare for content editors to use, and often bury you in configuration files.

We decided to break that cycle.

Enter NextBlock, an open-source, developer-first CMS built to be the refreshing alternative we’ve been waiting for. In this article, I’m going to break down exactly what we’ve built so far, our tech stack, and our vision for a sustainable open-source ecosystem.

The Tech Stack

At its core, NextBlock is built on a modern foundation designed for the future of the web:

• Frontend: Next.js 16 for blazing-fast performance and Server Components.

• Backend: Supabase for handling data, auth, and storage.

• Styling: Tailwind CSS for a lean, utility-first design system.

But the tech is just the vehicle. The mission of NextBlock boils down to three core pillars: Speed, Experience, and Extensibility.

Pillar 1: Built for Speed

When we say “built for speed,” we aren’t talking about vague marketing promises. We are talking about concrete engineering wins that are baked into the core platform.

Edge Caching & ISR: We’ve set up caching at the edge, utilizing Next.js Incremental Static Regeneration (ISR). This ensures your site feels instantaneous regardless of where your users are located.
Critical Code Loading: We are obsessive about shipping only the code that is absolutely necessary. This includes using Tailwind CSS to purge unused styles, making the final production build incredibly lean.
Next-Gen Image Optimization: Images are usually the #1 culprit for slow websites. NextBlock solves this by baking in the Next.js component, enabling modern formats like AVIF (which are significantly smaller than JPEGs), and using blur-up placeholders so pages feel snappy even while assets load.

Pillar 2: A Superior Experience (For Everyone)

Speed matters, but what is the point of a fast site if it is a pain to manage? We focused heavily on the experience for both the Content Creator and the Developer.

For the Content Creator: We wanted an editing experience that feels modern — not like a form from 2005.

• Notion-Style Editor: We upgraded the block editor (powered by Tiptap) to be intuitive and drag-and-drop friendly.

• Organized Media: No more chaotic file dumps. The media library supports folders and tagging.

• Revision History: We added one-click revision history, a game-changer for content teams who need safety when editing live pages.

For the Developer: We moved the project structure into an Nx Monorepo. This makes it significantly easier to manage dependencies and scale the codebase as you add new features. We also built a CLI tool (create-nextblock) that spins up a new project in seconds, and a documented Block SDK that allows you to build custom components—unlocking the real power of the platform.

What’s Next: Phase 3 and the “Open Core” Model

We have built a fast, user-friendly foundation. Now, we are moving into Phase 3, where the vision expands from “just a tool” to a full ecosystem.

The focus right now is the development of a Premium E-commerce Module. This will be a full-blown commerce solution built to plug directly into NextBlock.

“Wait, premium? I thought this was Open Source?” This is a critical part of our vision for sustainability. We are adopting an Open Core model:

The Core CMS: Always free, always open-source (AGPL license). This is the foundation.
Premium Modules: High-value, complex features (like E-commerce or Enterprise SSO) will be offered as paid add-ons.
The Marketplace: This fuels a future community marketplace where developers can share and sell their own blocks and themes.

Join the Ecosystem

As we say on our site: “More than a CMS, an ecosystem”. The goal isn’t just to ship code; it’s to build a platform where we can create amazing web experiences together.

NextBlock is being built in the open. If the idea of a faster, better, developer-first CMS sounds exciting to you, we want you involved.

• Star the Repo: [https://github.com/nextblock-cms/nextblock]

• Join the Community: [https://github.com/nextblock-cms/nextblock/discussions]

The question isn’t just what’s next for the web — it’s whether you are ready to help build it.

Architecting Open-Core: How We Use Nx to Split Free vs. Premium Code

NextBlock — Mon, 19 Jan 2026 14:19:00 +0000

The "WordPress Killer" needs a business model. When building NextBlock CMS, I knew I wanted the core to be free and open-source forever. But I also plan to offer premium capabilities—starting with our upcoming E-commerce library—to sustain the project. This presents a technical challenge: How do you manage open-source code and closed-source premium modules in the same ecosystem?

The Nx Solution This is why we spent Phase 2 migrating to an Nx Monorepo. It allows us to keep distinct boundaries between our core libraries and our future premium libraries.

The "Empty Package" Strategy We are taking a unique approach to distribution.

NPM Placeholders: We will publish "empty" or "shell" packages to the public NPM registry for our premium libraries. This reserves the namespace and prevents confusion.

Private Registry via GitHub: The actual source code for the Premium E-commerce library will live in a private GitHub repository.

The Handshake: Once a user purchases a license, they are invited to the private repo. Their package.json will point to the private instance, seamlessly pulling the premium code into their monorepo workflow.

Why this matters This setup ensures that we can maintain a single, cohesive developer experience. You don't have to hack together two different CMS versions. You simply "unlock" the premium libs when you're ready.

Phase 3 is all about executing this vision. The E-commerce library is coming, and it’s going to be fast.

NextBlock CMS: The Great Migration & The Road to E-commerce (Phase 3)

NextBlock — Wed, 14 Jan 2026 20:16:04 +0000

I’m Back. It’s been quiet on the social front since New Year's, but the code commits have been loud. I am thrilled to announce that we have officially completed the groundwork for NextBlock CMS. Phase 1 (Performance) and Phase 2 (Architecture) are done.

We Moved! First things first: update your remotes. The project has been transferred to its permanent home: https://github.com/nextblock-cms/nextblock. Unfortunately, we lost our old discussions in the move, so I’ve created 6 new discussion types (Announcements, Ideas, Q&A, etc.). I invite you all to jump back in and repopulate the board!

Why the Silence? The Monorepo Split. We didn't just move files; we completely restructured the application using Nx. We successfully split the codebase into apps (the core CMS) and libs (reusable packages). This was a massive undertaking, but it was necessary for what comes next.

Phase 3: The E-commerce Library We are now entering Phase 3. Our goal is ambitious: to create the best-performing E-commerce library in the world. We are targeting big corporations and solving the performance bottlenecks that have plagued standard CMS e-commerce plugins for years.

The foundation is set. The repo is ready. Let’s build.

NextBlock 2026: The Year of the Ecosystem (Phase 3 Roadmap)

NextBlock — Thu, 01 Jan 2026 14:00:00 +0000

Moving from "Building a CMS" to "Building a Community".

Happy New Year! 🎆

2025 was the year of the Core. We built a Type-Safe, Next.js 15 powered, Supabase-backed CMS that smokes WordPress in performance benchmarks (100/100 Lighthouse).

2026 is the year of the Ecosystem.

We are entering Phase 3 of our roadmap. Here is what we are building this year:

🛍️ The E-commerce Module: A lightweight, headless commerce engine. No bloat, just products and checkout.

🧩 The Marketplace: A space for developers to share (and eventually sell) their custom Blocks and Themes.

🤝 Community: We are moving development discussions to the open.

This is an open-source project. No venture capital, no walled gardens. Just developers building the tools we actually want to use.

If you're tired of fighting with legacy PHP platforms, come help us build the future.

Star the repo to follow the journey: https://github.com/Webman-Dev/nextblock-monorepo

Documentation is a Feature: Why I’m Obsessing Over "Time-to-Hello-World"

NextBlock — Sun, 28 Dec 2025 14:00:00 +0000

Great code with bad docs is just legacy code waiting to happen.

We just finished the "Holiday Sprint" for NextBlock, hitting 100% Lighthouse scores and shipping a robust Plugin SDK. But the code is only half the battle.

I’m spending the days between Christmas and New Year's doing the unglamorous work: Writing Docs. ✍️

My Goal for Jan 1st: A developer should be able to run npx create-nextblock-app and have a running, deployed CMS in under 5 minutes.

If you have to read a 10-page manual to start a server, I’ve failed.

I’m looking for beta testers to try the installation flow next week. If it takes you longer than 5 minutes, I want to hear about it.

Who is up for the challenge?

The read me in the repo: https://github.com/Webman-Dev/nextblock-monorepo

Building Git-like Version Control for a Headless CMS (Next.js + Supabase)

NextBlock — Tue, 23 Dec 2025 14:44:50 +0000

How we implemented “Time Travel” for content editors without exploding our database.

I just merged one of the most requested features for NextBlock: Content Revision History.

We all know the pain of a client deleting a paragraph and then asking, “Can we get that back?” 😅

The Challenge: Most CMS solutions either don’t track history or bloat the database by duplicating entire rows for every save. We wanted something faster and smarter.

The Stack:

Next.js 15: For the reactive admin UI.
Supabase (PostgreSQL): Storing JSONB deltas.
Zod: Validating the schema integrity of past versions (so restoring an old version doesn’t break the new UI).
How it works: We are diffing the JSON content blocks and storing snapshots only when significant changes are detected. This keeps our storage footprint low while giving editors the confidence to “Save” without fear.

It’s live in the repo now. Go break it and let me know what you think! 👇
https://github.com/Webman-Dev/nextblock-monorepo

Sneak peak here: https://x.com/NextBlockCMS/status/2003474634340290704?s=20

Designing a Type-Safe Plugin System for Next.js: Why Zod is Our Secret Weapon

NextBlock — Mon, 08 Dec 2025 13:00:00 +0000

We've just laid the foundation for the NextBlock CMS plugin system (the Block SDK), and the core decision was all about safety. When a developer installs a custom block, the last thing the CMS should do is crash due to invalid data.

That’s where Zod comes in.

Instead of relying on fragile runtime checks or simply trusting TypeScript interfaces (which disappear after compilation), we now enforce a strict "Contract" for every content block using Zod schemas.

How it works: Every custom block must define its data structure as a Zod schema. If a user tries to save content that doesn't match the schema, the CMS intercepts the invalid data, shows a clear error, and prevents the crash. This moves data validation from an implicit guess to an explicit, self-documenting contract.

This is critical for an Open-Source project aiming for professional extensibility—it lets the community build plugins without the fear of breaking the core platform.

A peek at the contract:

TypeScript

// The Testimonial Block Schema
export const TestimonialSchema = z.object({
quote: z.string().min(1, 'Quote cannot be empty.'),
author_name: z.string().min(1, 'Author is required.'),
image_url: z.string().url().nullable().default(null),
});

This is the future of resilient content modeling. Read the full guide on how to build your first custom block using this new system soon!

Nextjs #TypeScript #Zod #OpenSource #CMS #WebDev

Nextblock Update: 5 NPM Libs, `npm create nextblock`, and What's Next

NextBlock — Mon, 03 Nov 2025 20:12:01 +0000

Hey dev community!

Sorry I've been a bit quiet on here. I've been deep in the trenches on Nextblock, and I'll be honest—getting the monorepo architecture just right was much harder and took way longer than I originally anticipated.

But that grind has finally paid off, and I'm stoked to share some massive updates.

The Milestones

The foundation for Nextblock is now set, and it's built to scale.

NX Monorepo with 5 Libraries: The project is now fully contained in an NX monorepo. This was a huge lift, but it means we can properly manage shared code, UI, utils, and more. The structure is now broken down into 5 core libraries.
All Libs are on NPM: All 5 of these new libraries have been successfully published to npm, making them available to the public.
We Got the Name! This is the one I'm most excited about. We've officially secured the npm create nextblock command! This is a huge step for making onboarding easy and establishing the brand.

What's Next: DX and Adoption

With the core architecture solid, my focus is now shifting 100% to developer experience (DX) and getting this into the hands of early adopters.

Here's the immediate roadmap:

Optimize npm create nextblock: Right now, the command is a placeholder. My next task is to build it out to be a proper scaffolding tool. It will gather setup information (project name, etc.) and provide clear guidelines on how to install.
Create a Starter Template: I'll be creating the first official "early adopter" template. This is the key to letting you all finally try Nextblock and see what I mean by "2025 ultrafast website speeds."

The goal has never changed: No compromise. This framework will be the end of WordPress.

Thanks for following the journey. The really fun stuff starts now.

I Built a Smarter Rich-Text Editor with Live JS Blocks and Self-Converting Inputs

NextBlock — Tue, 30 Sep 2025 20:15:51 +0000

Hey everyone,

Today marks a by milestone of my #buildinpublic journey for NextBlock CMS, and it's a big one. The core of the new Tiptap-based, Notion-style editor is complete for now!

When I started this, my goal wasn't just to build another rich-text editor. It was to build one I'd actually want to use as a developer—one that respects my workflow and doesn't get in the way.

I'm particularly excited about a few features I baked in:

Direct CSS & JavaScript Blocks
This was non-negotiable. How many times have you wanted to just drop in a quick style or a small script without having to create a whole new component? In this editor, you can. It allows for incredible flexibility, whether for embedding interactive charts, custom-styled divs, or anything else you can think of.

Innovating on the "Little Things"
I spent a lot of time on the UI/UX details that often get overlooked.

A Smarter Color Wheel: The color picker is fully reactive. When a user changes any value (the HEX code, an RGB input, or drags the wheel), a state update triggers a utility function that instantly converts and syncs all the other input formats. No more manually converting HEX to RGB!

Unit-Aware Font Sizing: Similar to the color picker, the font-size input understands units. When a user switches the dropdown from px to rem (or em, etc.), the numeric value automatically recalculates to the equivalent size. 16px becomes 1rem instantly. It removes all the guesswork.

It's so exciting to see these features working together in harmony. This editor is the foundation for what I hope will be the most developer-friendly CMS on the market.

What do you think? What's a "small" feature you wish your editor had?

I went silent for a month to build a WordPress killer. Here's why.

NextBlock — Tue, 23 Sep 2025 18:42:32 +0000

Hey DEV community,

If you've been following my progress on NextBlock, you probably noticed I went completely dark for about a month. No posts, no updates. That's because I was deep in the trenches on a single, massive feature: implementing a ground-up, Notion-like editor using the incredible Tiptap 3 library.

And it is almost perfect.

The mission was to create an editing experience so fluid and powerful that it would make developers and bloggers feel like they finally have the tool they've always needed. No more fighting with clunky plugins, weird formatting, or limited functionality. Just pure, creative control.

This isn't just about adding a "nice" editor. This is the core of a larger vision. I believe the reason WordPress has dominated for so long is its ecosystem, but its core experience has become bloated and outdated. The opportunity is ripe for a replacement.

I'm building NextBlock to be that replacement. A CMS with the power and flexibility to replace them all. I truly think this is the "WordPress killer" people have been talking about for years, and it all starts with getting the content creation experience absolutely right.

Building with Tiptap 3 has been a fantastic journey, and I can't wait to show you all what it can do. The level of customization is phenomenal, and it's the perfect foundation for the most flexible CMS ever built.

More to come very, very soon!

Creating Without Limits: A Deep Dive into the Enhanced Block Editor in NextBlock CMS

NextBlock — Mon, 28 Jul 2025 17:57:51 +0000

In Phase 2 of our journey, we're laser-focused on elevating the content creation experience within NextBlock CMS. A cornerstone of this effort is the significant upgrade to our block editor, powered by the robust Tiptap framework. We've listened to feedback and are thrilled to introduce features that will empower you to create richer, more dynamic content with unparalleled ease.

The Power of Inline Widgets

Imagine writing a blog post and wanting to seamlessly embed a relevant tweet, a compelling call-to-action button, or even a small poll directly within your paragraph. With our new inline widget capabilities, this is now a reality. These widgets are seamlessly integrated into your text flow, allowing for a more engaging and contextually relevant reading experience. Developers can easily create custom inline widgets, opening up endless possibilities for unique content types.

Flexibility Redefined: Custom Block Layouts

Traditional CMS editors often constrain you to predefined content structures. We're breaking free from those limitations with our enhanced custom block layouts. Now, you can create blocks that adapt to your content needs, whether it's a multi-column layout for showcasing features, a dynamic grid for image galleries, or a unique arrangement for testimonials. Our intuitive controls make it easy for content creators of all technical levels to design visually stunning and structurally sound pages.

A Glimpse Behind the Scenes

Our decision to build upon Tiptap has allowed us to leverage its extensibility and collaborative capabilities. [cite_start]The architecture is designed to be modular, making it easier for developers to contribute new block types and editor features in the future. [cite: 405] We believe this approach will foster a vibrant ecosystem of creative tools for NextBlock users.

We're incredibly excited about the potential these editor enhancements unlock. They represent a significant step towards our goal of building a CMS that is not only technically superior but also a joy to use for content creators.

Stay tuned for more updates on Phase 2, including improvements to the media library and our developer experience initiatives. We can't wait for you to experience the enhanced block editor firsthand!