Déployer une application avec Claude Code : Vercel & Netlify (Guide 2026)

Déployer une application avec Claude Code : de `localhost` à une URL publique

Vous avez construit quelque chose — un portfolio, une landing page, un petit SaaS, une app React — et il tourne parfaitement sur localhost:3000. Sauf que personne d'autre que vous ne peut le voir. L'étape qui bloque le plus de développeurs débutants (et même confirmés) n'est pas de coder l'application : c'est de la mettre en ligne. Configuration de build, variables d'environnement, DNS, certificats HTTPS… autant de plomberie intimidante.

Bonne nouvelle : Claude Code transforme cette étape en une conversation. Dans ce guide 2026, on voit comment déployer une application de A à Z sur les deux plateformes les plus populaires — Vercel et Netlify — en pilotant l'agent plutôt qu'en cliquant à l'aveugle dans des tableaux de bord. À la clé : une URL publique, un HTTPS automatique et un déploiement continu à chaque git push.

Sommaire

Ce que « déployer » veut vraiment dire {#comprendre-deploiement}

Avant de lancer l'agent, posons le vocabulaire — c'est ce qui vous permettra de relire ce que fait Claude Code au lieu de subir des messages d'erreur incompréhensibles.

Déployer, c'est prendre le code qui tourne sur votre machine et le rendre accessible sur Internet à une adresse publique. Trois briques entrent en jeu :

Le déploiement moderne repose sur un principe simple : vous connectez votre dépôt Git à la plateforme, et chaque push redéploie automatiquement le site. Ce cycle s'appelle le déploiement continu. Si les commandes Git vous paraissent floues, notre guide sur les commits, branches et pull requests avec Claude Code pose les bases que l'on réutilise ici.

Vercel ou Netlify : quel hébergeur choisir ? {#vercel-ou-netlify}

Les deux plateformes sont excellentes, gratuites pour démarrer et parfaitement pilotables par Claude Code. Voici comment trancher selon votre projet :

En résumé : Vercel est le choix par défaut si vous utilisez Next.js (c'est le même éditeur) ou si votre app a besoin de fonctions serveur. Netlify est imbattable pour un site statique, un portfolio ou une landing page, avec l'option drag-and-drop qui met un dossier en ligne en dix secondes.

Le mieux ? Demandez directement à l'agent : « Voici mon package.json et ma stack. Entre Vercel et Netlify, lequel est le plus adapté et pourquoi ? » Claude Code analyse votre projet et recommande la plateforme la plus cohérente. Si vous partez d'une application plus complète, notre article sur créer un SaaS full-stack rapidement avec Claude Code montre comment structurer le projet en amont pour un déploiement sans friction.

Préparer l'application avec Claude Code {#preparer-app}

Un déploiement réussi commence par une application propre. Avant de penser hébergement, demandez à Claude Code de vérifier que le build passe en local :

« Vérifie que `npm run build` se termine sans erreur. S'il y a des avertissements ou des erreurs, corrige-les. Assure-toi qu'il n'y a aucune clé secrète en dur dans le code et que le `.gitignore` exclut bien `node_modules`, `.env` et les dossiers de build. »

Cette étape évite 80 % des échecs de déploiement. Un build qui casse en production casse presque toujours déjà en local — mais on ne le voit pas parce qu'on lance le serveur de développement (npm run dev), qui est plus permissif. Le mode production, lui, ne pardonne pas les imports cassés ni les variables manquantes.

Si vous débutez complètement avec l'outil, commencez par notre guide Claude Code pour débutants pour installer le CLI et lancer votre première session. Ensuite, ce déploiement deviendra une simple suite de prompts.

Étape 1 : versionner le projet avec Git {#etape-1-git}

Vercel et Netlify se connectent à un dépôt Git (GitHub, GitLab ou Bitbucket). Première étape, donc : versionner le projet. Claude Code gère Git de bout en bout :

« Initialise un dépôt Git si ce n'est pas déjà fait, crée un premier commit avec tout le projet (en respectant le `.gitignore`), puis crée un dépôt GitHub public nommé "mon-app" et pousse le code dessus. »

Si la CLI GitHub (gh) est installée et authentifiée, Claude Code crée le dépôt distant et pousse le code sans que vous quittiez le terminal. Sinon, il vous guide pour créer le dépôt manuellement puis configure le remote.

Point de vigilance : relisez le premier commit. Demandez « liste les fichiers qui vont être poussés » pour vérifier qu'aucun .env ni fichier de secret ne se glisse dans le dépôt. C'est le moment de tout attraper — une clé API poussée sur un dépôt public est compromise en quelques minutes.

Étape 2 : déployer sur Vercel {#etape-2-vercel}

Une fois le code sur GitHub, le déploiement Vercel se fait en une poignée de minutes. Deux approches, toutes deux pilotables par Claude Code.

Approche CLI (la plus rapide dans le terminal) :

« Installe la CLI Vercel (`npm i -g vercel`), connecte-moi à mon compte, puis déploie ce projet en production. Configure la commande de build et le dossier de sortie automatiquement en détectant le framework. »

Claude Code lance vercel, détecte que c'est un projet Next.js/React, propose la bonne configuration et déploie. À la fin, vous récupérez une URL du type https://mon-app.vercel.app — votre application est en ligne.

Approche tableau de bord (la plus visuelle) : connectez votre dépôt GitHub sur vercel.com, cliquez « Import », puis « Deploy ». Vercel détecte le framework et build automatiquement. Chaque push ultérieur redéploie tout seul.

Si votre projet a besoin d'un fichier de configuration spécifique, demandez-le : « Génère un vercel.json avec les rewrites nécessaires pour mon routing et les headers de sécurité. » Cette maîtrise de la configuration par prompt est exactement ce qui rend l'outil si productif — le même réflexe que l'on retrouve dans notre guide sur la création d'une API REST avec Claude Code, où l'on délègue toute la plomberie technique.

Étape 3 : déployer sur Netlify {#etape-3-netlify}

Sur Netlify, la logique est identique. Pour un site statique ou une app front-end :

« Installe la CLI Netlify (`npm i -g netlify-cli`), authentifie-moi, puis déploie ce projet en production. Génère un `netlify.toml` avec la commande de build `npm run build`, le dossier de publication correct et une redirection SPA vers index.html si nécessaire. »

Le fichier netlify.toml est le cœur de la configuration Netlify. Claude Code y déclare la commande de build, le dossier publié et les règles de redirection — indispensables pour une Single Page Application où toutes les routes doivent pointer vers index.html.

Netlify propose aussi un déploiement drag-and-drop : pour un site purement statique déjà buildé, vous déposez le dossier dist sur app.netlify.com et le site est en ligne, sans même passer par Git. Pratique pour un prototype ultra-rapide. Et bon point pour les débutants : l'inscription ne demande pas de carte bancaire.

Étape 4 : variables d'environnement et secrets {#etape-4-env}

C'est le point qui casse le plus de déploiements. Votre application fonctionne en local parce que votre fichier .env contient vos clés (API, base de données, services tiers). Mais ce fichier n'est pas — et ne doit jamais être — poussé sur Git. En production, la plateforme n'a donc aucune idée de ces valeurs.

La bonne pratique, que Claude Code applique volontiers :

« Génère un fichier `.env.example` qui liste toutes les variables d'environnement utilisées dans le code, avec des valeurs factices ou une description, mais aucune valeur réelle. Vérifie que `.env` est dans le `.gitignore`. Puis liste-moi les variables que je dois ajouter dans le tableau de bord Vercel/Netlify. »

Vous copiez ensuite ces variables dans les réglages du projet sur la plateforme (section « Environment Variables »). Au prochain build, la plateforme les injecte, et votre code les lit via process.env.MA_VARIABLE exactement comme en local. Cette rigueur sur les secrets n'est pas une option : c'est la frontière entre un projet amateur et un déploiement sérieux.

**Vous voulez déléguer réellement toute la chaîne technique — du code au déploiement en production — plutôt que de bloquer sur chaque erreur de build ?** Découvrez [comment vous faire remplacer par l'IA](https://go.saas-ia.io/se-faire-remplacer-par-lia) sur la partie infrastructure et mise en ligne, et gardez votre énergie pour la conception de votre produit.

Étape 5 : domaine personnalisé et HTTPS {#etape-5-domaine}

Le sous-domaine gratuit (.vercel.app ou .netlify.app) suffit pour tester, mais un vrai projet mérite son propre domaine. Là encore, Claude Code vous guide :

« J'ai acheté le domaine mon-app.com. Explique-moi précisément quels enregistrements DNS ajouter chez mon registrar pour le connecter à Vercel, et comment vérifier que le certificat HTTPS est bien actif. »

Concrètement, vous ajoutez le domaine dans les réglages du projet, la plateforme vous donne les enregistrements DNS (un enregistrement A ou CNAME) à configurer chez votre registrar (OVH, Gandi, Namecheap…). En quelques minutes à quelques heures (le temps de propagation DNS), votre site répond sur votre domaine, avec un certificat HTTPS généré et renouvelé automatiquement — gratuitement, via Let's Encrypt. Aucune configuration manuelle de certificat : c'est l'un des grands conforts de ces plateformes.

Déboguer un build qui échoue {#debugger-build}

Tôt ou tard, un déploiement échouera. C'est normal — et c'est justement là que Claude Code fait la différence. Le réflexe : copier le log d'erreur affiché par la plateforme et le coller dans l'agent.

« Mon déploiement Vercel échoue. Voici le log complet du build : [coller le log]. Diagnostique la cause et corrige. »

Les causes les plus fréquentes que Claude Code résout en quelques secondes :

Cette capacité à lire un message d'erreur brut et à proposer le correctif exact est au cœur de la méthode. Pour aller plus loin sur cette compétence, notre guide comment déboguer avec Claude Code détaille la démarche sur tous types de bugs, pas seulement de déploiement.

Auto-hébergement : l'alternative VPS {#auto-hebergement}

Vercel et Netlify sont parfaits pour démarrer, mais certains projets exigent un contrôle total : données sensibles, souveraineté, coûts maîtrisés à grande échelle, ou simplement l'envie d'apprendre. L'alternative est l'auto-hébergement sur un VPS (serveur privé virtuel chez un fournisseur comme Hetzner, Scaleway ou OVH).

Là aussi, Claude Code excelle :

« Prépare le déploiement de cette app sur un VPS Ubuntu : Dockerfile de production, configuration Nginx en reverse proxy, certificat HTTPS via Certbot, et un script de déploiement. Documente les étapes. »

La logique reste la même que sur une plateforme managée : un conteneur, un reverse proxy, un certificat. Si l'auto-hébergement et la souveraineté de vos agents et services IA vous intéressent en profondeur, la formation OpenClaw sur les agents IA auto-hébergés explore comment garder le contrôle total de son infrastructure sans dépendre d'un fournisseur cloud — une approche complémentaire à ce guide.

Et si votre application déployée consomme des données externes (annonces, données métier, référentiels), regarder une API bien structurée comme ImmoAPI — endpoints documentés, pagination, réponses JSON propres — donne un bon modèle de ce à quoi une source de données prête pour la production doit ressembler côté back-end.

Le déploiement en vidéo {#video}

Rien ne vaut une démonstration pour voir l'enchaînement complet — de l'application locale à l'URL publique. Cette vidéo de la chaîne Sophiène IA montre comment piloter Claude Code pour construire et livrer une application de bout en bout, une méthode directement transposable au déploiement décrit ici :

Conclusion : votre application en ligne aujourd'hui

Le déploiement n'est plus le mur qu'il était. En pilotant Claude Code étape par étape — vérifier le build, versionner avec Git, choisir Vercel ou Netlify, gérer les variables d'environnement, brancher un domaine et déboguer les erreurs — vous passez de localhost à une URL publique en une seule session, avec HTTPS automatique et déploiement continu à chaque push.

Le vrai changement de posture : vous ne cliquez plus à l'aveugle dans des tableaux de bord intimidants, vous décrivez, relisez et validez. La plomberie de mise en ligne — configuration, secrets, DNS, certificats — devient une conversation. Ouvrez votre projet, lancez Claude Code, et donnez-lui son premier objectif : « mets cette application en ligne ». Votre première URL publique est à quelques prompts.

FAQ : déployer une application avec Claude Code {#faq}