Intégration de Zed avec le Web MCP de Bright Data

Découvrez comment connecter l’éditeur natif IA de Zed au Web MCP de Bright Data pour permettre un accès web en temps réel, une extraction de données propre et des workflows IA adaptés au web directement dans votre environnement de développement.

Dans ce tutoriel, vous apprendrez :

• Ce qu’est Zed et comment son modèle d’édition agentique natif de l’IA fonctionne dans un éditeur de code moderne.
• Pourquoi il est essentiel d’étendre Zed avec des capacités d’interaction web et d’extraction de données en temps réel pour un développement assisté par l’IA précis.
• Comment connecter Zed au Web MCP de Bright Data pour activer un agent IA sensible au Web capable de récupérer et d’utiliser des données Web publiques en direct directement dans l’éditeur.

C’est parti !

Qu’est-ce que Zed ?

Zed est un éditeur de code moderne et performant, conçu pour la rapidité, la collaboration et le développement assisté par l’IA. Il a été entièrement conçu dans un souci de réactivité et de faible latence, dans le but de rendre le codage immédiat et fluide, même sur des bases de code volumineuses.

Zed est entièrement écrit en Rust et est conçu pour utiliser efficacement plusieurs cœurs de processeur et l’accélération GPU. Ce choix de conception permet à Zed d’offrir des temps de démarrage rapides, des interactions fluides avec l’interface utilisateur et une latence de frappe minimale, qui sont des aspects essentiels de son expérience développeur.

Zed est disponible sur macOS, Linux et Windows, offrant une expérience native cohérente sur toutes les plateformes.

Dès son installation, Zed inclut un large éventail de fonctionnalités essentielles pour les développeurs, notamment

• Prise en charge native de Git pour la mise en scène, la validation, le tirage, la poussée et la visualisation des différences.
• Prise en charge du débogage basée sur le protocole DAP (Debug Adapter Protocol).
• Prise en charge du Language Server Protocol (LSP) pour plusieurs langages de programmation.
• Édition multibuffer pour composer et modifier du contenu provenant de différents fichiers dans une seule vue.
• Fonctionnalités de collaboration intégrées telles que l’édition partagée, le chat et le partage d’écran.
• Édition modale de type Vim pour les développeurs qui préfèrent un flux de travail modal.

Pourquoi booster Zed avec Bright Data Web MCP

Quel que soit le modèle d’IA que vous utilisez dans Zed, il fonctionne avec une limitation majeure : les LLM n’ont pas d’accès en direct au web. Leurs réponses sont basées sur des données d’entraînement qui représentent un instantané dans le temps, qui peut rapidement devenir obsolète.

Cette limitation devient évidente lorsque l’on travaille avec des documents, des outils ou des frameworks en constante évolution. Un assistant IA intégré à un éditeur ne peut pas vérifier les informations actuelles, naviguer sur des sites web ou extraire du contenu réel de manière autonome.

Imaginez maintenant que vous puissiez étendre les capacités de l’agent IA de Zed avec les fonctionnalités suivantes :

• Lire des pages de documentation en direct
• Récupérer des guides et des références à jour
• Naviguer et extraire du contenu à partir de sites Web réels

Ces capacités sont débloquées en connectant Zed à Bright Data Web MCP. Bright Data Web MCP propose plus de 60 outils compatibles avec l’IA, alimentés par l’infrastructure IA de Bright Data, permettant une interaction web en temps réel et la récupération de données pour les agents IA.

Les deux outils les plus couramment utilisés, également disponibles dans la version gratuite, sont les suivants :

Au-delà des outils de base, Web MCP comprend de nombreuses options avancées pour l’interaction avec le navigateur et l’extraction de données structurées. Le niveau gratuit donne accès aux outils de base, tandis que le mode Pro débloque l’ensemble complet pour des cas d’utilisation plus avancés.

En connectant Bright Data Web MCP à Zed, l’agent IA peut travailler avec du contenu web en direct plutôt qu’avec des connaissances statiques, ce qui se traduit par une assistance plus précise et plus fiable directement dans l’éditeur.

Comment intégrer Bright Data Web MCP à Zed

Dans cette section, vous allez :

• Configurer Bright Data Web MCP en tant que serveur MCP dans Zed
• Authentifier le serveur MCP à l’aide d’un jeton API Bright Data
• Permettre à l’agent IA de Zed d’accéder au contenu web en direct via MCP
• Vérifier que l’intégration fonctionne correctement

Suivez les étapes ci-dessous pour commencer !

Prérequis

Avant de commencer, assurez-vous de disposer des éléments suivants :

• Un système d’exploitation pris en charge (macOS, Linux ou Windows)
• Zed installé et en cours d’exécution
• Node.js installé (dernière version LTS recommandée)
• Un compte Bright Data avec un jeton API

Vous n’avez pas besoin de configurer Bright Data à l’avance. La configuration requise sera expliquée étape par étape dans les sections suivantes.

Bien que cela ne soit pas obligatoire, il peut être utile d’avoir quelques connaissances préalables, telles que :

• Une idée générale du fonctionnement du protocole MCP (Model Context Protocol)
• Une connaissance générale de Bright Data Web MCP et de ses outils disponibles

Étape n° 1 : installer et lancer Zed

Téléchargez Zed depuis le site officiel et installez-le pour votre système d’exploitation (macOS, Linux ou Windows).

Une fois installé, ouvrez Zed à partir du menu Applications et assurez-vous que l’éditeur se lance sans erreur.

Vous devriez voir l’interface principale de l’éditeur et pouvoir ouvrir le panneau Paramètres. Si Zed démarre correctement, vous pouvez passer à l’étape suivante.

Étape 2 : Activer l’IA et l’édition agentique dans Zed

Ouvrez les paramètres dans Zed et accédez à la section Fournisseurs LLM.

Connectez-vous à Zed IA ou configurez n’importe quel fournisseur pris en charge, tel que Anthropic, Google IA ou Amazon Bedrock, pour activer les fonctionnalités basées sur l’IA.

Une fois le fournisseur activé, retournez dans l’éditeur et ouvrez le panneau IA ou chat pour vérifier que les invites sont acceptées et que les réponses sont générées. Si l’IA répond dans l’éditeur, l’édition agentique est activée avec succès.

Étape n° 3 : Configurer Bright Data Web MCP localement

Pour activer l’accès web en temps réel pour l’agent IA de Zed, vous devez configurer Bright Data Web MCP sur votre machine locale. Ce serveur MCP sert de pont entre l’agent IA et les données web en direct.

Commencez par créer un compte Bright Data à partir du tableau de bord Bright Data. Si vous avez déjà un compte, connectez-vous simplement.

Pour une configuration rapide, ouvrez la page « MCP » de votre compte et suivez les instructions :

Sinon, suivez les étapes ci-dessous :

À partir du tableau de bord Bright Data, générez un jeton API et conservez-le en lieu sûr. Ce jeton est utilisé par le serveur Web MCP pour authentifier les demandes et accéder aux outils Web de Bright Data.

Pour ce tutoriel, le jeton API est la seule information d’identification dont vous avez besoin.

Bright Data Web MCP fonctionne comme un serveur local utilisant Node.js. Installez-le globalement en exécutant la commande suivante dans votre terminal :

npm install -g @brightdata/mcp

Cela installe le package Web MCP auquel Zed se connectera ultérieurement.

Démarrez le serveur Web MCP en exécutant :

API_TOKEN="VOTRE_TOKEN_API_BRIGHT_DATA" npx -y @brightdata/mcp

Remplacez YOUR_BRIGHT_DATA_API_TOKEN par votre jeton API réel.

Si le serveur démarre correctement, vous devriez voir des messages de journal indiquant que le serveur MCP est en cours d’exécution et prêt à accepter des requêtes.

Lors de sa première exécution, le serveur Bright Data Web MCP crée automatiquement deux zones requises dans votre compte Bright Data : une pour Web Unlocker et une pour l’API du navigateur. Ces zones sont utilisées en interne par Web MCP pour prendre en charge ses outils disponibles.

Vous pouvez vérifier leur création en vous rendant dans la section Proxies & Infrastructure de scraping (Proxys et Infrastructure de scraping) du tableau de bord Bright Data. Si votre jeton API ne dispose pas d’un accès administrateur, les zones devront peut-être être créées manuellement et référencées via des variables d’environnement.

Par défaut, Web MCP n’expose que les outils search_engine et scrape_as_markdown, qui sont disponibles dans la version gratuite. L’activation du mode Pro débloque l’ensemble complet des outils, y compris l’automatisation avancée du navigateur, et peut entraîner des frais supplémentaires.

Pour accéder à des fonctionnalités avancées telles que l’automatisation du navigateur et l’extraction de données structurées, activez le mode Pro en définissant PRO_MODE=true avant de démarrer le serveur Web MCP.

API_TOKEN="<YOUR_BRIGHT_DATA_API>" PRO_MODE="true" npx -y @brightdata/mcp

Une fois que vous avez vérifié que le serveur fonctionne correctement, arrêtez-le pour l’instant. Zed sera configuré pour démarrer et se connecter automatiquement au serveur Web MCP à l’étape suivante.

Étape n° 4 : Configurer Bright Data Web MCP dans Zed

Ouvrez les paramètres dans Zed et accédez à la section Serveurs MCP (Model Context Protocol). Cliquez sur Ajouter un serveur pour enregistrer un nouveau serveur MCP local.

Lorsque vous y êtes invité, définissez le serveur Bright Data MCP en configurant la commande pour exécuter le package Web MCP (npx @brightdata/mcp) et ajoutez la variable d’environnement requise pour l’authentification (API_TOKEN). Enregistrez la configuration pour que le serveur MCP soit disponible pour l’agent IA de Zed.

Une fois ajouté, Bright Data apparaîtra dans la liste des serveurs MCP, indiquant que Zed est prêt à se connecter au Web MCP pendant les workflows assistés par l’IA.

Une fois le serveur MCP activé, l’agent IA de Zed est désormais prêt à utiliser les outils Web de Bright Data pendant les workflows assistés par IA dans l’éditeur.

Étape n° 6 : exécuter une tâche réelle dans Zed

Au cours de cette étape, vous utiliserez l’agent IA de Zed avec Bright Data Web MCP pour récupérer du contenu Web en direct, le stocker localement et générer un petit script basé sur des données réelles.

Ouvrez l’IA ou le panneau de discussion de Zed (le même que celui que vous avez utilisé pour tester les réponses de l’IA précédemment).

• C’est ici que vous saisirez votre invite.
• Vous communiquez désormais avec l’agent IA de Zed, vous n’écrivez pas de code.

Copiez et collez exactement cette invite dans Zed :

Récupérez la page de documentation en direct à l'adresse
https://nodejs.org/en/docs

Utilisez Bright Data MCP pour extraire le contenu principal de la documentation et le convertir en Markdown propre. Enregistrez le contenu extrait sous le nom docs.md. Générez ensuite un bref résumé de la documentation et enregistrez-le sous le nom summary.md. Enfin, créez un script Node.js simple appelé readDocs.js qui charge docs.md et affiche les premières lignes.

Après avoir soumis l’invite, observez ce qui se passe :

• L’agent IA explique ou planifie les étapes qu’il va suivre
• Il identifie que l’accès au web est nécessaire
• Il sélectionne un outil Bright Data MCP (généralement scrape_as_markdown)
• Zed peut vous demander d’approuver l’exécution de l’outil

Une fois la tâche terminée, vérifiez que les fichiers générés sont présents dans le répertoire de votre projet. Ouvrez les fichiers Markdown pour confirmer qu’ils contiennent le contenu extrait de la page de documentation en ligne.

L’exécution du script généré devrait afficher les données du contenu extrait, vérifiant ainsi que le flux de travail s’est exécuté avec succès.

Conclusion

Dans ce tutoriel, vous avez appris à intégrer Zed à Bright Data Web MCP pour permettre une interaction web en temps réel dans un éditeur natif IA. En combinant le modèle d’édition agentique de Zed avec les outils web de Bright Data, vous avez créé un workflow dans lequel l’IA peut récupérer du contenu en direct, le stocker localement et générer du code et des fichiers utilisables basés sur des données réelles.

Web MCP de Bright Data ouvre la voie à la création de workflows de développement assistés par l’IA plus fiables et plus sensibles au contexte en donnant accès à des données web structurées et actualisées. Cette approche permet de réduire la dépendance aux connaissances statiques et d’améliorer la précision des résultats générés par l’IA.

Pour découvrir des cas d’utilisation plus avancés de l’agentique, consultez la plateforme Bright Data et ses solutions de données web prêtes pour l’IA.

Vous pouvez commencer par créer un compte Bright Data gratuit et expérimenter davantage avec Web MCP pour alimenter vos propres workflows de développement basés sur l’IA.