Headless CMS met Astro: content beheren zonder in te leveren op snelheid

Je wil een snelle website, maar je redacteuren willen content beheren zonder code aan te raken. Dat hoeft geen tegenstelling te zijn. Een headless CMS scheidt het schrijven van content van de presentatie ervan, en Astro neemt die presentatie voor zijn rekening. Het resultaat: een vertrouwde editor voor je team en een lichte, snelle site voor je bezoekers. In deze gids lees je wat een headless CMS is, hoe het met Astro samenwerkt, en welke van de drie aanpakken het best bij jouw project past.

Wat is een headless CMS?

Een headless CMS beheert je content los van de manier waarop ze getoond wordt, en levert die content via een API. Anders dan een traditioneel, gekoppeld CMS (zoals een klassieke WordPress-installatie) genereert een headless CMS zelf geen website. Zoals de Astro-documentatie het stelt: het CMS helpt je content schrijven, maar toont ze niet zelf; je haalt de content-data op en gebruikt ze in je project.

Het woord “headless” slaat op die ontkoppeling: de “body” (het beheer) staat los van de “head” (de presentatie). Jij kiest de head, en dat is waar Astro binnenkomt.

Waarom past een headless CMS goed bij Astro?

Astro is ontworpen om de presentatie te verzorgen en stuurt standaard geen client-side JavaScript naar de browser. Die filosofie sluit naadloos aan op een headless CMS: het CMS levert de data, Astro bouwt er een snelle pagina van.

We are taking an alternative approach which is to treat the website not as a JavaScript application but as a collection of HTML pages. Fred Schott, maker van Astro

Je redacteuren krijgen een visuele editor, gestandaardiseerde contenttypes en samenwerking, terwijl bezoekers de snelheid van een statische of edge-gerenderde frontend krijgen. Je hoeft dus niet te kiezen tussen beheergemak en performance.

De drie manieren om content te beheren in Astro

Voor je naar een CMS grijpt, loont het om de drie opties naast elkaar te zetten. Niet elk project heeft hetzelfde nodig.

Aanpak	Beste voor	Redactie	Voorbeeld
Content Collections (Markdown of Git)	Ontwikkelaars, kleine teams, docs en blogs	In bestanden, via Git	Lokale .md-bestanden
Visueel headless CMS	Niet-technische redacteuren	In een visuele editor	Storyblok, Sanity, Contentful
Headless WordPress	Teams die WordPress al kennen	In de WordPress-editor	WordPress als bron

1. Content Collections (Markdown of Git)

Astro heeft ingebouwde Content Collections. Je legt een schema vast en Astro controleert je content al tijdens de build, met automatische TypeScript type-safety. De ingebouwde loaders halen content uit mappen met Markdown, MDX, Markdoc, JSON, YAML of TOML. Voor een blog of documentatiesite die door ontwikkelaars beheerd wordt, is dit vaak de eenvoudigste en snelste keuze, zonder externe afhankelijkheid.

2. Een visueel headless CMS

Werken er niet-technische redacteuren mee, dan biedt een visueel headless CMS een vertrouwde editor met previews en rollen. Astro haalt de content op uit het CMS, en jij houdt de controle over de presentatie.

3. Headless WordPress

Heb je al een WordPress-site, dan kan je die als contentbron houden en de publieke site met Astro bouwen. Je team blijft in de WordPress-editor werken, bezoekers krijgen een snellere site.

Hoe haalt Astro content uit een headless CMS?

Astro biedt hiervoor meerdere routes, afhankelijk van het CMS:

• Een Astro-integratie. Sommige CMS’en, zoals Storyblok, bieden een integratie die specifiek content voor een Astro-site ophaalt.
• Een JavaScript-SDK. Andere leveren een SDK die je installeert om je remote content op te halen.
• De Content Loader API. Je kan een eigen loader bouwen om content uit elke bron te halen: een CMS, een database of een API-endpoint.

Daarbij bestaat er een belangrijk onderscheid in timing. Een build-time loader haalt data op tijdens de build en slaat ze op in een data store. Een live loader haalt data vers op bij elke request, zonder data store, en kan inkomende data filteren en met type-safety verifieren. Voor content die zelden verandert kies je build-time; voor content die vers moet zijn, een live loader of on-demand rendering.

Welke headless CMS’en werken met Astro?

Astro biedt officiele gidsen voor een groot aantal CMS’en. Een greep uit de bekendste:

• Storyblok, met een officiele Astro-integratie;
• Sanity, gericht op gestructureerde content;
• Contentful, via de contentful.js-SDK;
• Strapi, een open source, aanpasbaar headless CMS;
• Hygraph, met een GraphQL-endpoint;
• Directus, een backend-as-a-service;
• headless WordPress.

Daarnaast bestaan er gidsen voor tientallen andere (van Ghost en Prismic tot Decap en Payload). Astro wijst er bewust geen aan als “de beste”: de juiste keuze hangt af van je team, je budget en je workflow.

Headless WordPress met Astro

WordPress verdient een aparte vermelding, omdat zoveel sites er al op draaien. WordPress komt met een ingebouwde REST API om je data aan Astro te koppelen; optioneel installeer je WPGraphQL of Gato GraphQL voor GraphQL. Zo houd je de vertrouwde WordPress-editor als contentbron en bouw je de frontend met Astro. Overweeg je net de overstap vanuit WordPress, lees dan van WordPress naar Astro migreren, waar headless WordPress als tussenstap aan bod komt.

Waar moet je op letten?

Een paar eerlijke aandachtspunten:

• Build-tijd bij grote sites. Wie alles bij de build ophaalt, kan bij heel veel pagina’s lange builds krijgen. Dan zijn on-demand of live rendering een uitweg.
• Previews. Wil je dat redacteuren wijzigingen live zien voor publicatie, dan heb je een preview-opzet nodig (vaak via live loaders of on-demand rendering).
• Kosten. Gehoste CMS’en hebben uiteenlopende plannen, van gratis tiers tot betaalde abonnementen. Check de actuele prijspagina van het CMS; verzin er geen.
• Afhankelijkheid. Een extern CMS is een extra dienst om te beheren en te betalen. Voor kleine sites is dat soms overbodig.

Wanneer heb je geen los CMS nodig?

Niet elke site heeft een headless CMS nodig. Beheren vooral ontwikkelaars de content, of gaat het om een blog of documentatie die in Markdown leeft, dan volstaan Content Collections ruimschoots. Je vermijdt zo een extra dienst, een extra kost en een extra integratie. Begin eenvoudig, en stap pas over op een CMS wanneer niet-technische redacteuren zelf moeten kunnen publiceren.

Conclusie

Een headless CMS met Astro geeft je het beste van twee werelden: comfortabel contentbeheer en een snelle, lichte frontend. De keuze draait om je team. Beheren ontwikkelaars de content, dan zijn Content Collections vaak genoeg. Werken er niet-technische redacteuren mee, dan biedt een visueel headless CMS of headless WordPress de vertrouwde editor, terwijl Astro voor de snelheid zorgt. Wil je eerst de bredere afweging tussen Astro en WordPress? Lees dan Astro vs WordPress, of begin bij wat Astro is.