Skip to main content

Déploiement Vercel

Un guide étape par étape pour déployer une application sur Vercel

Étape 1 :

Avoir un repository Github sous l'organisation INNOCEAN.
Se connecter à Vercel avec le compte TeamProd.

Étape 2 :

Installer Vercel-CLI avec la commande suivante : npm i -g vercel

Ajouter à la racine du projet un dossier ".github"
Dans ce dossier, créer un nouveau dossier "workflows".
A l'intérieur de ce dossier, créer un fichier "deploy.yml" contenant la configuration suivante :

name: Deploy to Vercel

on:
  push:

    branches:
      - "*" # Déclencher pour toutes les branches sauf celles explicitement ignorées

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v2

      - name: Setup Node.js
        uses: actions/setup-node@v2
        with:
          node-version: "18" # Utilisez la version Node.js requise par votre projet

      - name: Install dependencies
        run: npm install

      - name: Deploy to Vercel (Production)
        if: github.ref == 'refs/heads/main' # Si la branche est 'main'
        env:
          VERCEL_TOKEN: ${{ secrets.VERCEL_TOKEN }}
        run: npx vercel --token $VERCEL_TOKEN --prod --confirm --cwd .

      - name: Deploy to Vercel (Staging)
        if: github.ref != 'refs/heads/main' # Si la branche n'est pas 'main'
        env:
          VERCEL_TOKEN: ${{ secrets.VERCEL_TOKEN }}
        run: npx vercel --token $VERCEL_TOKEN --confirm --cwd .

NE PAS OUBLIER COMMIT & PUSH SUR MAIN 

Étape 3 :

Dans le repository GitHub, aller à l'onglet Actions > Secrets and variables > Actions > New Repository Secret
Le nom de la clé doit être : "VERCEL_TOKEN"
Le secret doit être : HqqGOjsZyXFgAkKmvJkmLite (Clé Vercel qui est déjà générée)

Étape 4 :

Ouvrir le terminal et lancer la commande vercel login
Se connecter avec le compte GitHub TeamProd

Lancer la commande vercel --prod

Étape 5 :

Vérifier l'avancement du déploiement dans GitHub Actions.
Vérifier le déploiement sur Vercel