DEV Community

Cover image for What we kept adding to every Next.js + Sanity starter
Chris Lojniewski for Pagepro

Posted on

What we kept adding to every Next.js + Sanity starter

Most Next.js + Sanity starters give you a nice demo. The real work starts after that. On every client project we ended up adding the same things again.

At some point we stopped adding them project by project and put them in one place. Nexity is an open source system for starting and growing AI-native websites on Next.js + Sanity. It comes from 20+ migrations we did at Pagepro.

Meridian demo homepage

Here is the list of what we kept adding, and where each thing lives in the repo.

The boring parts every site needs

Page builder with about two dozen blocks, content types for pages, blog, case studies and podcast episodes, reusable libraries for authors and testimonials, header, footer, site settings.

Then the utils we kept rewriting, all in web/src/lib:

  • redirect-map.ts and redirect-loader.ts for redirects managed in the CMS (live about two minutes after publishing, with loop protection)
  • seo-title.ts and seo-robots.ts, with tests, plus one IS_INDEXABLE switch for launch
  • schema-org/ for JSON-LD and og-image.ts for generated share images
  • env.ts, Zod-validated env vars, so a missing key fails at startup and not in production

Also in the box: llms.txt, and every page as Markdown (add .md to any URL, try meridian.nexity.build/index.md).

The editor's side

This is the part demos skip. Editors open the Studio at /admin and see a click-to-edit preview. Behind it, every section schema groups its fields into tabs and validates before publishing:

Tabs, in text-block.ts:

groups: [{ name: "content", default: true }, { name: "options" }],
Enter fullscreen mode Exit fullscreen mode

Validation, in bento-grid.ts:

validation: (Rule) => Rule.required().min(1).error("Add at least one card."),
Enter fullscreen mode Exit fullscreen mode

Small things, but they are the difference between "the editor can use it" and "the editor writes to us".

Rules, so the AI follows the project

Three files give any coding agent the house rules: AGENTS.md (how to build), DESIGN.md (how it looks) and BRAND.md (what it says). Codex and Cursor read AGENTS.md natively, and Claude Code reaches it through a one-line import.

Next to those files there are skills for everyday work (create-section, link-fix, generate-alts, sanity-optimizations) and read-only agents that review the code before it ships.

create-section is the one I would try first. Before it writes anything, it checks whether an existing block already covers the request, then reuse, extend or new. After that it builds the section from DESIGN.md and BRAND.md and hands the result to reviewers that cannot edit files: content-model-architect, styling-fidelity-reviewer, sanity-schema-reviewer, groq-parity-reviewer and link-reviewer.

Try it

You need Node.js 22.12 or newer and a Sanity account (the free plan works).

npm create sanity@latest -- --template Pagepro/nexity/base
pnpm dev     # site on :3000, Studio on :3000/admin
Enter fullscreen mode Exit fullscreen mode

base/ is the unbranded starter and opens on an empty dataset with a "Next steps" screen. For the full demo with content, use Pagepro/nexity/theme-meridian and run pnpm seed on a fresh dataset.

To take a single skill without cloning anything:

npx degit Pagepro/nexity/.agents/skills/create-section .agents/skills/create-section
npx degit Pagepro/nexity/.agents/agents .agents/agents
Enter fullscreen mode Exit fullscreen mode

What it does not do

  • It has no importer for WordPress, Webflow or Framer. The migrations are our method, and the repo holds the patterns we extracted from them.
  • It is an opinionated stack. It is our approach to Next.js + Sanity, not the only way to build on them.
  • The marketing skills (site-contradictions, internal-links and others) are a separate Claude Code plugin, not part of the starters.

Why open source

We use Nexity on client projects and keep updating it, so the repo is the real thing, not a demo cut from it. Making it public means more people can tell us what we got wrong.

If it would have saved you a few days on your last Next.js + Sanity site, a star on GitHub helps other developers find it. Issues and PRs are even better, see CONTRIBUTING.md.

One question for the comments. What did you miss in the starters you tried?

GitHub logo Pagepro / nexity

Nexity is an open source system for starting and growing AI-native websites on Next.js + Sanity.

Nexity

Nexity is an open source system for starting and growing AI-native websites on Next.js + Sanity. Its starter, base/, is a pnpm monorepo with two packages:

  • web/: the Next.js 16 app (App Router, Tailwind CSS 4, TypeScript), with the Sanity Studio embedded at /admin.
  • studio/: a standalone Sanity Studio with the same schemas. Schemas live here and web/ imports them.

This repository holds the starter, a demo site built on it (theme-meridian/) and, in .agents/, the agent layer that works with them: skills and read-only agents (reviewers, auditors) for any coding agent (Claude Code, Codex, Cursor and others).

Stack

















































Version
Next.js 16.4 (App Router, Turbopack)
React 19.3
Sanity Studio 6.20 (next-sanity 13.3, @sanity/client 8.11)
Tailwind CSS 4.3, with shadcn/ui
TypeScript 7.0
Zod 4.6
Oxlint / Oxfmt 1.89 / 0.74
c15t (cookie consent) 3.1 (@c15t/nextjs)
Resend 6.34
Node.js 22.12 or
…





Top comments (0)