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",});npm create @valbuildStudio, visual editing and AI tooling
Editors get drafts, previews and one-click publish. Developers get type-safe files and zero config.
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.
Editors create drafts and preview them before publishing. Publish creates a real Git commit, so your existing CI/CD takes it from there — no separate content pipeline to run.
Type safety you can actually rely on
Content lives in typed schemas, so mistakes get caught before they ship: internal links are validated against your real routes, and rich text themes are type-checked against the styles your schema allows. No query language, no runtime dependency — if it doesn't type-check, it doesn't ship.
No prod DB. No dev DB. Using Vercel or similar, just deploy your app — nothing else required.
- Type-safe content via Zod-like schemas
- Local-first workflow
- Git is the source of truth
- Deploy without any DB
- Internal links validated against real routes — a broken link is a build error, not a 404
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
In Val content is hard-coded, type-safe and validated. Although it is a fully fledged CMS, you can also use it as a tool that lets you manage images, validate routes, and work with rich text. Or maybe you just want a good and documented way to decouple content from UI? If that is the case, you can use it without even signing up.
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 use the same tooling: types, schema, and Val's 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.
npm create @valbuild