ChaiBuilder Logo

How It Works

A ChaiBuilder site is a plain Next.js application you own and run, with three parts working together: the visual builder, a CMS for structured content, and your own database and hosting. Nothing runs on ChaiBuilder's infrastructure - you're shipped code, not a hosted service.

The three pieces

1. The visual builder (chaicore core + chaipro)

The open-source core (chaicore) is a basic Next.js builder: the client side is the visual editing surface where pages are built, and the core persists those pages to SQLite and renders them. chaipro is the Pro package - the chaicore core plus a set of Pro extensions that add the advanced capabilities of the professional builder. ChaiBuilder keeps its own set of database tables to manage pages.

2. The CMS (Payload, out of the box)

Structured content - blogs and similar collections - lives in Payload CMS - a Pro capability wired in through the starter. Payload's collections are independent of ChaiBuilder's page tables: there's no hard relation between them. Payload is the default, but the CMS is swappable - the builder doesn't require it, so you can plug in another CMS if you prefer.

3. Your database and infrastructure

You bring your own storage - SQLite (a local file or a remote libSQL / Turso database) or Postgres, both fully supported - and your own hosting. Auth is your choice (Supabase, Firebase, or custom), and media goes to any object storage (S3, R2, etc.). All website content, registered users, and actions live in your database. ChaiBuilder has no access to it. This is the core of the product: you own the data and the infrastructure around it.

One database can also host unlimited sites - each site is a row in ChaiBuilder's apps table, with all of its content scoped to it. Running many sites doesn't mean many databases.

How the builder and CMS fit together

The visual builder and the CMS are wired together so they understand each other's structure and can interact - visual pages reference and surface structured content from the CMS, while each maintains its own storage. Think of it as: visual pages in the builder, structured content in the CMS, both persisted to your database.

Your Next.js app (you host it)
├── chaicore core (+ chaipro) → visual pages  ─┐
│    ├── client: editing UI                     │
│    └── server: page storage & rendering       ├──► Your database
├── Payload CMS               → structured content ┘   (SQLite / Postgres)
└── Your custom code          → routes, collections, blocks

How pages render

Pages are optimized for content-heavy, public-facing sites, using an SSG + ISR model:

  • Pages are not built at build time. Each page is built on a visitor's first visit, then cached.
  • When you publish a page, that page is automatically invalidated and revalidated, so visitors get the new version without a full rebuild.

Where developers plug in

Because the deployment is just Next.js + Payload, you keep full control:

  • Next.js - override pages, add custom routing, build custom solutions on top.
  • Payload - add custom collections and logic (it's pure Payload CMS).
  • Builder - add custom blocks and custom panels to extend the editing experience.

What's open source vs paid

  • Open source (chaicore) - a basic Next.js website builder: the visual builder, SQLite page storage, and page rendering. It's a runnable builder with persistence built in, not a headless component you have to wire a server around.
  • Pro (chaipro) - the chaicore core plus a set of Pro extensions for the professional builder: roles and access control, revisions, multilingual content, redirects, media management, animations, advanced AI, multi-tenancy, extra database adapters, and more.

Next

© ChaiBuilder. All rights reserved.