Pourquoi WordPress Headless ?
WordPress sans son thème, c'est un moteur de contenu surpuissant.
Imagine : WordPress, c'est comme un jeu vidéo avec un moteur graphique surpuissant (le CMS) mais bloqué sur un vieux rendu 2D (les thèmes PHP). Le mode headless, c'est garder le moteur et brancher un rendu next-gen (Next.js). Tu gardes le meilleur des deux mondes.
Pas besoin de tout recoder : WordPress gère le contenu, Next.js gère l'affichage. Chacun fait ce qu'il fait de mieux.
1.1WordPress traditionnel vs Headless
En mode classique, WordPress fait tout : il stocke le contenu, il génère le HTML, il gère les thèmes, les plugins, l'affichage. C'est pratique, mais ça a des limites :
- Performance : chaque page est générée à la volée par PHP. Pas de cache intelligent, pas de pré-rendu.
- Flexibilité front : tu es coincé avec les thèmes PHP. Impossible d'utiliser React, les animations modernes, ou un vrai design system.
- Sécurité : ton site et ton admin sont au même endroit. Une faille dans un plugin expose tout.
- Scalabilité : un pic de trafic met ton WordPress à genoux car il doit tout recalculer.
En mode headless, WordPress ne s'occupe plus que du contenu. Il expose une API REST que ton front-end Next.js vient consommer. Le résultat ?
Ultra rapide
Next.js pré-rend les pages en HTML statique. Temps de chargement : quasi instantané.
Design libre
React, Tailwind, Framer Motion... tout l'écosystème moderne est à ta disposition.
Sécurisé
Le CMS est caché derrière un proxy. Les visiteurs ne voient jamais WordPress.
Scalable
Le front est sur un CDN (Cloudflare, Vercel). Pas de serveur PHP à faire tourner.
1.2Comment ça marche concrètement ?
Voici le flux d'un site WordPress headless avec Next.js :
┌─────────────────┐ API REST ┌─────────────────┐
│ │ ←─────────────────→ │ │
│ WordPress │ /wp-json/wp/v2 │ Next.js │
│ (CMS back) │ /wp-json/bts/v1 │ (front-end) │
│ │ │ │
│ - Articles │ │ - React/TSX │
│ - Pages │ JSON │ - Tailwind │
│ - Utilisateurs │ ◄──────────────────►│ - SSR/SSG │
│ - Custom types │ │ - CDN │
│ │ │ │
└─────────────────┘ └─────────────────┘
cms.monsite.fr www.monsite.frL'utilisateur visite www.monsite.fr. Next.js récupère le contenu depuis WordPress via l'API REST, le transforme en HTML optimisé et le sert. WordPress n'est jamais directement accessible par les visiteurs.
C'est pas de la théorie
Le site que tu es en train de lire fonctionne exactement comme ça ! BaliseTonSite utilise WordPress comme CMS headless avec Next.js en front. Tu apprends en regardant un vrai exemple.1.3Pourquoi WordPress et pas un autre CMS ?
Il existe plein de "headless CMS" : Strapi, Sanity, Contentful, Directus... Alors pourquoi WordPress ?
- 43% du web tourne sur WordPress. En le maîtrisant, tu parles la langue de la majorité des projets.
- Écosystème massif : plugins, communauté, documentation. Tu ne seras jamais bloqué.
- Gratuit et open-source : pas de vendor lock-in ni de pricing surprise.
- WooCommerce : si tu veux du e-commerce, c'est intégré. Essaie de faire ça avec Sanity.
- Clients existants : beaucoup d'entreprises ont déjà WordPress. Tu peux moderniser leur front sans tout refaire.
Attention au piège
WordPress headless ne veut PAS dire installer un thème WordPress. Le thème est désactivé. Il n'y a plus de front-end PHP. Seule l'admin et l'API REST sont utilisées.1.4Ce que tu vas apprendre dans ce cours
À la fin de ce parcours, tu sauras :
Tu viens de...
Comprendre pourquoi le combo WordPress headless + Next.js est une architecture puissante et très demandée en entreprise. Dans le prochain chapitre, on installe WordPress et on le configure en mode headless. C'est parti !