Compte Rendu : Masterclass sur Claude Code

Les Points Clés (TL;DR)

• Claude Code est un agent IA qui s’exécute dans votre terminal. Il ne se contente pas de parler, il agit sur vos fichiers.
• La qualité de son travail dépend du contexte. Utilisez /init et maintenez le fichier .claude.md à jour.
• Pour un usage quotidien, le mode Auto-Accept Edit est le meilleur compromis entre vitesse et sécurité.
• Pour les tâches complexes, utilisez le Plan Mode pour valider sa stratégie avant qu’il n’écrive la moindre ligne de code.
• L’abonnement est bien plus économique que le paiement à l’usage via l’API pour un développeur.

1. Le Concept Clé : Qu’est-ce que Claude Code ?

Claude Code n’est pas un simple chatbot comme ChatGPT. C’est un agent IA qui s’exécute dans votre terminal. Sa force réside dans sa capacité à comprendre une tâche et à utiliser des outils (comme des commandes Bash, l’édition de fichiers, etc.) pour la réaliser concrètement sur votre machine.

Le triangle de fonctionnement :

• Vous (l’utilisateur) : Vous donnez une instruction en langage naturel.
• Claude Code (le logiciel/agent) : C’est l’intermédiaire intelligent. Il analyse votre demande, la reformule avec un contexte et des instructions précises, et choisit les bons outils.
• Claude (l’API LLM d’Anthropic) : Le « cerveau ». Il reçoit les instructions de l’agent et génère les commandes ou le code nécessaires, qu’il renvoie à l’agent pour exécution.

Cette architecture lui permet d’agir directement sur votre base de code, là où un chatbot se contente de donner des instructions.

2. Installation et Tarifs

L’installation se fait via une simple commande npm. La vidéo insiste sur un point crucial : pour un usage régulier, il est bien plus rentable de prendre un abonnement que de payer à l’usage via l’API.

Installation

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

Le modèle économique

• Abonnement (Recommandé) : Vous payez un montant fixe (ex: 20$/mois pour le Pro) et bénéficiez d’un très grand nombre de requêtes dans des « blocs » de 5 heures. C’est idéal pour les développeurs qui l’utilisent intensivement.
• Paiement à l’usage (API) : Vous payez pour chaque token. Cela devient très vite cher si vous effectuez des tâches complexes ou longues.

3. Le Contexte : La Clé de la Pertinence

La qualité des réponses de Claude Code dépend entièrement du contexte que vous lui fournissez. Le but est de lui donner juste assez d’informations pour qu’il comprenne votre projet, sans le noyer sous des détails inutiles.

• La commande /init : Scanne votre projet et génère un fichier .claude.md. Ce fichier sert de « mémoire » centrale pour le projet (description, commandes importantes, fichiers critiques).
• Le fichier .claude.md : C’est le fichier le plus important. Il doit être maintenu à jour pour que l’IA reste pertinente.
• Ajout de contexte à la volée : Vous pouvez mentionner des fichiers avec @mon_fichier.ts ou coller du code directement pour lui donner un contexte spécifique à une tâche.
• Niveaux de contexte : Il existe un contexte de projet (partagé), un contexte local (ignoré par Git) et un contexte utilisateur (global à votre machine).

4. Les Outils et les Modes d’Opération

La magie de Claude Code vient de sa panoplie d’outils et de ses différents modes qui s’adaptent à vos besoins.

Les Outils par Défaut (Tools)

Claude Code dispose nativement d’outils pour :

• Exécuter des commandes bash.
• Lire (read), écrire (write) et éditer (edit) des fichiers.
• Lister des fichiers (ls) et rechercher du contenu (grep).
• Et bien plus encore…

Les Modes d’Opération

Changez de mode avec Shift + Tab.

• Default Mode : Demande une permission pour chaque action critique. Sûr mais parfois lent.
• Plan Mode : Avant d’agir, l’IA propose un plan détaillé. Idéal pour les tâches complexes afin de valider sa logique avant qu’il ne commence.
• Auto-Accept Edit : Valide automatiquement les modifications de fichiers, mais demande encore la permission pour les commandes potentiellement dangereuses. C’est le bon compromis.
• YOLO Mode (--dangerous-bypass-permissions) : Ne demande JAMAIS de permission. L’agent a les pleins pouvoirs. Puissant mais à utiliser avec prudence.

5. Personnalisation Avancée : MCP & Hooks

Pour aller plus loin, Claude Code offre des possibilités de personnalisation très puissantes.

• Commandes Personnalisées (MCP – Meta-Claude Prompts) : Vous pouvez créer vos propres commandes (ex: /new_component) en écrivant des prompts dans des fichiers .md. Cela permet d’encapsuler des workflows complexes et répétitifs.
• Hooks (Crochets) : Ce sont des scripts qui s’exécutent avant (pre-tool-use) ou après (post-tool-use) l’utilisation d’un outil. C’est parfait pour la sécurité (ex: interdire les commandes sudo ou rm -rf) ou pour l’automatisation (ex: lancer ESLint après chaque modification de fichier).

6. Commandes et Astuces Utiles

• /clear : Efface la conversation actuelle pour repartir sur une nouvelle tâche sans que le contexte précédent n’interfère.
• /resume : Permet de recharger une conversation précédente.
• /compact : Demande à l’IA de résumer la conversation actuelle pour réduire la taille du contexte.
• ! ma_commande : Exécute une commande shell directement, et son résultat est ajouté au contexte de la conversation. Très utile pour analyser des erreurs.
• # : Ajoute une instruction à la mémoire de la conversation (project, local ou user).
• Think, Think more… : Mots-clés à insérer dans votre prompt pour forcer l’IA à réfléchir plus en profondeur sur des problèmes complexes.

7. Exemple de Workflow Pratique : Ajouter une feature

Imaginons que nous voulions ajouter un hook personnalisé useIsMobile à notre projet et le rendre disponible.

• Définir l’objectif : On commence par une requête claire. « Je veux créer un nouveau hook React nommé `useIsMobile.ts` dans `src/hooks`. Il doit détecter si l’utilisateur est sur un appareil mobile. Ensuite, ajoute ce nouveau hook au fichier `src/index.ts` pour l’exporter. »
• Fournir le code initial (si nécessaire) : On crée le fichier useIsMobile.ts et on le laisse vide, puis on le mentionne avec @src/hooks/useIsMobile.ts pour que Claude sache où travailler.
• Choisir le bon mode : On passe en Plan Mode car il y a plusieurs étapes (créer, exporter, peut-être même ajouter un test). On veut valider sa logique.
• Lancer la requête et examiner le plan : Claude devrait proposer un plan comme : 1. Lire le contenu de navigator.userAgent. 2. Écrire la logique du hook dans @src/hooks/useIsMobile.ts. 3. Ouvrir @src/index.ts. 4. Ajouter la ligne d’exportation. 5. Sauvegarder les deux fichiers.
• Valider et exécuter : Le plan semble bon. On tape « yes » et on le laisse travailler. Il va éditer les fichiers lui-même.
• Vérification finale : Une fois terminé, on peut lui demander : ! pnpm run lint pour vérifier que le nouveau code respecte les règles de style du projet.

8. Meilleures Pratiques & Astuces de Pro

• Une tâche = une conversation : Utilisez /clear généreusement. Mélanger plusieurs tâches dans une même conversation embrouille l’IA et dilue le contexte.
• Le fichier .claude.md est un investissement : Plus il est précis et bien entretenu, moins vous aurez à répéter les choses. Décrivez-y l’architecture, les librairies clés et les commandes de build.
• Soyez un guide, pas seulement un donneur d’ordre : Si son plan ou son code est incorrect, corrigez-le. « Non, n’utilise pas cette librairie, utilise plutôt celle-ci car… » Il apprendra de vos corrections pour le reste de la session.
• Décomposez les problèmes : Pour une tâche très large, utilisez le `Plan Mode` pour la décomposer en sous-tâches, puis traitez chaque sous-tâche dans une conversation claire.
• Créez des MCP pour vos workflows : Si vous ajoutez souvent des composants, créez une commande /new-component [name] qui automatise la création des fichiers (TSX, CSS, Storybook, test) selon les conventions de votre équipe.
• Utilisez les Hooks pour la sécurité : Mettez en place un hook de sécurité qui vous alerte si l’IA essaie d’utiliser une commande potentiellement destructrice, même en mode YOLO.