De WordPress à Next.js: Guide de migration pour la croissance de SaaS
J'ai travaillé avec plus de 200 entreprises SaaS. Chacun d'eux a commencé avec WordPress. Pourquoi ? C'est pas cher. C'est facile. Il y a des milliers de plugins. Mais quand vous avez frappé 10 000 visiteurs mensuels, les fissures apparaissent. La vitesse des pages baisse. Les scripts PHP ralentissent votre base de données. Votre équipe marketing ne peut pas personnaliser le flux de caisse. Vous avez besoin d'une pile moderne.
Note méthodologique : les étapes de migration, les échéanciers et le temps de charge de 60 % / 40 % des améliorations du score SEO citées reflètent les migrations DG10 SaaS de janvier à août 2026 (Contentful, Sanity, Strapi backends). Les références d'outils et les détails de free-tier ont été vérifiés à nouveau en septembre 2026.
Ce guide s'adresse aux fondateurs de SaaS, aux CTO et aux ingénieurs principaux. Je vais vous montrer exactement comment migrer de WordPress vers Next.js sans perdre le trafic, SEO, ou la santé.
Pourquoi WordPress fait face à l'échelle pour SaaS
WordPress autorise 43% de tous les sites Web. C'est un fait deW3Techs. Mais pour les applications SaaS, c'est une responsabilité.
Les pages sont lentes.Un site WordPress typique avec 30 plugins charge en 4.2 secondes. D'aprèsPageSpeed Insights de Google. Pour SaaS, chaque seconde supplémentaire coûte 7 % des conversions (source :Akamai).
Trous de sécurité.52% des vulnérabilités WordPress proviennent de plugins (source:WPScan). Pour SaaS gérer les données utilisateur, c'est un procès qui attend d'arriver.
Pas de routage dynamique.WordPress est construit pour les blogs. SaaS a besoin de tableaux de bord personnalisés, de profils d'utilisateurs et de mises à jour en temps réel. Vous le piratez avec des types de poste personnalisés et plugin après plugin.
Les bases de données se brisent.WordPress utilise MySQL. Votre SaaS grandit, vos requêtes de base de données grandissent. Par 50 000 utilisateurs, votre panneau d'administration prend 8 secondes pour charger. J'ai vu ça.
Next.js résout cela. C'est un framework React qui fonctionne sur Node.js. Il vous donne le rendu côté serveur, la génération statique du site et les routes API. Cela signifie des pages plus rapides, moins de problèmes de sécurité et une meilleure évolutivité.
Ce qui est un CMS sans tête et pourquoi vous en avez besoin
Lorsque vous migrez vers Next.js, vous séparez l'extrémité avant de l'extrémité arrière. C'est sans tête. WordPress devient votre système de gestion de contenu (CMS) mais pas votre couche de présentation. Ou vous passez à un CMS sans tête dédié.
Un CMS sans tête stocke le contenu et le livre via APIs. Next.js tire ce contenu au moment de la compilation ou de la requête. Avantages:
- Plus vite.Les mises à jour de contenu ne régénèrent pas tout le site.
- Multi-canal.Même contenu pour le web, l'application mobile et API.
- Sécurité.Pas de tableau de bord public. Pas de vulnérabilités plugin.
Les deux CMS les plus populaires sans tête pour Next.js sontContenuetSanité. Les deux ont des niveaux libres qui prennent en charge petit SaaS. Dans ce guide, je vais vous montrer comment migrer le contenu WordPress dans l'un de ceux-ci.
Plan de migration : étape par étape
J'ai fait cette migration pour 7 entreprises SaaS. Voici le plan exact.
Étape 1: Vérification de votre site WordPress actuel
Exporter une liste de:
- Postes et pages (nombre)
- Types de messages personnalisés (par exemple, Études de cas, Produits)
- Fichiers multimédias (images, PDF)
- Catégories et étiquettes
- Rôles et autorisations des utilisateurs
- Greffons actifs (listez chacun d'eux)
Exemple :Un client avait 800 billets, 12 types de billets personnalisés et 47 plugins actifs. Nous avons réduit cela à 4 plugins après la migration.
Étape 2: Choisissez votre CMS sans tête
Vous avez deux chemins :
Chemin A: Gardez WordPress comme moteur.Utilisez laWP REST APIexposer le contenu à Next.js. Cela fonctionne pour les petites migrations, mais porte toujours la charge de la base de données WordPress.
Chemin B : Migrer vers un nouveau CMS sans tête.Je recommandeContenupour le contenu structuré.Sanitéest mieux pour les équipes qui veulent un contrôle total sur l'éditeur de contenu.
Chemin C: Utiliser un CMS statique commeStrapi.Source ouverte, auto-hôte. Fonctionne bien pour SaaS sur un budget.
Pour ce guide, nous utiliserons Contentful. Ils fournissent un niveau gratuit avec 5 utilisateurs et 10 000 enregistrements.
Étape 3: Exporter le contenu WordPress
Exécutez l'outil d'exportation natif WordPress :Outils>Exportation. Choisissez tout le contenu. Vous obtiendrez un fichier XML.
Pour les sites plus grands (50 000 postes), utilisez leWP-CLIcommande & #160;:
wp export --filters=post_type=post --dir=/path/to/export
J'ai utilisé ceci pour un client SaaS avec 120.000 billets de blog. Ça a pris 6 heures. Le résultat était un fichier XML de 800 Mo.
Étape 4: Importer dans votre CMS sans tête
Contentful fournit un outil d'importation appeléImportation. Vous devrez transformer le XML WordPress en un format JSON compatible avec le modèle Contentful.
Idée de script :Écrire un script Node.js ou Python en utilisant lexml2jsbibliothèque. Carte des champs WordPress vers les champs Contentful.
- WordPress
post_title→ Contenutitle(Texte abrégé) post_content→body(Texte intégral)post_excerpt→excerpt(Texte long)post_date→publishDate(Date)categories→category(champ de référence)tags→tags(champ de référence)- Image en vedette →
featuredImage(champ médiatique)
J'utilise une version modifiée de laWordPress Contente Migrationoutil open-source. Il gère 80% de la cartographie.
Temps estimé:2 à 5 jours pour un site avec plus de 1000 messages.
Étape 5 : Mettre en place le projet Next.js
Initialiser un projet Next.js :
npx create-next-app@latest my-saas-site --typescript
Installez le SDK Contentful :
npm install contentful
Créer un fichierlib/contentful.ts:
import { createClient } from 'contentful'
const client = createClient({
space: process.env.CONTENTFUL_SPACE_ID,
accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
})
export default client
Maintenant vous pouvez chercher du contenu n'importe où.
Étape 6: Construire des pages avec Next.js
UtilisationgetStaticPropsougetServerSideProps, vous récupérer du contenu de Contentful et le rendre. Pour les billets de blog:
export async function getStaticProps({ params }) {
const { items } = await client.getEntries({
content_type: 'blogPost',
'fields.slug': params.slug,
})
return { props: { post: items[0].fields } }
}
Gain de performance :Next.js génère des pages statiques au moment de la construction. Votre blog charge en moins de 300ms au lieu de 4 secondes.
Voici les données réelles d'un client après la migration:
| métrique | WordPress | Next.js (statique) |
|---|---|---|
| Temps de chargement de la page | 4.3s | 0,8s |
| Temps d'interaction | 6.1s | 1.2s |
| Score de performance Lighthouse | 42 | 89 |
| Score SEO (Semrush) | 68 | 92 |
| Taux de rebond | 58% | 34% |
| Taux de conversion | 1.9% | 3.6% |
Source:données internes du client DG10 Agency, anonymisées.
Étape 7: Poignez les itinéraires dynamiques et les tableaux de bord des utilisateurs
Les applications SaaS ont besoin de pages spécifiques à l'utilisateur. Next.js prend en charge les itinéraires dynamiques avec[slug].tsxou[id].tsx. Pour les tableaux de bord utilisateur, utilisergetServerSidePropspour récupérer les données utilisateur de votre moteur.
Exemple :/dashboard/[userId].tsxrécupère les informations de compte et rend une page personnalisée.
Étape 8: Configurer SEO et rediriger
Les URLs WordPress peuvent avoir changé. Vous devez configurer 301 redirections pour éviter les erreurs 404.
Dans Next.js, utilisernext.config.js:
async redirects() {
return [
{ source: '/old-wordpress-page', destination: '/new-page', permanent: true },
]
}
Pour les balises méta SEO, utilisez lanext/headcomposant ounext-seoUn paquet.
Résultat :Après la migration, nous avons vu une augmentation de 12 % du trafic organique en 30 jours en raison des temps de chargement plus rapides.
Étape 9 : Lancement et suivi
Déployer surVercelouNetlifier. Les deux sont optimisés pour Next.js.
Mettre en place une surveillance:
- Cron emploi: lancer
npm run buildchaque jour pour récupérer un nouveau contenu de Contentful. - Analyse: utiliser Google Analytics 4 ou Plausible.
- Suivi des erreurs: Sentry ou LogRocket.
Erreurs courantes et comment les éviter
Erreur 1: Migrer tout le contenu avant l'essai.Commencez par 10 pages. Valider SEO, la vitesse et l'expérience utilisateur. Puis échelle.
Erreur 2: Ignorer l'optimisation de l'image.WordPress stocke souvent d'énormes images originales. Utiliser un CDN commeNuageuxouImgix. Next.js peut également utilisernext/imagepour l'optimisation automatique.
Erreur 3: Ne pas manipuler les formulaires.Les formulaires WordPress (p. ex. formulaire de contact 7) ne fonctionnent pas dans Next.js. UtilisationFormulairesou construire votre propre route API.
Erreur 4 : Oublier les sauvegardes.Conserver l'ancien site WordPress en vie pendant au moins 30 jours après la migration. Vous corrigez les redirections et les erreurs de contenu.
Foire aux questions
Combien coûte une migration WordPress vers Next.js ?
Un site de marketing SaaS fonctionne généralement de 15K$ à 40K$ avec une agence, animée par le nombre de pages, la complexité de modélisation CMS et la surface d'intégration. La licence CMS sans tête (Contentful, Sanity) et l'hébergement (Vercel, Netlify) ajoutent des lignes récurrentes — confirmez les limites de free-tier par rapport à vos comptes d'enregistrement avant de budgétiser. Obtenez la carte de redirection et la parité analytique par écrit comme livrables, pas des hypothèses.
Est-ce que nous perdrons le classement SEO pendant la migration?
Une migration planifiée oscille pendant deux à six semaines, puis se rétablit au-dessus du niveau de référence sur les requêtes axées sur la performance. Les pertes ne deviennent permanentes que lorsque les cartes de redirection sont ignorées ou que la parité analytique est perdue — toutes deux couvertes dans la section ci-dessus. Regarder la couverture de l'indice de Search Console hebdomadaire pendant 60 jours; la couverture plate plus les clics de récupération signifie que vous êtes à travers le pire.
Quel CMS sans tête choisir: Contentful, Sanity, ou Strapi?
Content pour les équipes qui veulent une infrastructure gérée et un niveau libre pour commencer; Sanity pour l'expérience de l'éditeur et la collaboration en temps réel; Strapi pour le contrôle auto-organisé. Ce guide utilise Contentful (5 utilisateurs, 10 000 enregistrements de niveau libre en date de septembre 2026) mais le modèle de migration transfère.
Pouvons-nous migrer progressivement au lieu de tout en même temps?
Oui — découpez page par page en commençant par des modèles de trafic supérieur, en exécutant WordPress et Next.js côte à côte derrière les redirections par étapes. La réduction progressive est la façon dont notre migration d'entreprise de 12 000 pages expédiée sans une falaise de trafic.
Avons-nous besoin de développeurs React sur le personnel après ?
Quelqu'un doit posséder la façade, soit la capacité de réaction interne, soit un agent de maintenance. Si votre équipe n'a pas de JavaScript, tenez compte du soutien continu dans la décision; les gains de performance ne persistent que si la base de codes reste maigre. Un examen trimestriel de la dépendance et du budget global est le minimum d'entretien viable.
Continuez à lire sur DG10
- Next.js vs WordPress pour Enterprise
- Correction des éléments essentiels du Web: Guide du développeur pour Lighthouse 95
- Agents AI pour l'automatisation des flux de travail
Combien de temps faut-il pour migrer?
Pour un site de marketing SaaS de moins de 200 pages, planifiez de 6 à 10 semaines : deux semaines pour l'audit du contenu et la modélisation CMS sans tête, trois à quatre pour les compilations de composants et la migration des données, et deux pour les redirections, l'AQ et la réduction par étapes. Les plus grands catalogues avec des pages d'application dynamiques fonctionnent de 12 à 16 semaines — la même bande de 8 à 16 semaines que notre entreprise migration pays. Les équipes de phase sous-estiment toujours la modélisation du contenu : WordPress vous permet d'improviser la structure par page, alors qu'un CMS sans tête vous force à la définir dès le départ, et précipiter cette étape conserve une semaine maintenant pour coûter un mois plus tard.
Protégez la continuité SEO avec une carte de redirection construite avant qu'une seule page ne migre — chaque URL indexée obtient une cible 1:1, vérifiée dans la mise en scène avec un crawler, puis surveillée dans Search Console pendant 60 jours après le lancement. On s'attend à ce que le trafic s'affaiblisse de deux à six semaines, même sur des migrations propres; ce qui sépare les recouvrements des pertes permanentes, c'est de savoir si les statistiques et la couverture des indices sont regardées chaque semaine. Expédiez la migration avec la parité analytique (même événements, mêmes entonnoirs) de sorte que l'histoire de performance — que 60% de temps de charge coupé — est prouvable dans vos propres données, pas seulement les nôtres.
Vérification avant la migration SEO: Que saisir avant de déménager
Avant de toucher le code, gelez une ligne de base que vous pouvez comparer pendant six mois : inventaire complet de l'URL du sitemap plus Search Console, trafic et conversions par modèle (pas seulement par page), Core Web Vitals par modèle de CrUX, et le profil complet de redirection et de rétrolien par URL. La plupart des équipes sautent la coupe par template et le regrettent — les migrations déplacent rarement chaque modèle également, et sans modèles de base de niveau, vous ne pouvez pas dire si un plongeon de trafic est un modèle de blog cassé ou une pénalité à l'échelle du site.
Exportez tout dans des fichiers en version, pas des captures d'écran: Screaming Frog ramp, Search Console performance exports, rapports de page d'atterrissage GA4, et une liste de backlink avec l'historique de contact pour les liens qui comptent. Conservez-les là où toute l'équipe peut les atteindre, parce que le développeur débogue un écart de redirection au cours de la neuvième semaine a besoin de la semaine-zéro ramper, pas la mémoire de quelqu'un de lui. Cette vérification prend de trois à cinq jours et paie pour elle-même la première fois que quelqu'un demande "a toujours été cette page?" — avec des données, la réponse prend des minutes; sans elle, l'argument prend des semaines.
Next.js est-il approprié pour votre SaaS ?
Next.js fonctionne mieux lorsque vous avez besoin:
- Pages d'atterrissage rapide (blog, site marketing)
- Tableau de bord utilisateur avec données dynamiques
- Routes API pour les fonctions sans serveur
- Haute performance SEO
Mais il est trop kill si vous n'avez qu'un simple blog sans compte utilisateur. Dans ce cas, gardez WordPress.
Pour la croissance de SaaS, la migration de WordPress vers Next.js est un mouvement stratégique. Je l'ai vu tripler les taux de conversion et réduire les coûts d'hébergement en deux. Commencez par l'audit. Alors tendre la main vers nous.
Besoin d'aide ?DG10 Agency se spécialise dans les migrations WordPress vers Next.js. Nous gérons l'importation de contenu, les pages personnalisées, les redirections et le déploiement. Réservez une consultation gratuite sur notreservices de développement Web et mobilepage.
