03 - Les MCP servers : connecter Claude au monde extérieur
Ce que tu vas apprendre
- Ce qu'est MCP (Model Context Protocol) et comment ca fonctionne
- Configurer le fichier .mcp.json
- Installer Playwright MCP pour donner la vision a Claude
- Connecter GitHub, le filesystem et une base de donnees
Prerequisites
Le problème que MCP resout
Par défaut, Claude Code sait lire tes fichiers et lancer des commandes dans le terminal. C'est deja beaucoup. Mais il ne peut pas ouvrir un navigateur pour voir a quoi ressemble ta page. Il ne peut pas exécuter une requête SQL directement sur ta base de donnees. Il ne peut pas créer une issue GitHub sans passer par la CLI.
MCP (Model Context Protocol) est un protocole standard créé par Anthropic pour connecter les modèles IA a des outils externes. Tu installes un "MCP server" qui expose des capacités (naviguer sur une page web, lire une table SQL, créer un fichier), et Claude peut les utiliser comme ses outils natifs.
C'est un protocole ouvert. N'importe qui peut créer un MCP server. Il en existe deja des dizaines : Playwright, GitHub, PostgreSQL, Slack, filesystem, Redis, et bien d'autres.
Le fichier .mcp.json
La configuration se fait dans .mcp.json a la racine de ton projet (ou dans ~/.claude/.mcp.json pour une config globale). Voici un exemple complet :
json{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@anthropic-ai/mcp-playwright"]
},
"github": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-github"],
"env": {
"GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_..."
}
},
"postgres": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-postgres"],
"env": {
"DATABASE_URL": "postgresql://user:pass@localhost:5432/mydb"
}
}
}
}
Chaque entree definit un serveur MCP avec sa commande de lancement et ses variables d'environnement. Claude Code les démarré automatiquement quand il en a besoin.
Tu peux aussi gerer les serveurs MCP en ligne de commande :
bashclaude mcp add playwright npx @anthropic-ai/mcp-playwright
claude mcp list
claude mcp remove playwright
Playwright MCP : donner des yeux a Claude
C'est le serveur MCP qui m'a le plus impressionne. Playwright MCP donne a Claude la capacité de piloter un navigateur. Naviguer vers une URL, prendre des captures d'ecran, cliquer sur des éléments, remplir des formulaires, lire le contenu de la page.
Concretement, tu peux dire a Claude : "ouvre la page d'accueil de paltemps.fr et vérifié que le header s'affiche correctement". Il va lancer un navigateur headless, naviguer vers l'URL, prendre un screenshot, et te dire ce qu'il voit. S'il y a un bug visuel, il le détecté.
Sur paltemps.fr, j'ai utilise Playwright MCP pendant le développement pour tester l'affichage des articles scrapes. Au lieu de basculer manuellement entre le terminal et le navigateur, Claude testait lui-meme le rendu apres chaque modification du CSS. Le gain de temps sur les allers-retours est significatif.
Pour l'installer :
bashclaude mcp add playwright npx @anthropic-ai/mcp-playwright
Ensuite, dans ta session Claude Code, tu peux demander :
Navigue vers http://localhost:3000 et prends un screenshot de la page.Claude utilise automatiquement les outils Playwright MCP : browser_navigate, browser_take_screenshot, browser_click, browser_fill_form. Tu n'as pas besoin de spécifier quel outil utiliser, Claude choisit le bon.
GitHub MCP : les PRs depuis Claude
Le serveur GitHub MCP connecte Claude a l'API GitHub. Il peut créer des issues, commenter sur des pull requests, lister les checks d'un workflow. Pratique quand tu veux que Claude fasse une review de PR ou créé une issue à partir d'un bug qu'il vient de trouver dans ton code.
bashclaude mcp add github npx -y @modelcontextprotocol/server-github
Pense a configurer le token GitHub dans les variables d'environnement du serveur, ou via GITHUB_PERSONAL_ACCESS_TOKEN dans ton shell.
Database MCP : requêtes SQL directes
Le serveur PostgreSQL (et son équivalent SQLite) permet a Claude d'exécuter des requêtes sur ta base. Utile pour le debug : "regarde dans la table users s'il y a des comptes avec un email null" sans que tu aies a écrire la requête toi-meme.
Un avertissement sur celui-la : ne le connecte qu'a des bases de développement. Donner a un agent IA un acces direct a ta base de production, meme en lecture seule, c'est un risque que je ne prendrais pas. En dev, par contre, c'est un gain de temps énorme pour investiguer des bugs lies aux donnees.
Types de transport
Les serveurs MCP communiquent avec Claude via trois types de transport :
stdio : le plus courant. Le serveur est un processus local, Claude communique via stdin/stdout. C'est ce qu'utilisent Playwright, GitHub, et la plupart des serveurs.
SSE (Server-Sent Events) : pour les serveurs distants qui poussent des événements en temps réel.
HTTP : pour les serveurs qui exposent une API REST standard.
Pour 90% des cas d'usage, stdio suffit. Tu ne touches aux autres que si tu développés ton propre serveur MCP ou si tu connectes un service hébergé.
Combien de serveurs activer ?
Ma regle : active seulement ceux dont tu as besoin sur le projet en cours. Chaque serveur MCP consomme des ressources et ajoute des outils au contexte de Claude. Trop de serveurs actifs alourdissent le contexte et ralentissent le démarrage.
Sur paltemps.fr, j'utilise Playwright et filesystem. C'est suffisant. Sur un projet open-source avec des PRs frequentes, j'ajoute GitHub. Adapte a ton workflow.
Article précédent : 02 - CLAUDE.md
Article suivant : 04 - Les skills : etendre les capacités de Claude