Headless React

This boilerplate gives you a complete, production-ready foundation for building CMS-driven React applications. It's designed to stay out of your way — swap the CMS, extend the design system, and ship with confidence.

What's included

React Router v7 in framework mode with full SSR support. Data loads server-side on every request — no client waterfalls.

Sanity as the default CMS, wired through a DataSource interface. Switch to any headless CMS by implementing a single interface — no changes to components or routes.

Tailwind CSS v4 with custom variants for dark mode, compact mode, contained layout, and more — all toggled via html class flags with zero JavaScript overhead.

TypeScript strict mode throughout. Component prop contracts drive CMS schemas — design front-to-back, not the other way around.

Adding a section in four steps

Define the type in types.ts, create the component in components/sections/, register it in sectionMap, and add a Sanity schema. The GROQ query and ComponentRenderer pick it up automatically.