Claude Code pour débuter : installation, premier projet, déploiement

Tu as installé un agent IA dans ton terminal et tu attends qu'il fasse quelque chose d'utile. Bonne nouvelle : Claude Code peut écrire, lire et exécuter du code dans tes propres dossiers, et tu peux avoir un projet en ligne avant la fin de l'après-midi. Cet article est une marche, pas un tour d'horizon. Si tu veux d'abord situer Claude Code dans l'écosystème Anthropic, jette un œil au guide complet pour apprendre Claude qui couvre la mère du sujet.

On va installer l'outil, écrire un fichier de contexte, construire une page météo qui appelle une vraie API, et la déployer sur une URL publique. Compte deux à trois heures avec les bugs. Vingt minutes vont passer sur l'installation, c'est normal, prépare-toi à ça.

Ce que Claude Code fait vraiment (et ce qu'il ne fait pas)

Claude Code est un agent en ligne de commande. Tu le lances dans un dossier, il voit les fichiers de ce dossier, et il peut les lire, en créer, les modifier, lancer des commandes shell. Ce n'est pas claude.ai (le chat dans ton navigateur) et ce n'est pas l'API REST (que tu appelles depuis ton propre code). C'est un agent autonome qui tape dans ton terminal à ta place.

Ce qu'il faut savoir avant : ouvrir un terminal, faire un cd dans un dossier, lire un message d'erreur sans paniquer. Ce qu'il n'est pas nécessaire de savoir : coder. Tu n'écris pas de JavaScript ni de Python toi-même, tu lis ce que Claude propose et tu valides ou tu corriges la direction. Le compte requis est un compte Anthropic avec abonnement Claude Pro ou Max, ou des crédits API. Pour démarrer, l'offre Pro (à partir d'environ 20 € par mois) suffit largement.

Prérequis et installation sur Mac, Windows, Linux

Trois choses : Node.js version 18 ou plus, un terminal qui marche, et ton compte Anthropic prêt. Pour Node, vérifie avec node --version. Si tu n'as rien, télécharge depuis nodejs.org en LTS. Sur Mac, le Terminal natif fait l'affaire. Sur Windows, PowerShell marche, mais WSL (Ubuntu sur Windows) t'évitera 80% des galères de chemins.

L'installation tient en une commande :

npm install -g @anthropic-ai/claude-code

Si tu es sur Mac et que tu vois une erreur EACCES liée aux droits, ne fais pas sudo. Reconfigure plutôt le préfixe npm dans ton dossier utilisateur, c'est plus propre à long terme. Sur Windows en PowerShell, si la commande claude n'est pas reconnue après installation, ferme et rouvre le terminal pour que le PATH se rafraîchisse. Vérifie ensuite :

claude --version

Première authentification : tu lances claude, il ouvre une fenêtre navigateur pour te connecter à ton compte Anthropic, tu valides, tu reviens au terminal. C'est fait une fois. Si tu hésites entre Pro et Max, on a détaillé la décision dans le guide pour configurer Claude et choisir son abonnement.

Configurer ton premier dossier de projet

Ne lance jamais Claude Code dans ton dossier home. Il verrait Documents, Downloads, ton dossier iCloud, et brûlerait du contexte sur des fichiers qui n'ont rien à voir. Crée un dossier dédié :

mkdir meteo-lyon
cd meteo-lyon
claude

Dans ce dossier, crée un fichier CLAUDE.md. C'est le contexte permanent que l'agent lit à chaque session. Tu y mets ce que Claude doit savoir avant même que tu poses une question. Voici un exemple court pour un projet débutant :

# Projet météo Lyon

Objectif : page HTML statique qui affiche la météo actuelle de Lyon.
Stack : HTML, CSS, JavaScript vanilla. Pas de framework.
API : open-meteo.com, pas de clé requise.

Conventions :
- un seul fichier index.html, tout inline
- pas de dépendances npm
- noms de variables en français

À ne jamais faire :
- ajouter React, Vue ou Tailwind
- créer plus de 3 fichiers
- modifier ce CLAUDE.md sans demander

Dix lignes, et la qualité des réponses change dès la première interaction. Claude relit ce fichier au début de chaque session, il évite les refactos sauvages et les suggestions de bibliothèques inutiles.

Premier projet : une page web qui affiche la météo de ta ville

Pourquoi la météo plutôt qu'un hello world : ça touche au front, ça appelle une API externe sans clé, et le résultat se déploie. Tu apprends trois choses utiles d'un coup.

Dans la session Claude, tape exactement ce prompt :

Crée une page HTML qui affiche la météo actuelle de Lyon en utilisant l'API open-meteo, sans clé requise, avec un style minimal. Affiche la température, le ressenti, et le code météo en clair. Mets tout dans un seul fichier index.html.

Claude va proposer la création d'un index.html, te montrer le contenu, et te demander confirmation. Lis le diff, ne valide pas en aveugle. Une fois écrit, teste-le. Le plus simple, sans rien installer :

python3 -m http.server 8000

Ouvre http://localhost:8000 dans ton navigateur. Si la page reste blanche, ouvre la console développeur (F12) et lis l'erreur. Ne dis pas "ça marche pas" à Claude. Copie l'erreur exacte. Le passage par cette page concrète est le même esprit que celui détaillé dans le guide pour créer un site web avec Claude du brief au déploiement, mais en plus court.

Itérer sans casser : la boucle prompt, test, correction

C'est là que se joue la vraie compétence. Trois réflexes à acquérir.

Décris le bug observé, pas le bug supposé. Mauvais prompt : "le bouton ne marche pas". Bon prompt : "quand je clique sur le bouton Rafraîchir, la console affiche TypeError: Cannot read properties of undefined (reading 'temperature'), corrige uniquement ce point sans toucher au CSS".

Demande à Claude d'expliquer avant de corriger. Tape "explique-moi d'abord pourquoi cette erreur arrive, puis propose la correction". Tu apprends, et tu repères quand l'agent part dans le décor.

Refuse les refactos non demandés. Claude a tendance à "améliorer" ce qui marche déjà. Si tu lui demandes de corriger une faute de frappe et qu'il propose de réorganiser tes fonctions, dis non. Garde tes changements minimes et traçables.

Déployer ton projet sur Vercel en 5 minutes

Vercel est gratuit pour les projets perso, déploie en quelques secondes, et te donne une URL publique en .vercel.app. Pour ton premier projet, le plus rapide passe par le navigateur.

Va sur vercel.com, crée un compte (GitHub, GitLab ou email), puis sur la page d'accueil du dashboard, glisse-dépose ton dossier meteo-lyon dans la zone d'import. Vercel détecte que c'est un site statique, te propose un nom, et déploie. Trente secondes plus tard, tu as une URL à partager.

Si tu veux passer par git et la CLI (plus propre pour la suite), demande à Claude :

Initialise un repo git dans ce dossier, fais un premier commit, et explique-moi comment connecter ce repo à Vercel via la CLI.

Claude va guider l'installation de vercel, te faire taper vercel dans le dossier, et chaque git push redéploiera. Le plan gratuit Hobby couvre 100 Go de bande passante par mois, largement de quoi partager ton projet à 50 personnes. Pour aller plus loin sur les stacks modernes, regarde la fiche déployer avec Vercel et Next.js.

Les 5 erreurs des premières sessions Claude Code

1. Lancer Claude dans ton dossier home. Il scanne, indexe, et tu paies pour qu'il regarde tes fichiers iCloud. Crée toujours un dossier projet.
2. Valider les diffs sans les lire. Tu rates les changements que tu n'as pas demandés et tu te retrouves avec du code que tu ne comprends pas.
3. Accepter chaque suggestion de bibliothèque. Tu démarres avec un projet de 30 lignes et tu finis avec node_modules à 200 Mo. Demande des solutions sans dépendance par défaut.
4. Oublier git init avant de laisser Claude modifier en masse. Sans versioning, tu ne peux pas revenir en arrière. Un git commit avant chaque grosse modification, c'est ta ceinture de sécurité.
5. Brûler le crédit dans une conversation interminable. Plus le contexte est long, plus c'est cher et lent. Quand tu changes de tâche, redémarre une session propre. Le CLAUDE.md garde la mémoire qui compte.

Ces erreurs reviennent dans la majorité des premières sessions. Les éviter ne demande pas de l'expérience, juste d'y avoir pensé une fois.

Et maintenant : trois pistes pour progresser

Tu as une URL publique avec ton nom dessus. Trois directions selon ce que tu veux faire ensuite.

Approfondir le même projet. Ajoute un champ texte pour chercher une autre ville, gère le cas où l'API ne répond pas, mets une icône selon le code météo. Tu réutilises tout ce que tu viens d'apprendre, tu consolides la boucle prompt-test-correction.

Passer à une stack moderne. Refais le même projet en Next.js déployé sur Vercel. Tu touches au routing, aux Server Components, à TypeScript. Claude Code gère bien Next, c'est même là qu'il brille le plus. La démarche est détaillée dans le pilier créer une application avec Claude Code sans être développeur, qui couvre l'application web complète. Tu peux aussi consulter la fiche outil Claude Code pour les flags avancés.

Construire un vrai produit. Si ton ambition est de sortir quelque chose que des utilisateurs paient, refaire des démos ne suffira pas. Le saut entre "je fais marcher une page météo" et "je livre un SaaS" se fait avec une méthode et un cadre. C'est exactement le format de Construire votre produit IA en 5 semaines : tu arrives avec une idée, tu repars avec un produit en ligne, des premiers utilisateurs, et la stack pour itérer en autonomie.