Content without a front end. Strapi, Sanity, Contentful and Ghost store structured content and serve it as an API (JSON/GraphQL). Any front end — React, Vue, native app — fetches and renders it.
This is the entire headless idea in one view. Edit content in the mock CMS on the left, press Publish, and watch it flow as JSON through a simulated API into a rendered front-end card. Change anything and re-publish.
Lightweight grip for technical trails.
Same data, rendered by code — not by the CMS.
Because content is just data, the same entry can be delivered as REST JSON or via a GraphQL query. Switch the delivery format:
The front end calls the content API and renders the result — this is the actual code pattern the demo above simulates.
// React component pulling from a headless CMS
async function ProductCard({ id }) {
const res = await fetch(`https://cms.example.com/api/products/${id}`);
const data = await res.json();
return (
<article>
<span>{data.category}</span>
<h3>{data.title}</h3>
<p>{data.description}</p>
<strong>€{data.price}</strong>
</article>
);
}Different tools, same core principle — content lives behind an API, decoupled from presentation.
Open-source, self-hosted, Node.js. Auto-generates REST & GraphQL.
Real-time, structured content with the GROQ query language.
Enterprise SaaS, CDN-delivered content APIs.
Publishing-focused; headless Content API for blogs & newsletters.
Decoupling content from rendering buys you reach and freedom.
One API feeds web, iOS, Android, kiosks, smartwatches.
Render with React, Vue, Svelte, native — your choice.
Pair with static generation for CDN-served pages.
Rebuild the front end without touching the content.