Les trois approches pour démarrer

Il n'y a pas une seule façon de commencer un projet avec Claude Code. Selon l'état d'avancement de ton idée, les outils que tu maîtrises, et le temps disponible pour la configuration, trois chemins s'offrent à toi.

Quand l'utiliser : tu as une idée précise, tu veux construire quelque chose de zéro sans passer par GitHub, et tu veux aller vite.

Prérequis : compte Claude Pro ou Max. Rien de plus.

Ce qui se passe concrètement

Claude Code pointe sur un dossier de ton ordinateur et crée les fichiers à l'intérieur. C'est comme avoir quelqu'un qui travaille directement dans ton Finder, en temps réel.

Étape 1 : Créer le dossier projet

Dans dev_projects, crée un nouveau dossier avec un nom clair : portfolio-2026, prototype-login, landing-client. Sans espaces, sans majuscules, sans accents.

Étape 2 : Pointer Claude Code sur ce dossier

Dans l'app Desktop : passe en mode Code, clique sur « Choose folder » et sélectionne ton dossier.

Dans VSCode : ouvre VSCode, puis File > Open Folder, sélectionne ton dossier. Ouvre le terminal intégré (Cmd+`) et lance claude.

Étape 3 : Décrire ce qu'on veut construire

Crée un fichier index.html avec une page portfolio minimaliste.
Fond blanc, typographie sombre, une section hero avec mon nom
et mon titre, une grille de 6 projets avec titre et description,
un footer avec mes liens. Utilise Tailwind CSS via CDN.

Étape 4 : Itérer et déployer

vercel          # URL de prévisualisation
vercel --prod   # URL publique définitive

Le chemin A ne passe pas par GitHub. Tes fichiers existent uniquement sur ton ordinateur (et sur Vercel si tu déploies). C'est suffisant pour la plupart des prototypes et projets solo.

Quand l'utiliser : tu veux explorer rapidement plusieurs directions visuelles avant de t'engager sur une structure de fichiers.

Prérequis : compte Claude (même gratuit pour le prototypage initial), Git, compte GitHub, VSCode.

L'idée

Claude chat peut générer du HTML directement dans un artifact : une fenêtre d'aperçu qui s'ouvre dans la conversation. Tu vois le résultat en temps réel, tu peux demander des modifications, et quand l'interface te convient, tu récupères le code source.

Les artifacts HTML sont particulièrement utiles pour explorer des layouts, tester des palettes de couleurs, ou montrer une direction à un client en quelques minutes.

Les étapes

1. Prototyper dans un artifact Claude
2. Récupérer le code HTML (clic sur l'artifact, copier le code)
3. Créer un repository GitHub
4. Ajouter le fichier HTML au repository
5. Cloner le repository dans VSCode (Cmd+Shift+P > Git: Clone)
6. Lancer claude dans le terminal et continuer l'itération
7. Synchroniser avec GitHub et déployer

git add .
git commit -m "Ajout section hero et navigation"
git push origin main
vercel --prod

Gain de temps : Claude Code peut gérer tout le processus Git à ta place. Dis-lui simplement « sauvegarde les modifications avec le message "refonte navigation" et pousse sur GitHub ».

Quand l'utiliser : tu veux une interface visuellement aboutie très rapidement, ou tu veux exploiter les forces spécifiques d'un autre outil pour la phase exploratoire.

Ce que chaque outil apporte

Lovable génère des applications React complètes. Il exporte nativement vers GitHub en un clic, ce qui en fait le plus simple à connecter à Claude Code.

Google AI Studio avec Gemini est particulièrement fort sur les interfaces data-heavy, les tableaux de bord, et les composants avec logique métier.

Bolt et v0 (Vercel) exportent aussi vers GitHub et génèrent des interfaces React avec des composants Shadcn.

Étapes pour Lovable vers Claude Code

1. Crée et développe l'interface dans Lovable.
2. Clique sur « Connect to GitHub » dans Lovable.
3. Clone l'URL GitHub dans VSCode.
4. Lance claude dans le terminal intégré.
5. Continue l'itération avec Claude Code.

Avant de commencer à modifier quoi que ce soit, donne d'abord cette instruction à Claude Code : « Lis la structure du projet, identifie le stack utilisé et les conventions existantes. Résume-les avant de faire quoi que ce soit. »

Si tu n'as jamais utilisé Git, voici les quatre notions que tu as besoin de comprendre. Pas plus.

Repository : un dossier de projet hébergé sur GitHub, avec l'historique complet de toutes ses modifications.

Clone : télécharger une copie d'un repo sur ton ordinateur, avec le lien maintenu vers GitHub.

Commit : une sauvegarde nommée. git commit -m "Refonte navigation" crée un instantané du projet à cet état. L'équivalent de dupliquer un fichier Figma avant une grosse modification.

Push : envoyer tes commits locaux vers GitHub. Sans git push, tes sauvegardes restent uniquement sur ton ordinateur.

Tu n'as pas besoin de comprendre les branches, les pull requests ou les conflits de merge pour démarrer.