Claude Code MCP : les 3 serveurs à brancher en premier
Un serveur MCP relie Claude Code à un outil externe : votre navigateur, une documentation, une base de données, Notion ou GitHub. Pour votre client, c’est un site vérifié sur mobile, tablette et ordinateur avant qu’il ne l’ouvre, et un code écrit à partir de la documentation actuelle plutôt que de la mémoire du modèle. Voici les trois serveurs MCP que j’intègre à chaque projet Claude Code, et la façon de les installer aujourd’hui.
Le MCP, c’est quoi : le pont entre Claude Code et vos outils
MCP veut dire Model Context Protocol. Anthropic l’a défini fin 2024, il a explosé en 2025, et c’est devenu le standard qui permet à un agent IA d’utiliser des outils extérieurs.
Un serveur MCP se place entre Claude Code et un outil. Branchez celui d’Airtable, et Claude Code crée des tables, lit les données, en insère. Il en existe pour GitHub, Notion, Stripe, les bases de données, et il en arrive de nouveaux chaque semaine.
Sur mes projets, j’en garde trois. Le premier tourne sur presque tous.
Playwright : Claude Code teste l’écran que votre client verra
Playwright est un outil open source de Microsoft. Son serveur MCP donne à Claude Code la main sur un navigateur : il ouvre vos pages, les affiche en format ordinateur ou téléphone, prend des captures d’écran, remplit les formulaires et vérifie qu’ils marchent.
Sans lui, je faisais une capture d’écran, je la glissais dans Claude Code et je lui expliquais ce qui n’allait pas. Avec lui, Claude Code teste seul ce qu’il vient de construire, et se corrige. Vous gagnez un temps énorme, à condition de revoir ses conclusions quand il vous rend la main.
L’installation tient en une commande, à lancer dans le terminal, hors de Claude Code :
claude mcp add playwright npx @playwright/mcp@latest
Relancez Claude Code et tapez /mcp. Playwright doit apparaître avec une coche verte. Pas de coche ? Demandez à Claude Code : « Je vois le MCP Playwright mais il n’est pas connecté. Que faire pour le débloquer ? »
Le test, en direct sur la page d’accueil générée plus tôt dans la masterclass :
Je t’ai mis à disposition le MCP Playwright. Peux-tu tester la page en mode
mobile, tablette et ordinateur, et vérifier qu’il n’y a pas de souci d’affichage ?
Claude Code a réduit la fenêtre au format téléphone, pris une capture, puis recommencé en tablette et en ordinateur. Il a rangé ses captures dans un dossier et conclu que l’affichage tenait. Je l’avais lancé sans fichier de permissions, donc il m’a demandé l’accord à chaque étape : avec les permissions réglées, il le fait sans vous.
Une alternative est arrivée depuis : Claude in Chrome, l’extension d’Anthropic pour le navigateur, se branche sur Claude Code avec claude --chrome, à condition d’avoir un abonnement Anthropic (Pro, Max, Team ou Enterprise). Elle pilote votre propre Chrome, avec vos sessions ouvertes.
Context7 : la documentation du jour, pas la mémoire du modèle
Un modèle apprend jusqu’à une date, puis il est figé. Une bibliothèque sort une nouvelle version, et Claude continue d’écrire du code pour l’ancienne, parfois avec des fonctions qui n’existent plus.
Context7 donne à Claude Code la documentation à jour d’un très grand nombre de bibliothèques et de frameworks, et les fonctions qu’il appelle existent vraiment.
Ajoutez surtout cette règle à votre CLAUDE.md, sinon Claude oublie de s’en servir :
Utilise toujours Context7 lorsque tu dois générer du code, pour consulter
la dernière documentation de la bibliothèque concernée.
L’installation a changé depuis la vidéo. Le plus simple aujourd’hui :
npx ctx7 setup --claude
La commande vous connecte, crée une clé et vous laisse choisir entre deux modes : le serveur MCP, ou une ligne de commande accompagnée d’un skill, sans MCP du tout. Context7 existe aussi en plugin officiel dans la marketplace d’Anthropic, comme Playwright.
La base de données : le serveur de votre fournisseur
Si votre application a une base de données (Supabase, Airtable ou autre), branchez son serveur MCP. Claude Code lit le schéma, écrit les requêtes, crée les tables, au lieu de deviner.
Pour le trouver, cherchez « MCP Claude Code » suivi du nom de votre base. Dans la vidéo, la page de Supabase affichait Cursor par défaut : il suffisait de choisir Claude Code pour obtenir la commande à lancer. Supabase a aussi son plugin dans la marketplace officielle :
/plugin install supabase@claude-plugins-official
Ces trois-là couvrent l’essentiel. Le reste dépend du projet : Stripe le jour où vous ajoutez le paiement, Figma si le client vous donne ses maquettes, et une bibliothèque de composants pour un tableau de bord qui ne trahit pas l’IA, comme Arc branché à Claude Code par MCP.
Où se range un serveur MCP : local, projet ou utilisateur
Une commande claude mcp add sans option range le serveur en portée locale : il ne charge que dans ce projet, et il n’est visible que par vous. Deux autres portées :
| Portée | Option | Où | Pour qui |
|---|---|---|---|
| Locale (par défaut) | aucune | ~/.claude.json, rattaché au projet | vous, dans ce projet |
| Projet | --scope project | .mcp.json à la racine du projet | toute l’équipe, par le dépôt |
| Utilisateur | --scope user | ~/.claude.json | vous, dans tous vos projets |
Sur un projet client, je mets Playwright et Context7 en portée projet. Le prochain développeur qui clone le dépôt a les mêmes outils, sans rien installer à la main. C’est ce que je fais dans la phase de setup de la méthode du vibe coding en 4 phases.
Soyez radin : chaque serveur coûte du contexte
Ma règle dans la vidéo : chaque serveur MCP grignote votre contexte, donc ne chargez que ce dont vous avez besoin, au moment où vous en avez besoin.
Elle compte moins qu’en janvier. Claude Code active aujourd’hui par défaut la recherche d’outils : au démarrage, il ne charge que les noms des outils et les instructions des serveurs, et va chercher la définition complète quand il en a besoin. Un serveur de plus ne pèse presque plus rien.
Je garde quand même la règle, pour deux raisons. Chaque appel ramène des résultats qui, eux, remplissent le contexte. Et un serveur MCP est du code qui tourne avec vos droits : trois serveurs connus valent mieux que quinze installés par curiosité. Pour installer les mêmes outils en un paquet, avec leur coût affiché avant l’installation, voyez l’article sur les plugins de Claude Code.
Cette partie fait 13 minutes de la masterclass. Les autres briques (skills, sous-agents, hooks) sont résumées dans le guide complet de Claude Code.
Ce que vous pouvez vendre avec ça
À qui : une boutique, un cabinet (avocat, kinésithérapeute, architecte) ou une petite agence qui fait refaire son site web ou un outil en ligne, et dont la plupart des visiteurs arrivent sur mobile.
Ce que vous livrez : l’outil ou le site, et sa recette. Avant la livraison, Playwright visite chaque page sur mobile, tablette et bureau, complète le formulaire de contact, puis range les captures dans un dossier que vous transmettez au client. Le fichier .mcp.json ainsi que la règle Context7 restent dans le dépôt : le prochain prestataire travaillera avec les mêmes outils.
Comment le présenter : « Avant que vous l’ouvriez, votre site a été vérifié sur mobile, tablette et ordinateur, formulaire inclus. Voici les captures. » Sur un site de 8 pages, cela fait 24 captures, produites pendant que vous préparez le rendez-vous.
