Documentation

Site Builder

SleekCMS includes an integrated static site builder that turns your content and templates into a fully deployable website — without requiring you to set up build tools, servers, databases, or Git repositories. Everything runs in the cloud.

You bind EJS templates to your content models, the builder compiles content and templates into static HTML, and the result is available for instant preview or deployment to any static hosting provider.

This page explains the architecture, build pipeline, and key capabilities of the site builder. Implementation details for templates, data access, configuration, and deployment are covered in the linked sub-pages.

Architecture

The site builder follows a JAMstack approach: static HTML pages are pre-generated from structured content and templates, then served from a CDN. There is no application server processing requests at runtime.

The pipeline has three layers:

Content — Your models (pages, entries, blocks) and their instances, managed through the SleekCMS editor. This is your data layer.

Templates — EJS templates bound to each model. These define how content renders to HTML. A page model gets a template, a block model gets a template, an entry model gets a template. Pages can also have a shared layout template that wraps the page template.

Output — Static HTML files, one per page record, plus your CSS, JavaScript, and other assets. The output is a self-contained static site compatible with any hosting provider.

Content (Models + Instances)
        │
        ▼
Templates (EJS bound to models)
        │
        ▼
Static Site (HTML + CSS + JS + Assets)
        │
        ▼
Preview / Deploy

→ Integrated JAMstack

Templates and Models

Every model type — page, entry, and block — can be bound to an EJS template. The template defines the HTML output for instances of that model.

Page templates

Each page model has its own EJS template. When the builder processes a page record, it renders the page template with the record's content data.

Layout template

Pages can share a common layout template that wraps the page template. The layout typically defines the outer HTML shell — <html>, <head>, navigation, footer — while the page template fills in the body content. This gives you consistent site chrome without duplicating markup across page templates.

Block templates

Each block model has its own template. When a page contains a dynamic block field, the builder renders each block instance using the block's template and injects the output into the page. This is how composable layouts work at the template level — the page template delegates rendering of each section to the relevant block template.

Entry templates

Entry models can also have templates. This is useful when an entry needs to render as a reusable fragment — a team member card, an author bio component — that can be included wherever the entry is referenced.

→ Model Templates → Layout

Data Flow

The entire content of your site is available as a single payload during the build. The payload has this top-level structure:

{
  pages: [ { ... }, { ... }, ... ],
  entries: { ... },
  ...
}

Each page and entry record in the payload is a nested content structure that mirrors the model definition — groups, collections, blocks, and references are all resolved into nested JSON.

The item variable

When a template renders, the current record's data is available as item. If you're rendering a page template, item is the page record. If you're rendering a block template, item is the block instance. If you're rendering an entry template, item is the entry record.

Global content access

In addition to item, templates have access to the full site content — entries, pages, images, options — along with helper methods for searching, filtering, and rendering content. This means any template can reference any content in the site, not just the current record.

For example, a blog post page template has direct access to the current post via item, but can also look up all author entries, query other pages, or pull in site-wide settings — all without additional API calls.

→ Template Context and Data Access

How Pages Are Generated

The builder creates one HTML file per page record. The output path depends on the page model type:

Static pages generate a single file at the path defined in the model. A page model with path /about produces about/index.html.

Page collections generate one file per record, using the slug field to differentiate. A blog page model with path /blog and records slugged hello-world and nextjs-tips produces blog/hello-world/index.html and blog/nextjs-tips/index.html.

The mapping is direct: one page record in the content payload equals one HTML file in the output.

Preview and Iteration

The site builder supports two preview modes:

Single-page preview — Generates and renders a single page. This is fast and lets you iterate on content or template changes with near-instant feedback. You can edit content in the editor and see the rendered result side by side.

Full-site preview — Generates the entire static site. Use this to verify cross-page navigation, global layout changes, or to review the complete site before deployment.

Both modes run entirely in the cloud. There is no external build server, no CI pipeline, no waiting for a deployment to complete before you can see your changes.

Assets

You can add JavaScript and CSS files through the SleekCMS interface. These files become available to include in your layout templates or any other template where you need them. This is how you add client-side interactivity, custom styles, third-party libraries, or any static assets your site requires.

→ Assets and Static Files

Styling

The site builder includes zero-setup Tailwind CSS support. You can use Tailwind utility classes in your templates without configuring a build pipeline or installing dependencies.

→ Tailwind and Styling

Forms

SleekCMS provides a built-in form backend for your static sites. You can add contact forms, lead capture, or any form-based interaction without setting up a separate form processing service.

→ Form Backend

Deployment

The generated static site can be deployed in two ways:

Download as ZIP — Export the entire site as a ZIP archive. The output is a standard static site structure compatible with any hosting provider — Netlify, Cloudflare Pages, Vercel, AWS S3, or any service that serves static files.

Direct deployment — Deploy from within SleekCMS to supported hosting providers including Netlify, Vercel, and surge.sh. No Git repository required.

In both cases, the output is a static site with no server-side runtime dependencies. It works anywhere that serves HTML.

→ Deploying Sites

What the Site Builder Is Not

A few clarifications for developers coming from other tools:

It is not a frontend framework. The builder generates static HTML from EJS templates. It doesn't ship a client-side framework, hydration layer, or SPA router. If you need React, Vue, or similar, use the Content API with your own frontend instead.

It is not a Git-based workflow. There are no repositories, branches, or pull requests. Templates and assets are managed through the SleekCMS interface (or an external IDE connected to the platform). Changes are applied directly.

It is not a build pipeline you configure. There is no package.json, no webpack.config.js, no build scripts. The builder handles compilation, asset bundling, and output generation internally.

→ Online Coding Environment → Using VS Code / Cursor IDE → Build Configuration and Environment

What's Next