Content As Code

Val is a NextJS native CMS where content is hard-coded into TypeScript files

const schema = s.object({
title: s.string(),
description: s.string(),
);
export default c.define("/src/app/page.val.ts", schema, {
title: "This is Content As Code",
description: "Keep reading to learn more",
});
Get Started
npm create @valbuild
Capabilities

Studio, visual editing and AI tooling

Editors get a real CMS. Devs get the ultimate dev experience.

Overview

For developers Val is just a library where content is hard-coded into TypeScript or JavaScript files.

But for editors, Val Studio delivers a true headless CMS experience with a visual editor.

The Ultimate Developer Experience

Content as code unlocks a seamless developer experience: zero runtime dependencies, full type safety, no query language, and built-in validation with IDE tooling. The type-safe harness with local files (that LLMs can understand), gives you an unrivaled agentic coding experience.

  • Type-safe content via Zod-like schemas
  • Local-first workflow
  • Git is the source of truth
  • Deploy without any DB
  • LSP / IntelliSense support: validation, route autocomplete, and binary files directly in your IDE

No prod DB. No dev DB. Using Vercel or similar, just deploy your app — nothing else required.

How does it work?

Watch how editors can create and view drafts, then publish those changes using Val.

Use cases

Lightweight and fast. Maintainable but easy to use.

Keep reading to see how Val can help you build better web applications.

  • Next.js

    A Better Next.js

    Val is just hard-coded, type-safe and validated content. Although it is a fully fledged CMS, you can also use it as a tool that lets you manage images, validate routes, and author rich text with a schema-driven editor instead of raw markdown strings. Best thing is that you do not even have to sign up to do this.

  • AI

    CMS in the age of AI

    LLMs work best when they have a good harness and the correct context. With Val, content is local, type-safe, and validated - Cursor and Claude uses the same tooling: types, schema and Vals validation LSP.

  • Architecture

    Scalable front-end architecture

    You can structure Val in any way you want. The starter template however, is built on the TABS architecture which promotes re-usable sections and makes it easy to build a scalable content-driven front-end.

    Read about TABS

Who is this for?

Val is a CMS for products, not publications. Perfect for web apps with many page types and developer-owned layouts. It is best for low article volume (i.e. less than 10K articles), high structure, and for large teams where type safety and developer experience matter most.

Perfect for

  • Next.js apps with code on GitHub
  • Product surfaces with many page types
  • Teams that value type safety and review
  • Content under ~10K entries per repo

Consider if

  • Publishing-heavy site with 100K+ articles
  • You want a hosted CMS that owns your content
  • Stack isn’t Next.js (other frameworks coming)

FAQ

A few quick answers about where Val runs best and how it handles growth.

Ready when you are

Val is free to install — pricing only kicks in when you connect a Pro project.

Get Started
npm create @valbuild
Read the docs