Aller au contenu
Chapitre 6 / 9

Déployer avec Vercel

De localhost à une URL publique. Vercel CLI, prévisualisation, production, variables d'environnement, domaine personnalisé.

Deux façons de déployer

Interface de déploiement Vercel

Vercel via GitHub (recommandé) : tu connectes ton repo GitHub à Vercel. À chaque git push, Vercel redéploie automatiquement.

Vercel CLI : tu déploies depuis le terminal avec une commande. Plus direct, moins automatisé.

À noter : toutes les commandes de code ci-après peuvent être remplacées par des demandes à Claude dans la conversation. Ex : « À présent déploie en production sur Vercel ». Il mouline et déploie tout seul sur ton URL Vercel en prod.

Vercel CLI : installation et premier déploiement

npm install -g vercel
vercel login

Depuis le dossier de ton projet :

vercel

Vercel te pose quelques questions lors du premier déploiement. À la fin, il te retourne une URL de prévisualisation : une URL publique unique pour cette version.

Déployer en production

vercel --prod

Déploie la version actuelle en production et retourne l'URL publique définitive.

Workflow type

  1. Tu travailles en local avec Claude Code
  2. Tu vérifies le résultat dans le navigateur (localhost)
  3. vercel : URL de prévisualisation, tu partages pour feedback
  4. Tu intègres les retours
  5. vercel --prod : URL de production mise à jour

Variables d'environnement

# Ajouter une variable
vercel env add NOM_DE_LA_VARIABLE

# Lister les variables d'un projet
vercel env ls

# Supprimer une variable
vercel env rm NOM_DE_LA_VARIABLE

Les variables sont stockées côté Vercel et injectées automatiquement à chaque déploiement. Ton fichier .env.local reste sur ton ordinateur, jamais dans le repo GitHub.

Domaine personnalisé

vercel domains add mon-domaine.fr

Vercel t'indique ensuite les enregistrements DNS à configurer. La propagation prend entre quelques minutes et 48 heures. Vercel génère automatiquement le certificat SSL.

Vercel via GitHub : connexion automatique

  1. Va sur vercel.com et connecte ton compte GitHub.
  2. Importe ton repository.
  3. Vercel configure le projet automatiquement.
  4. À chaque git push origin main, Vercel redéploie automatiquement.

Tu n'as plus à taper vercel --prod manuellement. Chaque modification poussée sur la branche principale est en production en quelques secondes.

Victor Soussan

Lead Product Designer

J'accompagne les équipes design dans l'intégration de Claude Code : ateliers, sessions en binôme, mise en place de projets.