Intégration VS Code
À l'issue de cette leçon, le stagiaire distingue les trois modes d'utilisation de Claude dans VS Code (panneau, sélection de contexte, inline edit), connaît leurs raccourcis clavier, et choisit le bon mode selon le type de tâche.
Le panneau Claude dans la barre latérale
L'extension Claude Code installée en leçon 05 ajoute un panneau dédié dans la barre latérale de VS Code. Ce panneau contient la conversation avec l'agent et constitue le point d'entrée principal pour les tâches longues : créer un fichier, refactorer une section, explorer un problème.
Quand vous demandez une modification, l'agent peut ouvrir un fichier dans VS Code, le modifier (vous voyez les changements en diff dans l'éditeur), créer un nouveau fichier, ou exécuter une commande dans le terminal intégré. Vous validez ou refusez chaque modification — c'est le même contrôle qu'en mode plan, mais visualisé directement dans l'éditeur.
La sélection de contexte — l'astuce essentielle
L'astuce qui transforme l'expérience : la sélection de contexte. Vous sélectionnez du code dans l'éditeur, puis vous posez votre question dans le panneau Claude. L'agent reçoit la sélection comme contexte et répond précisément sur cette zone, sans que vous ayez à expliquer où regarder.
« Explique cette fonction »
Sélectionnez la fonction, posez la question. Claude répond avec une explication ciblée. Plus rapide que de coller le code dans le chat.
« Refacto cette section »
Sélectionnez la portion à reformer, demandez le refacto. Claude propose une version réécrite que vous validez en diff.
« Trouve le bug ici »
Sélectionnez la fonction qui plante, demandez l'analyse. Claude examine le code sélectionné en priorité avant d'explorer l'arborescence.
« Documente cette classe »
Sélectionnez la classe, demandez les commentaires JSDoc. Claude génère la documentation au format de votre projet.
La sélection de contexte évite trois opérations habituellement nécessaires : localiser le code dans le projet, le copier, le coller dans le prompt. Sur une journée de travail, c'est plusieurs dizaines de manipulations économisées.
Trois raccourcis clavier à mémoriser
Cmd / Ctrl + L · Ouvrir le panneau
Ouvre le panneau Claude et place le curseur dans le champ de saisie, prêt à taper. C'est le réflexe à acquérir en premier.
Cmd / Ctrl + Shift + L · Nouvelle conversation
Démarre une nouvelle conversation Claude, en gardant l'historique précédent accessible. Pratique pour basculer entre plusieurs sujets sans mélanger les contextes.
Cmd / Ctrl + I · Inline edit
Modifie directement la sélection courante via Claude, sans passer par le panneau de conversation. Utile pour reformuler un commentaire, renommer une variable, simplifier une condition.
Personnalisation possible
Ces raccourcis sont configurables dans les keybindings de VS Code (Cmd/Ctrl + K, Cmd/Ctrl + S) si les valeurs par défaut entrent en conflit avec d'autres extensions.
Trois modes, trois usages
Au-delà des raccourcis, l'enjeu est de choisir le bon mode selon la tâche. Une heure d'observation suffit à acquérir le réflexe.
Panneau de conversation
Pour les tâches longues ou exploratoires : création de fichier complet, refonte multi-fichiers, dialogue itératif. Le panneau garde l'historique, vous pouvez revenir en arrière.
Sélection de contexte + panneau
Pour les tâches ciblées sur une zone précise : explication d'une fonction, refacto d'une section, audit d'un fichier. La sélection focalise Claude.
Inline edit
Pour les micro-modifications : renommer, reformuler, simplifier une ligne. Pas de pollution du panneau. La modification s'applique en place.
Tester les trois modes sur votre projet
Sur votre projet de référence (défini en L02), faites les trois actions correspondant aux trois modes. (1) Une création de fichier via le panneau de conversation (par exemple un README initial). (2) Une explication de code via la sélection de contexte sur un fichier existant. (3) Une reformulation de commentaire via l'inline edit. Notez quel mode vous semble le plus naturel pour chaque type de tâche.
Cet exercice est à conserver dans votre dossier de stagiaire. Il n'est pas évalué mais il est tracé.
- docs.claude.com — Claude Code IDE Integrations documentation officielle de l'intégration VS Code
- marketplace.visualstudio.com — Claude Code page officielle de l'extension VS Code par Anthropic
Vous distinguez les trois modes d'utilisation de Claude dans VS Code et savez choisir le bon selon la tâche ?