Un headless-CMS est un système de gestion de contenu qui sépare le stockage et la gestion du contenu (back-end) de la présentation visuelle (front-end). Le contenu est livré via API (GraphQL ou REST) et peut être affiché sur n'importe quel support : site web, app mobile, borne digitale, montre connectée.
Le Headless CMS inverse le modèle des CMS traditionnels (WordPress, Drupal). Au lieu d'avoir le contenu couplé à la présentation (theme/template), le headless CMS stocke le contenu dans un repository centralisé et le expose via API. Avantages : (1) Multi-channel — un même contenu sur site web, iOS, Android, kiosk, AR/VR, (2) Performance — le front-end est découplé, vous pouvez utiliser Next.js, Nuxt, ou Astro pour des perfs optimales, (3) Security — le back-end n'est pas exposé publiquement, moins de surface d'attaque. Providers : Contentful, Strapi (open source), Sanity, Prismic. Coût : 300-3000$/mois pour un usage professionnel.
Un Headless CMS, c'est comme une cuisine centrale dans un restaurant gastronomique. La cuisine prépare tous les plats (contenu) et les sert à la salle (front-end), à la terrasse (mobile app), et en livraison (API tierces). Le plat est le même, mais il est présenté différemment selon le canal. Si vous ouvrez une nouvelle salle (nouveau support), vous n'avez pas besoin de recréer les plats — juste le serveur qui les sert.
Le contenu est accessible via REST ou GraphQL. Les endpoints standards : /content pour récupérer le contenu, /media pour les assets, /search pour la recherche. GraphQL est préféré pour les apps mobiles car il permet de demander exactement les champs nécessaires (réduit la bande passante de 40% vs REST). Les APIs sont versionnées (v1, v2) pour garantir la rétrocompatibilité. Webhooks permettent d'informer les systèmes tiers lors d'un changement de contenu.
Vous définissez la structure du contenu via des "content types" (similaires aux modèles WordPress). Exemple : un type "Article" avec champs : titre (text), body (rich text), auteur (reference), catégorie (taxonomy), images (media). Chaque champ a un type (text, number, date, media, reference) et des règles de validation. Cette flexibilité permet de créer des contenus complexes que WordPress ne peut pas gérer nativement.
Le front-end est séparé du CMS — vous pouvez utiliser n'importe quelle technologie pour l'afficher. Options populaires : (1) Next.js — React framework avec SSG/SSR pour SEO optimal, (2) Astro — performant pour les sites mostly static, (3) Nuxt — Vue.js equivalent de Next.js. Cette séparation permet de : (1) Déployer le front-end sur un CDN (Vercel, Netlify) pour des perfs maximales, (2) Utiliser le même back-end pour plusieurs sites (multisite), (3) Faire des A/B tests sur le front-end sans impacter le CMS.
Marque de mode avec site e-commerce + app mobile + borne en magasin. Contenu unifié via CMS headless (Contentful). Chaque plateforme consomme la même API GraphQL. Cohérence parfaite des prix, stocks, descriptions sur tous les canaux. Résultat : erreurs de données -95%, time-to-market nouveau produit -70% (le contenu est créé une fois et déployé partout). La borne en magasin affiche le stock en temps réel sans développement supplémentaire.
| Métrique | Valeur |
|---|---|
| Réduction erreurs de données | -95% |
| Time-to-market produit | -70% |
| GraphQL vs REST bandwidth | -40% |
| Déploiement front-end CDN | TTFB < 100ms |
| Coût providers professionnels | 300-3000$/mois |