← Retour au cours

Auth, base de données, déploiement

⏱ 45 min · 🎬 Video · 🏆 25 XP
🎬
Vidéo en production
Notre équipe pédagogique tourne actuellement cette leçon avec un·e formateur·rice expert·e. Le contenu textuel ci-dessous est complet et utilisable dès maintenant.

🔐 Authentification : 3 grandes options

L'authentification est l'un des sujets les plus critiques d'un SaaS. Next.js s'intègre avec plusieurs solutions matures.

SolutionTypeAvantagesInconvénients
NextAuth.js (Auth.js v5)Open source, self-hostedGratuit, flexible, 50+ providers OAuthConfiguration plus longue, gestion DB à faire
ClerkSaaS payantUI prête, MFA, organizations, webhooksCoût mensuel, dépendance fournisseur
Supabase AuthSaaS open sourceIntégré à Postgres, magic link, OAuthCouplé à l'écosystème Supabase

💡 Pour démarrer rapidement un MVP, Clerk reste imbattable (15 minutes pour avoir auth + UI complète). Pour un projet long terme self-hosted, NextAuth est solide.

🗄️ Bases de données compatibles Next.js

Next.js fonctionne avec n'importe quelle base, mais quelques services sortent du lot pour leur intégration native :

  • Neon — PostgreSQL serverless, scaling auto, branches comme Git, free tier généreux
  • Supabase — Postgres + Auth + Storage + Realtime + Edge Functions, tout-en-un
  • Vercel Postgres — propulsé par Neon, intégration native dans le dashboard Vercel
  • PlanetScale — MySQL serverless avec branches (en pause sur free tier en 2024)
  • Turso — SQLite distribué, idéal pour edge computing

🧰 ORM : Drizzle vs Prisma

Pour interagir avec une base SQL, deux ORM dominent l'écosystème.

CritèreDrizzlePrisma
ApprocheSQL-first, schema TypeScriptSchema déclaratif, génération de client
BundleTrès léger, zero dépendancePlus lourd (Rust engine)
PerformanceExcellente, proche SQL natifBonne, overhead du client généré
Edge RuntimeCompatible nativementCompatible avec Accelerate
Migrationsdrizzle-kit, simpleprisma migrate, mature
CourbePlus proche du SQLPlus accessible débutants

🔑 Variables d'environnement et secrets

Next.js gère trois types de fichiers env :

  • .env.local — secrets locaux, jamais commit dans Git
  • .env.development — config dev partagée
  • .env.production — config prod (mais les vrais secrets vont dans Vercel)

Règle critique : tout ce qui commence par NEXT_PUBLIC_ est exposé au navigateur. Tout le reste reste privé côté serveur. Ne jamais préfixer une clé API privée avec NEXT_PUBLIC.

🚀 Déploiement Vercel en 3 étapes

  1. Push sur Git — Vercel détecte chaque commit sur main et déclenche un build
  2. Build automatique — installation des dépendances, build Next.js, déploiement edge global
  3. Preview branches — chaque pull request a son URL temporaire pour la review

Le tout en moins de 2 minutes, sans aucune configuration serveur. C'est l'expérience que les équipes recherchent et qui explique 80 % de la popularité de Vercel.

🌍 Custom domains et SSL

Connecter un domaine personnalisé prend 5 minutes :

  • Ajouter le domaine dans Vercel
  • Mettre à jour les DNS (CNAME ou A record)
  • Vercel génère un certificat SSL gratuit (Let's Encrypt)
  • Renouvellement automatique perpétuel

📊 Speed Insights et Web Analytics

Vercel propose deux outils analytics intégrés :

  • Speed Insights — Core Web Vitals réels (LCP, FID, CLS) collectés depuis les vrais utilisateurs
  • Web Analytics — alternative respectueuse de la vie privée à Google Analytics, sans cookies

Ces outils s'activent en 1 clic et ne demandent aucune configuration.

🐛 Monitoring et logs

  • Vercel Logs — accès aux logs serverless en temps réel via le dashboard
  • Sentry — capture d'erreurs côté serveur ET client, source maps automatiques, alertes Slack
  • Axiom — log management avec recherche full-text et alertes
  • Datadog / New Relic — APM enterprise pour observabilité complète

💰 Coûts mensuels typiques d'un projet Next.js

StackPlanCoût mensuel
VercelHobby (perso, side-project)0 USD
VercelPro (équipe, projet pro)20 USD par membre
NeonFree tier0 USD (jusqu'à 0.5 GB)
NeonLaunch19 USD
ClerkFree tier0 USD (10 000 MAU)
ClerkPro25 USD + 0.02 USD par MAU
SentryDeveloper0 USD (5k events)
SentryTeam26 USD

✅ Avec un budget de 50 USD par mois, on peut faire tourner un SaaS pro complet : Vercel Pro + Neon Launch + Clerk Pro + Sentry. Imbattable.