Chapitre 8 / 12

Étape 5 — Mettre en ligne avec Vercel

Dernière brique. Vercel va lire votre dépôt GitHub, transformer votre projet en site web, et lui donner une adresse publique.

Dix minutes la première fois. Deux ensuite, pour tous vos projets suivants.

  1. Créer votre compte

    Sur vercel.com, cliquez Sign Up, puis choisissez Continue with GitHub.

    En passant par GitHub, vous construisez le pont entre les deux services dès la première seconde.

  2. Choisir le plan Hobby

    Vercel vous demande si l'usage est personnel ou professionnel. Choisissez Hobby : gratuit, sans carte de crédit.

    Entrez votre nom, validez. Vous arrivez sur votre tableau de bord, encore vide.

  3. Ajouter un projet

    En haut à droite, cliquez Add New, puis Project dans le menu déroulant.

  4. Choisir GitHub

    Vercel demande d'où vient votre code. Trois possibilités s'affichent : GitHub, GitLab, Bitbucket.

    Cliquez Continue with GitHub, puis autorisez Vercel à accéder à vos dépôts — tous, ou seulement projet.

  5. Vérifier et déployer

    L'écran New Project s'affiche. En haut, Vercel confirme ce qu'il importe : votre-nom/projet, branche main.

    Regardez le champ Application Preset : il indique Next.js. Vercel a reconnu votre projet tout seul, il n'y a rien à configurer.

    Ne touchez à rien d'autre. Cliquez Deploy.

  6. Regarder la construction

    Des lignes défilent pendant une à deux minutes : Vercel installe, construit, vérifie, publie. C'est le même npm run build que Claude avait lancé de son côté, et c'est pour ça qu'il passe.

  7. Ouvrir votre site

    Un écran de félicitations, un aperçu de votre site, et une adresse en .vercel.app.

    Cliquez dessus. C'est en ligne, c'est public, ça marche.

Tableau de bord Vercel vide, le menu Add New ouvert avec l'entrée Project entourée
**Add New**, puis **Project**. Le badge Hobby confirme que vous êtes sur le plan gratuit.
Écran Import Git Repository de Vercel, le bouton Continue with GitHub entouré
Vercel demande d'où vient le code.
Écran New Project de Vercel, Next.js détecté en Application Preset, le bouton Deploy entouré
Next.js détecté automatiquement. Un seul bouton à cliquer.
Écran de déploiement Vercel avec les Build Logs en cours
En bas de l'écran, Vercel indique ce qui a déclenché le déploiement : la fusion de votre Pull Request.
Écran de succès Vercel avec l'aperçu du site déployé
Votre site, en ligne.
Mon adresse n'est pas celle que j'attendais

Si le nom de votre projet est déjà pris par quelqu'un d'autre sur Vercel, l'adresse reçoit un suffixe : projet-lovat-delta.vercel.app plutôt que projet.vercel.app.

Ce n'est pas une erreur, et ça n'a aucune conséquence. Vous pouvez la changer dans Settings → Domains, ou brancher un jour votre propre nom de domaine, qui remplacera tout ça.

Vercel me demande d'installer une application sur GitHub

C'est normal, et c'est la même mécanique qu'avec Claude : Vercel a besoin d'une autorisation pour lire vos dépôts et être prévenu quand ils changent.

Vous pouvez lui donner accès à tous vos dépôts, ou seulement à projet. Comme pour Claude : tout est plus confortable, une sélection est plus prudente.

Le déploiement a échoué (Build failed)

Ça arrive, et ça se répare en trois minutes.

Sur l'écran d'échec, Vercel affiche le journal de construction. Descendez jusqu'aux lignes en rouge, sélectionnez-les, copiez.

Retournez dans votre session Claude et collez, avec une phrase : « Le déploiement Vercel a échoué avec cette erreur, corrige-la. » Puis recréez la Pull Request, fusionnez, et Vercel repart tout seul.

C'est exactement le métier de Claude. Ne cherchez pas à comprendre l'erreur vous-même : donnez-la-lui.