Tutoriel Claude Code pas à pas : de l'installation à la mise en ligne

Ce qu'il vous faut avant de commencer

Ce tutoriel vous accompagne de l'installation de Claude Code jusqu'à une première page visible sur Internet. Le fil rouge est volontairement simple : la page d'accueil de « Fleurs de Marthe », une fleuriste fictive à Angers. Remplacez ses informations par les vôtres au fur et à mesure.

Préparez :

• un ordinateur sous Windows ou macOS ;
• un abonnement Claude payant, Pro ou Max : au 12 octobre 2026, Claude Code n'est pas inclus dans l'offre gratuite ;
• un dossier vide, réservé à ce projet, par exemple dans vos Documents ;
• pour la dernière étape seulement, un hébergeur et un nom de domaine. Vous pouvez les choisir plus tard.

Tout au long du tutoriel, vous écrirez des « prompts », c'est-à-dire les demandes que vous adressez à Claude. Chaque demande ci-dessous est prête à copier-coller.

Étape 1 : installer Claude Code

Deux portes d'entrée mènent au même outil.

L'application Claude pour ordinateur est la voie la plus douce. Téléchargez-la depuis la page officielle de téléchargement de claude.com, connectez-vous avec votre compte, puis ouvrez l'espace « Code ». Aucun terminal à ouvrir.

Le terminal demande une commande d'installation, à taper une seule fois. Sur Windows, dans PowerShell :

irm https://claude.ai/install.ps1 | iex

Sur macOS :

curl -fsSL https://claude.ai/install.sh | bash

Chaque geste est détaillé dans nos guides Installer Claude Code sur Windows et Installer Claude Code sur Mac. Si quelque chose bloque après l'installation, lancez Claude Code puis tapez /doctor : cette commande diagnostique l'installation. La commande /login vous connecte à votre compte si ce n'est pas encore fait.

Étape 2 : ouvrir le dossier du projet

Dans l'application, choisissez votre dossier vide dans l'espace « Code ». Dans le terminal, ouvrez le terminal directement dans ce dossier (les guides d'installation montrent comment), puis tapez :

claude

Claude Code démarre et attend votre première demande. Commencez par une vérification toute simple :

Bonjour. Dis-moi dans quel dossier tu travailles et ce qu'il contient. Réponds en français, en deux ou trois phrases.

Si la réponse cite bien votre dossier vide, tout est en place.

Étape 3 : écrire les consignes permanentes

Avant de construire quoi que ce soit, donnez à Claude Code les règles du projet. Elles se rangent dans un fichier nommé CLAUDE.md, à la racine du dossier, que Claude relit à chaque session. La commande /init en propose un, mais sur un dossier vide il est plus efficace de le demander en français :

Crée un fichier CLAUDE.md à la racine de ce dossier. Il contiendra les consignes permanentes du projet : la page d'accueil de « Fleurs de Marthe », fleuriste à Angers. Le site est en français, en HTML et CSS simples, sans outil à installer, et doit être parfaitement lisible sur téléphone. Règles : vouvoiement dans les textes, aucun chiffre ni avis client inventé (si une information manque, écris [À COMPLÉTER]), tu me demandes avant de supprimer un fichier, et tu m'expliques en français simple ce que tu fais. Montre-moi le contenu avant de l'enregistrer.

Relisez, corrigez si besoin, puis acceptez. Le guide CLAUDE.md : le fichier de consignes expliqué propose un modèle complet pour un commerçant.

Étape 4 : demander un plan avant la moindre modification

Passez en mode plan : appuyez sur Maj+Tab jusqu'à voir le mode plan s'afficher, ou tapez /plan. Dans ce mode, Claude étudie et propose sans rien modifier. Puis envoyez :

Je veux une page d'accueil unique pour Fleurs de Marthe. Contenu : un titre et une phrase d'accroche, les trois prestations (bouquets du jour, mariages, abonnements floraux pour les entreprises), les horaires (du mardi au samedi, de 9 h à 19 h), l'adresse dans une section « Nous trouver », un bouton pour appeler la boutique (numéro [À COMPLÉTER]) et un pied de page avec un lien vers les mentions légales. Style sobre, vert sauge et blanc cassé, typographie très lisible. Propose-moi d'abord un plan : les fichiers que tu vas créer, la structure de la page, et ce que tu attends de moi (photos, textes). N'écris rien avant ma validation.

Lisez le plan comme un devis. S'il manque quelque chose, dites-le simplement : « Ajoute une phrase sur la livraison à domicile dans Angers. » Quand le plan vous convient, validez-le. Le guide Le mode plan de Claude Code montre comment relire un plan point par point.

Étape 5 : laisser Claude créer la page

Une fois le plan validé, Claude passe à l'exécution. Il vous demande l'autorisation avant de créer ou de modifier un fichier ; vous pouvez l'accorder pour toute la session si vous suivez bien ce qu'il fait. Le raccourci Maj+Tab fait aussi défiler les modes d'autorisation : le mode Manuel demande avant chaque modification, le mode acceptEdits accepte les modifications de fichiers sans vous interroger à chaque fois.

Si Claude part dans une mauvaise direction, appuyez sur Échap : il s'arrête, et le travail déjà fait est conservé. Expliquez-lui alors ce qui ne va pas.

Étape 6 : voir la page sur votre ordinateur

Demandez-lui de vous montrer le résultat :

Comment puis-je voir cette page dans mon navigateur, sur mon ordinateur ? Si un petit serveur local est nécessaire, lance-le et donne-moi l'adresse à ouvrir. Sinon, dis-moi simplement quel fichier ouvrir et comment.

Regardez la page, puis réduisez la fenêtre du navigateur pour simuler un téléphone. Notez vos remarques et envoyez-les en une seule fois :

Voici mes corrections : 1. Le titre est trop grand sur téléphone, réduis-le. 2. Mets les horaires avant l'adresse. 3. Le bouton d'appel doit être visible sans faire défiler la page sur mobile. 4. Remplace « abonnements floraux » par « fleurs pour les bureaux ». Après les corrections, vérifie l'affichage sur un écran de téléphone et sur un écran d'ordinateur, puis résume ce que tu as changé.

Si une correction abîme ce qui fonctionnait, tapez /rewind (ou son alias /undo) : la commande revient à un point antérieur de la conversation, du code, ou des deux. Appuyer deux fois sur Échap, la zone de saisie vide, ouvre le même menu de retour en arrière.

Étape 7 : mettre la page en ligne

Pour être visible sur Internet, la page doit être déposée chez un hébergeur, relié à votre nom de domaine. Ce choix se fait une fois pour toutes. Ensuite, demandez à Claude de préparer l'envoi :

La page est validée. J'ai un hébergement mutualisé chez un hébergeur français et un nom de domaine déjà relié à cet hébergement. Donne-moi la liste exacte des fichiers et dossiers à envoyer, explique comment savoir dans quel dossier du serveur les placer, puis la liste des vérifications à faire une fois en ligne : affichage, cadenas HTTPS, liens, téléphone. Ne me demande aucun mot de passe : je ferai l'envoi moi-même depuis l'espace client de mon hébergeur, en suivant tes étapes.

Déposez les fichiers, ouvrez votre nom de domaine dans le navigateur, et faites les vérifications listées. N'oubliez pas les mentions légales : elles sont obligatoires, et un professionnel reste utile pour les cas particuliers.

Les bons réflexes pour la suite

• Tapez /clear avant de passer à un sujet sans rapport : Claude repart d'une conversation vide.
• Tapez /compact quand la conversation devient longue : elle est résumée pour libérer de la place. /context montre où en est cette mémoire de travail.
• Dans le terminal, claude --continue reprend la dernière conversation du dossier ; /resume permet d'en choisir une autre.
• /usage affiche le coût de la session et les limites de votre offre.
• Ajoutez au fichier CLAUDE.md chaque règle que vous avez dû répéter deux fois.

La même méthode vaut pour un site de plusieurs pages ou une petite boutique : consignes, plan, exécution, vérification, mise en ligne. C'est celle que l'auteur applique pour tous les sites présentés sur la page nos réalisations.

Pour aller plus loin : le parcours Claude Code sans coder.