Chapitre 10.1 — MCP : connecter le monde extérieur
⏱️ TL;DR — MCP (Model Context Protocol) est un standard ouvert qui expose à Claude Code des outils et des données externes : ta base Postgres, GitHub, un navigateur, un service tiers. Tu y accèdes via des outils préfixés
mcp__…. Les incontournables pour un dev web : GitHub (issues/PR), Context7 (docs de libs à jour → moins d’API hallucinées), Playwright (piloter un navigateur → vérification visuelle de l’UI). Un serveur MCP a des droits : traite-le comme une dépendance de confiance.
🎯 Objectifs
- Comprendre ce qu’est MCP et ce qu’il apporte.
- Connaître les serveurs MCP les plus utiles pour le web.
- Configurer un serveur MCP proprement.
- Garder la sécurité en tête (droits, données).
Le problème que MCP résout
Claude Code sait lire ton code et lancer des commandes (1.1), mais il ne « voit » pas nativement ce qui est hors du repo : le schéma de ta base, l’état de tes PR GitHub, le rendu d’une page dans un navigateur, la doc à jour d’une lib. MCP est le pont : un serveur MCP expose ces capacités sous forme d’outils que l’agent peut appeler, exactement comme ses outils natifs.
Les serveurs MCP incontournables (web)
D’après l’usage de la communauté (les noms sont stables ; l’ordre est indicatif) :
| Serveur | Ce qu’il apporte | Pourquoi c’est utile |
|---|---|---|
| GitHub | issues, PR, repos | l’agent lit/agit sur tes tickets et PR sans quitter la session |
| Context7 | docs de libs à jour, à la demande | réduit les signatures d’API hallucinées (l’agent lit la vraie doc de la version) |
| Playwright | pilote un vrai navigateur | vérification visuelle de l’UI (4.3/5.4), tests e2e |
| Filesystem | accès fichiers | souvent redondant pour Claude Code, qui a déjà des outils fichiers natifs |
| Base de données (Postgres…) | lit le schéma, exécute des requêtes | l’agent vérifie le schéma réel plutôt que de le supposer |
Les deux plus transformateurs pour un dev web : Context7 (fini les appels à une API qui n’existe pas dans ta version) et Playwright (l’agent voit enfin le rendu — la promesse d’anti-dérive de la Partie 4).
💡 Réflexe d’architecte — N’ajoute un serveur MCP que pour combler un manque réel de l’agent. Filesystem ? Il a déjà des outils fichiers. Mais « voir le rendu » (Playwright) ou « lire la doc exacte d’une lib » (Context7), ça, il ne l’a pas nativement — là, MCP apporte une vraie capacité. Un MCP qui double une capacité native n’ajoute que du bruit.
Configurer un serveur MCP
Un serveur MCP se déclare dans la config MCP de Claude Code (via la commande claude mcp ou un fichier de config). Beaucoup de serveurs se lancent comme un process local (souvent via npx) ; d’autres sont distants. La forme générale associe un nom, une commande de lancement et d’éventuels paramètres (clé d’API, URL). Une fois connecté, ses outils apparaissent en mcp__<serveur>__<outil> et l’agent peut les appeler.
📚 Aller plus loin — Beaucoup d’intégrations courantes (GitHub, Linear, Notion, Figma, Sentry…) sont désormais disponibles comme plugins de la marketplace officielle (10.3) : installer le plugin configure le serveur MCP pour toi, sans montage manuel. Pour un serveur MCP « maison » ou de niche, tu passes par la config MCP directe. Les commandes exactes (
claude mcp add …) sont dans la doc — vérifie la syntaxe courante.
La sécurité : un MCP a des droits
⚠️ Piège — Brancher un serveur MCP puissant (accès base de données en écriture, accès à un service tiers avec un token large) sans réfléchir à ce qu’il peut faire. Un serveur MCP étend la surface d’action de l’agent au monde extérieur : une requête destructrice sur ta vraie base, une action sur un vrai service. Règles de prudence :
- Moindre privilège : donne au serveur MCP le droit minimal (lecture seule sur la base quand tu n’as besoin que de lire le schéma).
- Environnements de test d’abord : branche l’agent sur une base de dev, pas la prod.
- Tokens à portée limitée : un token GitHub scoping les repos concernés, pas un token admin.
- Confiance de la source : un serveur MCP tiers exécute du code chez toi — vérifie sa provenance, comme une dépendance.
MCP est puissant *parce qu’*il connecte au réel ; c’est aussi pour ça qu’il demande de la prudence. Les garde-fous (P5/P7) s’appliquent : permissions sur les outils mcp__…, deny sur le destructeur.
🧭 Sur TaskFlow — En 10.5, on branchera deux MCP à faible risque et fort levier : GitHub (avec un token scopé au repo TaskFlow) pour gérer issues/PR, et Playwright pour que l’agent voie enfin les écrans de TaskFlow et vérifie visuellement le CRUD (fermant l’angle mort de la Partie 4). On restera sur une base de dev, jamais la prod.
✏️ Exercices
Exercice 1 — Manque réel ou redondance ? Liste 4 capacités externes qui te seraient utiles (voir le rendu, lire une doc à jour, gérer tes PR, lire ton schéma DB). Pour chacune : l’agent l’a-t-il déjà nativement, ou faut-il un MCP ?
✅ Solution
Voir le rendu → Playwright (manque natif). Doc à jour d’une lib → Context7 (manque natif). Gérer les PR → GitHub (manque natif). Lire des fichiers → natif (pas besoin de Filesystem MCP). Le critère : le MCP comble-t-il un vrai manque, ou double-t-il une capacité existante ?
Exercice 2 — Moindre privilège. Pour un MCP que tu voudrais brancher (GitHub, base de données), écris la config de droits minimale (token scopé, lecture seule, base de dev). Qu’est-ce que tu refuses de lui donner ?
✅ Solution
Bon réflexe : token GitHub limité aux repos concernés (pas admin), accès base en lecture seule sur une base de dev (jamais la prod avec écriture). Tu refuses tout droit qui rendrait une erreur de l’agent destructrice et irréversible. MCP + moindre privilège = puissance sans catastrophe.
🧠 Quiz de révision
1. Qu’est-ce que MCP et à quoi ça sert ?
Un standard ouvert qui expose à Claude Code des outils/données externes (base, GitHub, navigateur, docs) sous forme d’outils mcp__…. C’est le pont entre l’agent et le monde hors du repo.
2. Cite deux MCP particulièrement utiles pour un dev web, et pourquoi.
Context7 (docs de libs à jour → moins d’API hallucinées) et Playwright (piloter un navigateur → vérification visuelle de l’UI). Aussi GitHub (issues/PR).
3. Pourquoi le Filesystem MCP est-il souvent inutile pour Claude Code ?
Parce que Claude Code a déjà des outils fichiers natifs : le MCP filesystem double une capacité existante, ajoutant du bruit sans valeur. On n’ajoute un MCP que pour un manque réel.
4. Quels risques de sécurité avec un MCP ?
Il étend l’action de l’agent au monde réel (base, services). Risques : requête destructrice sur la prod, action via un token trop large, code tiers exécuté chez toi. Parades : moindre privilège, environnements de dev, tokens scopés, source de confiance.
5. Souvent, comment installe-t-on un MCP d’intégration courante ?
Via un plugin de la marketplace officielle (10.3) qui configure le serveur MCP pour toi (GitHub, Linear, Notion…). Pour un MCP maison/niche, on passe par la config MCP directe.
Chapitre suivant : Commandes slash sur-mesure — encapsuler tes prompts récurrents.