Nuxt.js est ce qui fait passer un projet Vue.js d'un prototype à un produit de production. C'est le meta-framework que j'utilise sur 100% de mes projets depuis 3 ans.
Le rendu serveur, le routage, le SEO, la gestion des API, l'optimisation des images, le déploiement. Sans Nuxt, chaque projet demande des heures de configuration. Avec Nuxt, tout est intégré, testé, documenté.
Ce site est construit avec Nuxt. Les centaines de pages d'articles, le glossaire, les pages d'expertise que vous lisez en ce moment, tout est généré par Nuxt Content et servi en SSR.
Le SSR est la fonctionnalité qui change tout. Quand un utilisateur ou un crawler Google accède à une page, le serveur génère le HTML complet avant de l'envoyer.
First Contentful Paint réduit. L'utilisateur voit du contenu en moins de 500ms au lieu d'attendre 2-3 secondes qu'un SPA charge son JavaScript.
Indexation immédiate. Google reçoit du HTML avec tout le contenu, les balises meta, les données structurées. Ça fait une différence mesurable sur le positionnement.
Hydratation intelligente. Une fois le HTML affiché, Vue prend le relais côté client pour l'interactivité. Le meilleur des deux mondes.
Pour les sites qui n'ont pas besoin de contenu dynamique au moment de la requête, Nuxt pré-génère chaque page en HTML statique au moment du build.
Des pages servies depuis un CDN avec des temps de réponse inférieurs à 50ms. Pas de serveur à maintenir, pas de base de données à requêter. C'est le mode le plus rapide et le moins coûteux.
Je combine souvent SSR et SSG dans le même projet : SSG pour les pages de contenu, SSR pour les pages dynamiques.
Nitro est le moteur serveur de Nuxt 3, et c'est ce qui rend Nuxt full-stack.
API routes. Un fichier dans server/api/ devient un endpoint. Validation, middleware, accès base de données, tout dans le même projet. Pour un MVP, c'est un gain de temps considérable.
Déploiement universel. Nitro compile pour n'importe quelle cible : Vercel, Netlify, Cloudflare Workers, Node.js, Deno, Bun. Le même code tourne partout.
Edge rendering. Sur Cloudflare Workers ou Vercel Edge, le rendu se fait au plus proche de l'utilisateur. Des temps de réponse globaux en dessous de 100ms.
Routage fichier strict. Chaque page correspond à un fichier dans pages/. Les routes dynamiques utilisent [param].vue ou [...slug].vue. Pas de configuration manuelle.
Composables métier. La logique réutilisable vit dans composables/. Chaque composable est typé et documenté. useAuth(), useApi(), useToast().
Middleware d'authentification. Protection des routes via des middleware Nuxt. Vérification du token, redirection, gestion des rôles. Centralisé et cohérent.
Layouts par contexte. Layout public (marketing), layout app (dashboard), layout minimal (auth). Chaque contexte a son propre layout.
Error handling centralisé. Page d'erreur personnalisée, gestion des 404, des erreurs API. L'utilisateur ne voit jamais une stack trace.