Comment installer Nuxt sur Saplo (Vue avec rendu SSR)

Nuxt est un framework construit sur Vue avec un rendu côté serveur complet - de manière similaire à ce que Next.js est pour React. Cependant, le SSR nécessite un processus Node de longue durée maintenu en mémoire, et non un simple répertoire de fichiers statiques, de sorte que l'hébergement mutualisé ordinaire ne peut pas gérer cela. Sur Saplo, tu lances Nuxt comme un service géré avec un redémarrage automatique, et nginx y dirige le trafic depuis le domaine.

À qui s'adresse Nuxt sur Saplo ?

Avant de commencer l'installation, vérifie si c'est le bon choix pour ton projet :

• Site web d'entreprise construit avec Vue, qui doit être bien classé dans les résultats de recherche - Le rendu côté serveur offre un avantage qu'un SPA classique composé uniquement d'un build statique ne peut pas fournir.
• Boutique headless connectée à sa propre API - Nuxt rend les pages produits côté serveur, ce qui facilite l'indexation.
• Application fullstack - Nuxt a des routes de serveur intégrées (/server/api), tu peux donc écrire un backend simple dans le même projet.
• Tu veux des déploiements avec git push au lieu d'une configuration manuelle du processus Node - Tu connectes le dépôt une fois, et Saplo construit et redémarre le service automatiquement.

Si le site n'a pas besoin de SSR (juste un nuxt generate entièrement statique), un stack statique du même catalogue sera plus léger et moins cher à maintenir.

Exigences

Pour installer Nuxt sur Saplo, tu as besoin de :

• Une Box L ou supérieure - le SSR maintient un processus Node constamment en mémoire et rend chaque requête à nouveau, il a donc besoin de plus de RAM qu'un site statique ordinaire.
• Un minimum de 512 Mo de RAM libre et 3 Go d'espace disque pour le processus de l'application lui-même.
• Un domaine ou un sous-domaine *.saploapp.pl inclus dans le prix de chaque plan.
• Un dépôt Git si tu souhaites utiliser le déploiement automatique (facultatif au début, tu peux aussi télécharger l'application via une archive .zip depuis le panneau).

Installation étape par étape

1. Dans le Panneau Saplo, accède au Catalogue d'applications et sélectionne Nuxt (catégorie "Applications").
2. Indique une Box de plan L ou supérieur et le nom de l'application - un sous-domaine par défaut sera créé à partir de ce nom.
3. Sélectionne la version de Node.js pour la compilation (18, 20 ou 22, par défaut 22) et confirme l'installation.
4. Le moteur crée une arborescence minimale de Nuxt 4 (dans Nuxt 4, le code de l'application a été déplacé dans le dossier app/), compile le projet et démarre un processus persistant .output/server/index.mjs via Supervisor sur le port 3000, et Nginx redirige le trafic du Domaine vers ce port.
5. Une fois l'installation terminée, le Domaine de l'étape 2 affiche la page de démarrage fonctionnelle de Nuxt - à partir de ce moment, tu peux déployer ton propre projet dessus.

Déployer ton code via Git

1. Dans les détails de l'application, trouve la section Git / CI-CD et clique sur "Connecter GitHub", confirme l'installation de l'application "Saplo Deploy" et indique le dépôt de ton projet Nuxt.
2. Le fichier saplo.yaml doit se trouver dans le répertoire racine du dépôt.
3. Committe et pousse le fichier saplo.yaml vers la branche de production (main par défaut).
4. Chaque git push suivant vers cette branche déclenche un build et un redémarrage du service. Tu peux voir le statut dans l'onglet Déploiements.
5. Après le build, Saplo vérifie la présence du fichier .output/server/index.mjs - s'il est absent, le déploiement se termine par une erreur au lieu de remplacer la version fonctionnelle par une version cassée.

Exemple de fichier saplo.yaml minimal pour Nuxt :

name: my-project
stack: nuxt
runtime:
  node: "22"
build:
  install: npm ci
  command: npm run build
start:
  command: node .output/server/index.mjs
  port: 3000

Nuxt sur Saplo vs. les alternatives

Questions fréquentes

Puis-je générer une version entièrement statique au lieu de SSR ? Oui, nuxt generate produit une sortie statique. Dans ce cas, dans le catalogue d'applications, choisis la pile statique au lieu de Nuxt.

De combien de RAM Nuxt a-t-il besoin en pratique ? Le manifeste de la recette indique un minimum de 512 Mo, mais pour un trafic de production réel, il est préférable de prévoir une Box L, afin que le processus SSR ait une marge de manœuvre pour les pics de charge.

Nuxt 3 fonctionnera-t-il également, étant donné que l'échafaudage génère Nuxt 4 ? Oui, l'installation depuis le catalogue met en place un squelette de démarrage Nuxt 4, mais tu peux déployer ton propre projet sur Nuxt 3 via git push sans aucune modification. La construction et le démarrage du processus fonctionnent de la même manière.

Que se passe-t-il si la construction échoue ? La version précédente et fonctionnelle de l'application reste en place, Saplo ne la remplace pas par une version défectueuse.

Obtiendrai-je un SSL et mon propre Domaine ? Oui, le certificat SSL est automatique, et un Domaine ou un sous-domaine *.saploapp.pl est inclus dans le prix de chaque plan.

Tu peux installer Nuxt sur Saplo de zéro à un Domaine fonctionnel en quelques minutes, et chaque git push suivant redémarre le service avec la nouvelle version sans ton intervention. Si le projet n'a pas besoin de SSR, une pile statique plus légère et moins chère à entretenir t'attendra dans le même répertoire.