# Next.js boilerplate with Sanity blog

> A hosted, structured blog on Sanity. The Studio mounts inside this app at /studio, and every GROQ query lives in one typed file. Draft previews use Next.js draft mode. Webhook revalidation puts a publish live in seconds, with no deploy.

A real editorial CMS your writers can use, with the schema still living in your repo.

- **Category:** Content
- **Pricing:** Free plan: up to 20 seats, 2 public datasets and 10k documents. Growth is $15 per seat per month: up to 50 seats, private datasets and 25k documents. Past its included quotas, Growth bills pay-as-you-go. Enterprise is custom.
- **Best for:** Teams where the people writing are not the people deploying: marketing, content and design working next to engineering. Best when content is structured (authors, categories, references between documents), not a pile of long markdown files. Also when you need previews, roles and a real-time editor without building one.
- **Conflicts with:** blog-mdx, blog-payload
- **Vendor docs:** https://www.sanity.io/docs

## Trade-offs

- Content lives in someone else's database. Losing access to the project, or a pricing change, is a business risk a folder of markdown does not have. Export regularly. The dataset export is one CLI command.
- GROQ is a new query language for the team. Projections make over-fetching easy to avoid, but nobody arrives knowing it, and a bad projection fails silently.
- Caching becomes your job. Content changes without a deploy, so you need an answer to "why is this page stale?". The tags and webhook route in this battery are that answer.
- The Studio is a dependency of your app. Mounting it at /studio adds Sanity and styled-components to your install. The route is static and code-split, but the install is bigger.
- Sanity Studio v6 needs Node.js 22.12 or later, and next-sanity 13 needs Next.js 16. The generated package.json sets `engines.node` to `>=22.12`, which Vercel reads. On Node 20 the app still builds, but the `sanity` CLI refuses to run. Set Node 22 or 24 on any other host or build image.
- Structured content costs more upfront and pays off later. Modelling authors and categories as references takes an afternoon and saves you the day you want an author page.

## Known fixes it ships

- [Draft mode is on, and the page still shows published content](https://agenticboilerplate.com/cookbook/blog-sanity/draft-mode-and-the-app-router-cache): Draft mode only bypasses caches for reads that know about it. One direct client.fetch, or a token-less client, and the editor sees yesterday's copy.
- [GROQ projections that stop your blog index fetching every article body](https://agenticboilerplate.com/cookbook/blog-sanity/groq-projections-that-avoid-over-fetching): *[_type == "post"] returns whole documents, drafts of fields included. Project explicitly, dereference in the query, and slice every list.
- [Sanity images without the 4MB original and the layout jump](https://agenticboilerplate.com/cookbook/blog-sanity/image-urls-and-lqip): asset->url hands the browser the raw upload. Build a transform URL with a width, and use the LQIP Sanity already generated as the blur placeholder.
- [Modelling references in Sanity without an N+1 on every page](https://agenticboilerplate.com/cookbook/blog-sanity/modelling-references-without-n-plus-one): A reference is a pointer, not an embed. Dereference inside the projection, model the direction that reads well, and never resolve in a loop.
- [Webhook revalidation or a revalidate timer: pick one](https://agenticboilerplate.com/cookbook/blog-sanity/webhook-revalidation-vs-time-based): A 60-second timer rebuilds pages nobody asked for and still makes editors wait. Tag every read, invalidate on publish, and stop guessing.

## Generate it

[Build a repo with Sanity blog](https://agenticboilerplate.com/build?b=blog-sanity)

---

Agentic Boilerplate: A Next.js repo your agent already knows. $99 once. Lifetime access and updates.

- Site map for agents: https://agenticboilerplate.com/llms.txt
- Public API: https://agenticboilerplate.com/openapi.json
- Contact: agenticstudio@gmail.com