Headless CMS for Next.js

Content management that fits your stack

Give your clients a polished editing interface without touching your code. plainblocks wires directly into your Next.js project — no platform lock-in, no monthly surprises.

Free forever for one project · No credit card required

Built by Eben Vranken

Freelance web designer, 12+ Next.js client sites shipped.

The problem

Every site ships twice.

Once to prove it's possible. Once to make it actually work for the client. The second delivery is always harder — because it involves a CMS.

Enterprise pricing, freelance budgets

Contentful and Sanity are built for teams of 20. Their pricing reflects that. A solo developer giving a client a CMS shouldn't need an enterprise plan.

WordPress doesn't belong here

Bolting a WordPress backend onto a Next.js frontend means two systems, two deployments, and two sets of things that can break.

A custom admin is a week you don't have

Rolling your own CMS UI sounds straightforward. It never is. The client always needs one more field, one more role, one more thing.

plainblocks.config.ts
export default defineSchema({
  post: { title, body }
})
generates →
plainblocks · post
Draft
Title
Slug
Body
fetchBlock() →
your-site.com/post

The solution

Meet PlainBlocks

plainblocks sits between your Next.js project and your client's browser. You define the schema in TypeScript. They edit in a clean hosted interface. Your architecture stays exactly as you designed it.

  • Schema defined in TypeScript — not a dashboard.
  • Clients edit in a hosted UI that speaks your schema.
  • Content fetched from a simple API in your data layer.
  • No new infrastructure to manage or pay for.

Features

Everything you need, nothing you don't

Schema-first

Define your content types in TypeScript. The editing UI is generated automatically from your config — no dashboard to configure, no drag-and-drop builder to fight. Your schema lives in your repo, versioned alongside your code.

Instant preview

Clients see live previews before publishing. No staging server, no extra configuration, no waiting.

Native to Next.js

One function: fetchBlock(). It slots into your existing data layer without rethinking your architecture.

Role-based access

Editors see only the content they need to manage. Client logins never expose your schema or configuration.

Managed media

Images uploaded through the CMS are automatically optimized and served from a CDN. No extra setup.

Three steps from zero to client handoff.

Define your schema

Write a TypeScript config describing your content types — fields, relationships, validation. No dashboard. No YAML.

Install the package

One npm install. Add the provider to your Next.js layout. That's the full setup. No servers, no environment variables beyond an API key.

Hand off the keys

Your client opens a hosted URL and starts editing. You fetch their content with fetchBlock() exactly where it makes sense in your data layer.

Developer experience

Looks familiar. That's the point.

plainblocks.config.ts
// Define your content schema
import { defineSchema } from 'plainblocks'

export default defineSchema({
  post: {
    title:       { type: 'text', required: true },
    slug:        { type: 'slug', from: 'title' },
    body:        { type: 'rich-text' },
    publishedAt: { type: 'date' },
    hero:        { type: 'image' },
  }
})
app/blog/[slug]/page.tsx
// Fetch content in your page
import { fetchBlock } from '@plainblocks/next'

export default async function
BlogPost({ params }) {
  const post = await fetchBlock(
    'post',
    params.slug
  )

  return (
    <article>
      {post.body}
    </article>
  )
}

Pricing

Simple pricing. No surprises.

Every plan starts with a 14-day free trial. No credit card required.

Starter

Free

Everything you need for your first client project.

  • 1 project
  • 2 editor seats
  • 500 content entries
  • Community support
  • Preview URLs
  • White-label CMS
  • SSO / SAML
Start for free

Agency

$79/month

For agencies managing many clients with dedicated teams.

  • Unlimited projects
  • 50 editor seats
  • Unlimited content entries
  • Priority support
  • Preview URLs
  • White-label CMS
  • SSO / SAML
Talk to us

FAQ

Frequently asked questions

plainblocks is built for freelancers and small agencies, not enterprise teams. There's no per-seat pricing that compounds as clients grow, no complex studio to configure, and no disconnect between your code and the content model. You define the schema in TypeScript; we generate the editor.

Yes. Both App Router and Pages Router are fully supported. The fetchBlock() function works identically in both, and the schema config is agnostic to which router your project uses.

Your content is always yours. On cancellation you can export everything as JSON in one click. Clients lose access to the editing UI, but the content API remains readable for 30 days so you can migrate at your own pace.

Yes. We support Next.js 13.4 and later and test against every stable release. We also support the latest canary releases, though we recommend stable versions for client projects.

You share a unique URL with them. They log in with an email address you've authorized. No plainblocks account is required on their side — just an email and password.

Text, rich text, number, date, image, file, select, boolean, slug, and relations between types. Custom field types are on the public roadmap and planned for a future release.

No. The CMS interface is fully hosted by plainblocks. You only install a small npm package on your Next.js project. There are no servers, no databases, and no Docker containers to manage.

Every paid plan starts with a 14-day free trial. No credit card is required until you decide to upgrade. You can downgrade or cancel at any time from your account settings.

Get started

Start building. No card required.

One project, free forever. Add more projects and seats when you're ready.