RL RanceLee Tutorials
← Retour aux tutoriels

MCP : ce que c'est et comment l'utiliser

Dans le chapitre précédent, nous avons découvert les Skills – transformer des opérations courantes en raccourcis en un clic. Mais vous êtes-vous déjà demandé :

L’IA peut-elle directement piloter mon navigateur ? Peut-elle lire et écrire mes notes ? Peut-elle interroger ma base de données ?

La réponse est : Oui, mais vous devez équiper l’IA de « plugins ».

Ce « système de plugins » est ce que nous appelons MCP.

Un aperçu de la tendance

De nombreuses fonctionnalités de MCP sont progressivement intégrées nativement dans Claude Code et Codex CLI.

Par exemple, au début, il fallait installer un MCP de recherche Web pour permettre à l’IA de chercher sur le web ; désormais, Claude Code et Codex disposent tous deux d’une recherche Web intégrée. La lecture/écriture de fichiers, les opérations Git et bien d’autres capacités sont également intégrées. Les Skills que nous avons vues précédemment remplacent également certains scénarios MCP – de nombreuses tâches standardisées qui nécessitaient auparavant MCP peuvent désormais être réalisées avec des Skills.

Mais cela ne signifie pas que MCP est inutile. Au contraire, MCP conserve une valeur irremplaçable :

  • Connexion aux systèmes propriétaires : les bases de données internes de votre entreprise, les API privées – celles-ci ne peuvent jamais être intégrées et ne sont accessibles que via MCP.
  • Opérer des logiciels tiers : contrôler un navigateur, gérer Obsidian, manipuler les notes Notion – les scénarios nécessitant une interaction profonde avec des logiciels externes sont ceux où MCP est le seul choix.
  • Écosystème communautaire : le marché MCP compte des milliers de serveurs contribués par la communauté, couvrant toutes sortes de scénarios auxquels vous n’auriez peut-être pas pensé.
  • Personnalisation : vous pouvez écrire votre propre serveur MCP pour permettre à l’IA d’accéder à n’importe quel système de votre choix.

En résumé : les fonctionnalités intégrées couvrent 80 % des besoins courants, tandis que MCP gère les 20 % restants de besoins personnalisés – et ces 20 % font souvent la vraie différence.


Qu’est-ce que MCP ?

En bref

MCP = Model Context Protocol = le système de plugins de l’IA

MCP est un protocole ouvert introduit par Anthropic (le créateur de Claude) qui permet aux outils d’IA de se connecter à des systèmes externes.

Pourquoi avons-nous besoin de MCP ?

Considérez ce scénario :

Sans MCP :

You: Open Baidu and search for "today's weather"
AI: Sorry, I can't access the browser. I can only process text…

Avec MCP :

You: Open Baidu and search for "today's weather"
AI: Sure, I've opened the browser, searched for "today's weather", and here are the results…

Quelle est la différence ? L’IA passe de « peut seulement parler » à « peut agir ».

Une analogie

L’IA elle-même = un cerveau brillant

  • Il sait tout, mais n’a ni mains ni pieds.
  • Il peut vous dire comment faire quelque chose, mais ne peut pas le faire à votre place.

MCP = connecter des mains et des pieds à ce cerveau

  • Connecter la « main navigateur » : l’IA peut automatiquement manipuler des pages web.
  • Connecter la « main système de fichiers » : l’IA peut lire et écrire vos fichiers.
  • Connecter la « main base de données » : l’IA peut interroger et modifier des données.
  • Connecter la « main Obsidian » : l’IA peut gérer directement vos notes.

Une autre analogie :

  • L’IA = un chef super intelligent
  • MCP = équiper le chef d’une cuisine complète (casseroles, poêles, four, mixeur…)
  • Sans MCP : le chef ne peut que réciter des recettes.
  • Avec MCP : le chef peut réellement cuisiner pour vous.

Comparaison avec ce qui précède

Dans le chapitre précédent, nous avons comparé les prompts, les Skills et MCP :

Prompts → The most basic interaction method (verbal instructions)
    ↓
Skills → Encapsulate prompts + simple logic (shortcuts)
    ↓
MCP → Skills + the ability to connect to external systems (connecting the world)

MCP est le plus puissant des trois car il brise les « murs » de l’IA et lui permet d’atteindre le monde extérieur.


Comment fonctionne MCP

Vous n’avez pas besoin de plonger dans les détails techniques – comprenez simplement ce schéma :

You ←→ Claude Code/Codex ←→ MCP Server ←→ External System
         (AI Tool)           (Bridge)      (Browser/Database/Notes, etc.)

Trois rôles :

Rôle Description Exemple
Outil IA (Client) L’assistant de codage que vous utilisez Claude Code, Codex CLI
Serveur MCP Le pont entre l’IA et les systèmes externes Playwright MCP, GitHub MCP
Système externe La cible sur laquelle l’IA opère Navigateur, GitHub, Obsidian

Tout ce que vous avez à faire est d’installer un serveur MCP dans votre outil IA, et ensuite l’IA peut opérer le système externe correspondant.

C’est aussi simple que d’installer une application sur votre téléphone.


Où trouver des serveurs MCP

Il existe de nombreux serveurs MCP. Comment trouver celui dont vous avez besoin ? Voici les principaux « marchés MCP » :

1. mcp.so (Recommandé)

URL : https://mcp.so

C’est actuellement le répertoire le plus complet de serveurs MCP, comme l’« App Store de MCP ».

Fonctionnalités :

  • Des milliers de serveurs MCP répertoriés
  • Descriptions détaillées et guides d’installation
  • Recherche et navigation par catégorie
  • Adapté aux utilisateurs chinois

Comment l’utiliser :

  1. Ouvrez le site web.
  2. Recherchez la fonctionnalité souhaitée (par exemple, « playwright » ou « navigateur »).
  3. Trouvez le serveur MCP correspondant.
  4. Suivez les instructions d’installation sur la page.

2. Smithery

URL : https://smithery.ai

Fonctionnalités :

  • Essayez certains serveurs MCP directement en ligne.
  • Commandes d’installation en un clic.
  • Hébergement de clés API.

3. GitHub awesome-mcp-servers

URL : https://github.com/punkpeye/awesome-mcp-servers

Fonctionnalités :

  • Liste de serveurs MCP maintenue par la communauté.
  • Open source et gratuit.
  • Mise à jour fréquente.

4. Serveurs MCP officiels

De grandes entreprises comme Anthropic et Microsoft ont également publié des serveurs MCP officiels :

Serveur MCP Fonction Mainteneur
Playwright MCP Automatisation du navigateur Microsoft
GitHub MCP Opérations GitHub GitHub
Context7 MCP Obtenir la documentation la plus récente Communauté
Notion MCP Gestion des notes Notion

Recommandation : les débutants devraient commencer par mcp.so, rechercher la fonctionnalité souhaitée et suivre le guide d’installation.


Comment installer MCP

La méthode d’installation diffère légèrement entre Claude Code et Codex CLI. Voici comment procéder pour chacun.

Installer MCP dans Claude Code

Méthode 1 : Ligne de commande (Recommandée)

Claude Code fournit une commande dédiée à la gestion MCP – une ligne suffit :

claude mcp add playwright npx '@playwright/mcp@latest'

Cette commande signifie :

  • claude mcp add : Ajouter un serveur MCP.
  • playwright : Le nom que vous donnez à ce MCP (vous pouvez choisir n’importe quel nom).
  • npx '@playwright/mcp@latest' : La commande pour démarrer le serveur MCP.

Vérifier l’installation :

Dans Claude Code, tapez /mcp pour voir la liste des serveurs MCP installés.

Méthode 2 : Modifier le fichier de configuration

Vous pouvez également modifier directement le fichier de configuration de Claude Code pour ajouter MCP.

Chemin du fichier de configuration : ~/.claude.json

Ajoutez la section mcpServers :

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["@playwright/mcp@latest"]
    }
  }
}

Enregistrez et redémarrez Claude Code.

Installer MCP dans Codex CLI

La configuration MCP de Codex CLI se trouve dans le fichier ~/.codex/config.toml.

Modifier config.toml

Ajoutez ce qui suit à la fin du fichier :

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]
startup_timeout_sec = 60.0

Explication des paramètres :

Paramètre Description
command La commande pour démarrer le serveur MCP
args Arguments de la commande
startup_timeout_sec Délai d’attente au démarrage en secondes ; certains serveurs MCP démarrent lentement, donc 60 est recommandé

MCP avec variables d’environnement

Certains serveurs MCP nécessitent des clés API ou d’autres configurations. Vous pouvez les transmettre en utilisant la section env :

[mcp_servers.context7]
command = "npx"
args = ["-y", "mcp-remote", "https://mcp.context7.com/mcp", "--header", "Authorization:${CTX7_AUTH_HEADER}"]
startup_timeout_sec = 60.0

[mcp_servers.context7.env]
CTX7_AUTH_HEADER = "Bearer your_token"

Enregistrez et redémarrez Codex.


Pratique : Installer Playwright MCP et contrôler un navigateur

Essayons ! Nous allons utiliser Playwright MCP comme exemple pour laisser l’IA contrôler automatiquement un navigateur.

Qu’est-ce que Playwright MCP ?

Playwright = l’outil d’automatisation de navigateur de Microsoft
Playwright MCP = Permet à l’IA de contrôler Playwright via le protocole MCP

Après installation, l’IA peut :

  • Ouvrir des pages web
  • Cliquer sur des boutons
  • Remplir des formulaires
  • Prendre des captures d’écran
  • Lire le contenu des pages
  • Se connecter automatiquement à des sites web

Étape 1 : Installer Playwright MCP

Dans Claude Code

Ouvrez un terminal et exécutez :

claude mcp add playwright npx '@playwright/mcp@latest'

Si vous souhaitez spécifier un navigateur (par exemple, Edge), ajoutez des paramètres :

claude mcp add playwright npx '@playwright/mcp@latest' -- --browser msedge

Dans Codex CLI

Modifiez ~/.codex/config.toml et ajoutez :

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]
startup_timeout_sec = 60.0

Si vous souhaitez utiliser Edge et conserver votre session de connexion, vous pouvez le configurer ainsi :

[mcp_servers.playwright]
command = "mcp-server-playwright"
args = ["--browser", "msedge", "--executable-path", "/Applications/Microsoft Edge.app/Contents/MacOS/Microsoft Edge", "--user-data-dir", "/Users/your_username/Library/Application Support/Microsoft Edge", "--isolated"]
startup_timeout_sec = 60.0

Astuce : L’utilisation de --user-data-dir permet au navigateur de conserver votre état de connexion, ainsi l’IA n’a pas besoin de se reconnecter lors de l’ouverture de pages.

Étape 2 : Vérifier l’installation

Démarrez Claude Code :

claude

Tapez /mcp et vous devriez voir playwright dans la liste avec un statut « connected ».

Étape 3 : Laisser l’IA opérer le navigateur

Maintenant, essayez ! Dans Claude Code, entrez :

Open Baidu, search for "What is MCP", and save a screenshot of the search results.

L’IA va automatiquement :

  1. Lancer le navigateur
  2. Ouvrir la page d’accueil de Baidu
  3. Taper « What is MCP » dans la barre de recherche
  4. Cliquer sur le bouton de recherche
  5. Prendre une capture d’écran de la page de résultats
  6. Enregistrer la capture d’écran dans votre dossier de projet

Vous n’avez rien à faire – l’IA effectue toutes les étapes automatiquement !

Plus de cas d’utilisation

Avec Playwright MCP installé, vous pouvez demander à l’IA de faire beaucoup de choses :

Exemple 1 : Remplir automatiquement un formulaire

Open https://example.com/register and fill in the registration form with the following info:
Username: testuser
Email: [email protected]
Then click submit.

Exemple 2 : Extraire le contenu d’une page web

Open https://news.ycombinator.com and extract the titles and links of the top 10 stories on the front page. Organize them into a Markdown table.

Exemple 3 : Tests automatisés

Open the translation page I just made (translate.html) and test the following:
1. Enter "Hello World", click translate, and check if a result appears.
2. Click the clear button and check if the input box is cleared.
3. Toggle dark mode and check if the interface looks correct.
Compile the test results into a report.

Serveurs MCP recommandés

Voici quelques serveurs MCP pratiques, classés par cas d’utilisation :

Serveur MCP Fonction Commande d’installation (Claude Code)
Playwright Automatisation du navigateur claude mcp add playwright npx '@playwright/mcp@latest'
Chrome DevTools Débogage Chrome claude mcp add chrome-devtools npx 'chrome-devtools-mcp@latest'

Outils de développement

Serveur MCP Fonction Commande d’installation (Claude Code)
GitHub Opérations GitHub claude mcp add github npx '@anthropic-ai/github-mcp'
Context7 Obtenir les dernières docs techniques Nécessite une configuration de jeton (voir config)

Notes et documentation

Serveur MCP Fonction Notes
Notion Lire/écrire des notes Notion Nécessite une clé API Notion
Obsidian Lire/écrire des notes Obsidian Développé par la communauté

Bases de données

Serveur MCP Fonction Notes
Supabase Opérer la base de données Supabase Nécessite un jeton d’accès
PostgreSQL Opérer PostgreSQL Développé par la communauté

Rendez-vous sur mcp.so ou smithery.ai pour trouver encore plus de serveurs MCP.


Remarques importantes

Rappels de sécurité

MCP donne à l’IA la capacité d’opérer des systèmes externes, ce qui introduit également certains risques :

  1. Accordez les permissions avec prudence : ne donnez pas à l’IA un accès complet au système sans réflexion.
  2. Vérifiez les actions : avant des opérations importantes, demandez à l’IA de vous dire ce qu’elle s’apprête à faire.
  3. Sauvegardez les données : avant de laisser l’IA manipuler des données importantes, faites une sauvegarde.
  4. Sécurité des clés API : ne partagez jamais vos clés API avec d’autres.

Foire aux questions

Q : Que faire si le serveur MCP ne démarre pas ?

R : Vérifiez les points suivants :

  • La version de Node.js est-elle 18 ou supérieure ? (node -v)
  • Le réseau fonctionne-t-il ?
  • startup_timeout_sec est-il suffisamment élevé ? (60 secondes sont recommandées)

Q : Après avoir installé un MCP navigateur, je ne vois pas de fenêtre de navigateur.

R : Playwright s’exécute en mode headless par défaut (pas de fenêtre visible). Si vous voulez voir le navigateur en action, ajoutez le paramètre --headless false :

claude mcp add playwright npx '@playwright/mcp@latest' -- --headless false

Q : Les serveurs MCP peuvent-ils être partagés entre Claude Code et Codex CLI ?

R : Le serveur MCP lui-même est universel (par exemple, Playwright MCP peut être utilisé par les deux outils), mais la méthode de configuration diffère :

  • Claude Code : ~/.claude.json ou la commande claude mcp add
  • Codex CLI : ~/.codex/config.toml

Résumé

Ce que vous avez appris aujourd’hui :

  1. Qu’est-ce que MCP : le système de plugins de l’IA qui permet à l’IA de se connecter à des outils et services externes.
  2. Marchés MCP : mcp.so, Smithery, awesome-mcp-servers – trouvez des plugins comme dans un App Store.
  3. Comment installer MCP : utilisez la commande claude mcp add pour Claude Code, ou modifiez config.toml pour Codex CLI.
  4. Pratique : installation de Playwright MCP et laisser l’IA contrôler automatiquement un navigateur.
  5. Serveurs MCP recommandés : navigateur, GitHub, notes, bases de données, etc.

Points clés à retenir :

  • MCP transforme l’IA de « peut seulement parler » à « peut agir ».
  • Installer MCP est aussi simple que d’installer une application sur votre téléphone.
  • Les débutants sont encouragés à commencer par Playwright MCP pour l’expérience la plus intuitive.