Pourquoi self-héberger Next.js sur un VPS ?
Next.js est souvent associé à une plateforme d'hébergement spécifique, mais son serveur Node.js standalone tourne parfaitement sur n'importe quel VPS. L'auto-hébergement devient pertinent dès que vous utilisez intensément le SSR, l'ISR (régénération statique incrémentale) ou les routes API : ces fonctionnalités consomment des invocations facturées sur les plateformes managées, alors qu'elles sont gratuites et illimitées sur votre serveur. Vous contrôlez le cache ISR sur disque, la bande passante des images optimisées et le temps d'exécution des fonctions, sans limite de 10 secondes. Pour une agence qui héberge plusieurs sites clients, un VPS mutualise les coûts et simplifie la facturation.
Bénéfices concrets d'un Next.js auto-hébergé
- SSR et API routes sans quota d'invocations ni facturation à la fonction.
- Cache ISR persistant sur disque, pas de revalidation perdue entre déploiements.
- Bande passante incluse, idéale pour les sites riches en images et vidéos.
- Plusieurs projets Next.js sur un même VPS, mutualisés sous Nginx.
- Optimisation d'images
next/imageservie localement sans surcoût par transformation. - Build et déploiement maîtrisés via Git, CI/CD ou simple
git pullet rebuild.
Prérequis matériels et logiciels
Le build de Next.js est gourmand en mémoire : prévoyez au moins 2 Go de RAM (4 Go pour un gros projet avec beaucoup de pages), sinon le build peut échouer par manque de mémoire. Côté runtime, 1 à 2 vCPU suffisent pour servir le SSR. Installez Node.js 18 ou 20 LTS, soit nativement avec nvm, soit via une image Docker node:20-alpine. Utilisez PM2 pour superviser le processus Node, ou Docker pour l'isolation. Un domaine pointé vers le VPS est nécessaire pour le SSL. Activez output: 'standalone' dans next.config.js pour un déploiement léger.
Déployer Next.js étape par étape
Préparer le serveur
En SSH, installez Node.js 20 LTS et PM2 (npm install -g pm2), ou Docker. Clonez le dépôt et créez .env.production avec vos variables (NEXT_PUBLIC_* pour le client, secrets serveur pour les API routes).
Builder l'application
Lancez npm ci puis npm run build. Avec output: 'standalone', Next.js génère un dossier .next/standalone autonome contenant uniquement les dépendances nécessaires, ce qui allège fortement l'image.
Démarrer le serveur Node
Lancez le serveur avec pm2 start node --name nextjs -- .next/standalone/server.js sur le port 3000, ou via un conteneur Docker. Configurez pm2 startup et pm2 save pour un redémarrage automatique au reboot du VPS.
Configurer Nginx en frontal
Créez un bloc serveur qui fait proxy_pass http://localhost:3000, transmet les en-têtes Host et X-Forwarded-For, et sert directement /_next/static/ depuis le disque pour soulager Node. Activez la compression gzip.
Installer le certificat SSL
Obtenez un certificat Let's Encrypt via Certbot pour votredomaine.ma, forcez la redirection HTTPS et configurez le renouvellement automatique. Vérifiez que les en-têtes X-Forwarded-Proto sont bien transmis pour le SSR.
Mettre en place les déploiements
Automatisez le cycle git pull && npm ci && npm run build && pm2 reload nextjs via un script ou un webhook Git. Le reload PM2 assure un redémarrage sans coupure (zero-downtime) entre deux versions.
Si vous utilisez l'ISR, montez un volume persistant pour le dossier .next/cache afin que les pages revalidées survivent aux redéploiements. Sans cela, chaque rebuild repart d'un cache vide et provoque un pic de génération à la volée. Pour plusieurs instances Node derrière un load balancer, externalisez ce cache vers un stockage partagé ou Redis avec un cache handler personnalisé.
