AI

Donner à Zencoder l’accès au Web avec Bright Data (MCP + Skills)

Découvrez comment étendre les agents IA Zencoder avec des données web en direct grâce au Web MCP et aux Agent Skills de Bright Data.
17 min de lecture
Zencoder with Web MCP

Dans ce billet de blog, vous apprendrez :

  • Ce qu’est Zencoder et quels produits il propose pour améliorer le développement logiciel avec l’IA.
  • Pourquoi l’extension avec un accès web rend les résultats plus fiables et précis.
  • Comment Bright Data prend en charge l’intégration de Zencoder pour le Scraping web, la recherche, la découverte et l’automatisation du navigateur.
  • Comment connecter Bright Data à Zencoder Zenflow (et ses plugins IDE) via MCP.
  • Comment donner aux produits Zencoder la connaissance de Bright Data grâce aux Agent Skills officiels.
  • Ce que l’intégration Bright Data + Zencoder permet, illustrée par un exemple complet.

Plongeons dans le vif du sujet !

Qu’est-ce que Zencoder ?

Zencoder est une entreprise qui fournit des solutions pour des agents de codage propulsés par l’IA, agissant comme des programmeurs en binôme autonomes.

Son produit principal est Zenflow, une plateforme d’orchestration IA qui exécute des flux de travail multi-agents dans les IDE, les pipelines CI/CD et les environnements de bureau. Elle permet aux agents de planifier, construire, tester et vérifier le code, en utilisant le contexte complet de la base de code, des flux de travail structurés et des contrôles qualité intégrés. Son objectif final est d’automatiser le développement logiciel et les tâches opérationnelles à grande échelle.

Zenflow prend en charge deux modes :

  • Zenflow Code : Agents IA pour le développement logiciel (construction, test, refactorisation).
  • Zenflow Work : Agents IA pour les flux de travail d’entreprise à travers des outils tels que Jira, Slack, et autres.

Remarque : Zencoder est également disponible via des agents IDE dans Visual Studio Code et JetBrains.

Les principales fonctionnalités prises en charge par les produits Zencoder sont :

  • Orchestration multi-agents : Plusieurs agents IA collaborent sur des tâches de planification, de codage, de révision et d’audit.
  • Contexte complet de la base de code : Les agents comprennent les architectures multi-dépôts et les dépendances avant d’agir.
  • Flux de travail structurés : Les pipelines « Spec → plan → build → test → verify » remplacent les invites ad hoc.
  • Vérification intégrée : Les tests automatisés, le linting et la révision du code garantissent la qualité avant l’acceptation des résultats.
  • Exécution parallèle : Plusieurs agents s’exécutent simultanément dans des environnements isolés.
  • Intégration multi-outils : Fonctionne avec GitHub, Jira, Slack, les systèmes CI/CD, et plus encore.
  • Contrôles d’entreprise : Accès basé sur les rôles, portes d’approbation, journaux d’audit et support de conformité (SOC 2, ISO).
  • Planification autonome : Les agents exécutent automatiquement des tâches récurrentes telles que les mises à jour de dépendances ou les révisions de PR.

Pour en savoir plus, consultez la documentation officielle.

Pourquoi donner aux agents IA de Zencoder la capacité d’explorer le Web et d’en extraire des données

Comme toute autre solution propulsée par un LLM, les agents Zencoder sont contraints par une limitation fondamentale : la dégradation de l’information. Étant donné que les grands modèles de langage produisent des réponses dérivées de leurs jeux de données d’entraînement, ils opèrent dans une fenêtre fixe du passé.

Dans un écosystème technique en rapide évolution, cette latence représente un obstacle majeur. Un tel agent de codage peut proposer des méthodes de bibliothèque obsolètes ou ignorer des mises à jour de sécurité cruciales. Pour contourner ces limitations, vos modèles IA nécessitent une connectivité web en temps réel. C’est précisément là qu’intervient Bright Data !

L’infrastructure prête pour l’IA de Bright Data permet à votre agent Zencoder de dépasser sa formation initiale. Ainsi, il acquiert la capacité de :

  • Effectuer des recherches en temps réel : Parcourir Google ou d’autres moteurs de recherche pour obtenir de la documentation et des informations à jour, réduisant les hallucinations et les suggestions obsolètes.
  • Valider la précision : Vérifier les extraits de code par rapport aux discussions Stack Overflow ou aux problèmes GitHub pour améliorer la précision du débogage.
  • Extraire des données structurées : Collecter des données depuis des pages web en direct pour alimenter des dépôts locaux ou générer des données fictives réalistes pour le développement et les tests.
  • Améliorer la documentation : Recommander des URL fiables et bien référencées pour les fichiers README ou les wikis de projets internes.
  • Et bien plus encore…

L’atout distinctif de Bright Data est son immense réseau mondial de Proxys résidentiels comptant plus de 400 millions d’IPs résidentielles réparties dans 195 pays. Cette infrastructure offre une simultanéité illimitée, une disponibilité de 99,99 % et un taux de succès de 99,95 %.

En intégrant Bright Data dans les produits Zencoder, le résultat est des agents IA évolutifs, ancrés dans des données web structurées, à jour et contextuelles.

Comment connecter les agents IA de Zencoder à l’infrastructure de données web de Bright Data

Bright Data prend en charge Zencoder via deux intégrations :

  • Bright Data Web MCP : Serveur MCP exposant plus de 70 outils pour l’accès aux données web, l’extraction et l’automatisation du navigateur.
  • Bright Data skills : Agent Skills qui guident les agents Zencoder dans l’utilisation efficace des solutions Bright Data.

Notez que ces approches ne sont pas des alternatives mais sont synergiques. En détail, un skill spécifique fournit des conseils pour une utilisation optimale des outils Web MCP.

Important : Les chapitres suivants feront référence à l’intégration de Bright Data dans Zenflow via MCP et Agent Skills. Les plugins IDE de Zencoder s’appuient également sur les mêmes fichiers de configuration concernés. Ainsi, la configuration reste inchangée (seules les captures d’écran de l’interface et quelques instructions mineures diffèrent).

Bright Data Web MCP

Le Bright Data Web MCP fournit plus de 70 outils pour interagir avec les produits et services basés sur l’API de Bright Data.

Même en mode Rapid (niveau gratuit), les outils principaux incluent :

Outil Description
search_engine + version batch pour usage parallèle Récupérer les résultats Google, Bing ou Yandex en JSON structuré ou Markdown
scrape_as_markdown + version batch pour usage parallèle Convertir n’importe quelle page web en Markdown propre tout en gérant le contournement de la protection anti-bot
discover Recherche propulsée par l’IA retournant des résultats web classés et pertinents

Ensuite, le mode Pro débloque des capacités avancées pour l’extraction de données structurées depuis des plateformes telles que GitHub, NPM, PyPI, Amazon, LinkedIn, Yahoo Finance, YouTube, Zillow, Google Maps, et plus de 40 autres. Il expose également des outils pour l’automatisation complète du navigateur.

Bright Data Skills

Les Bright Data skills comprennent :

Skill Description
search Effectue une recherche web et retourne des résultats structurés
scrape Scrape des pages en Markdown propre avec gestion de la protection anti-bot
data-feeds Extrait des données structurées depuis plus de 40 sites avec interrogation planifiée
bright-data-mcp Orchestre les outils Web MCP pour une recherche, un scraping et une automatisation améliorés
brightdata-cli Guide d’utilisation de la CLI Bright Data pour le scraping, les Proxys et la gestion des jeux de données
bright-data-best-practices Référence pour utiliser les API Bright Data correctement et efficacement
scraper-builder Construit des Scrapers de production via une analyse guidée du site et des étapes d’extraction
competitive-intel Analyse concurrentielle en direct utilisant des données web sur les marchés et les concurrents
seo-audit Audits SEO utilisant des signaux web en direct, la structure et les indicateurs de classement
design-mirror Recrée les modèles de conception UI, les tokens et les structures de composants

Étapes communes

Dans les deux prochains chapitres, nous verrons comment intégrer Bright Data dans Zenflow en utilisant respectivement MCP et Agent Skills. Pour l’instant, concentrons-nous sur quelques étapes de configuration communes requises avant de commencer.

Prérequis

Pour suivre ce tutoriel, assurez-vous d’avoir :

Installer et configurer Zenflow

Téléchargez le programme d’installation de Zenflow, exécutez-le, puis lancez l’application. Voici l’écran d’accueil que vous devriez voir :
La vue d'accueil de Zenflow
Connectez-vous (ou inscrivez-vous si vous ne l’avez pas encore fait) pour connecter votre compte Zencoder à Zenflow.

Vous serez guidé à travers quelques questions de configuration. Répondez-y, puis choisissez votre agent IA par défaut :
Sélectionner l'agent IA Zencoder par défaut

Cliquez sur « Suivant » une dernière fois pour terminer la configuration :
Zenflow
Bien joué ! Vous avez installé Zenflow avec succès. Il est temps de le configurer pour l’intégration avec Bright Data.

Connecter Bright Data à Zencoder via le Web MCP

Dans cette section, vous serez guidé dans la configuration du Bright Data Web MCP dans Zenflow.

Prérequis

Pour suivre plus facilement, il est recommandé d’avoir :

Remarque : Les prérequis listés dans le chapitre « Étapes communes » s’appliquent également ici.

Étape n°1 : Démarrer avec le Web MCP de Bright Data

Avant de connecter le Web MCP de Bright Data à Zenflow, assurez-vous que le serveur MCP fonctionne correctement sur votre machine.

Commencez par vous connecter à votre compte Bright Data. Pour une configuration rapide, suivez les instructions dans la section « MCP » du panneau de contrôle Bright Data :
La section « MCP » dans le panneau de contrôle Bright Data
Alternativement, pour plus de guidance, suivez les étapes de configuration manuelle ci-dessous.

Tout d’abord, installez le Web MCP globalement :

npm install -g @brightdata/mcp

Vérifiez que le serveur MCP démarre avec :

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

Ou, de manière équivalente, dans PowerShell :

$Env:API_TOKEN="<YOUR_BRIGHT_DATA_API>"; npx -y @brightdata/mcp

Remplacez le paramètre fictif <YOUR_BRIGHT_DATA_API> par votre clé API Bright Data réelle. Cette commande définit la variable d’environnement API_TOKEN requise et lance le serveur Web MCP localement via le package @brightdata/mcp.

Si tout fonctionne correctement, vous devriez voir ces journaux :
Messages de démarrage du Web MCP de Bright Data
Lors du premier démarrage, le package @brightdata/mcp crée deux zones dans votre compte Bright Data :

Ces zones alimentent les plus de 70 outils disponibles dans le Web MCP. Si nécessaire, vous pouvez également configurer des zones personnalisées, comme décrit dans le dépôt officiel.

Pour vérifier que les zones ont été créées, accédez à la section « Proxies & Scraping Infrastructure » dans le panneau de contrôle Bright Data :
Notez les zones « mcp_unlocker » et « mcp_browser » créées par le Web MCP au démarrage
Rappelez-vous que sur le niveau gratuit du Web MCP (mode Rapid), vous avez accès à un ensemble limité d’outils.

Pour débloquer tous les 70+ outils, vous devez activer le mode Pro. Pour ce faire, définissez la variable d’environnement PRO_MODE="true" :

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

Ou, sous Windows :

$Env:API_TOKEN="<YOUR_BRIGHT_DATA_API>"; $Env:PRO_MODE="true"; npx -y @brightdata/mcp

Remarque : Le mode Pro n’est pas inclus dans le niveau gratuit et entraîne des frais supplémentaires.

Parfait ! Vous venez de vérifier que le Bright Data Web MCP fonctionne sur votre machine. Ensuite, vous allez configurer Zencoder Zenflow pour s’y connecter.

Étape n°2 : Configurer le Web MCP dans Zenflow

Tous les produits Zencoder prennent en charge l’intégration MCP via un fichier de configuration situé à ~/.zencoder/settings.json. Vous pouvez soit modifier ce fichier manuellement, soit y accéder via l’interface Zenflow.

Pour un flux de travail via l’interface, commencez par cliquer sur l’icône « Paramètres » dans le coin inférieur gauche :
Cliquer sur l'icône « Paramètres »

Naviguez ensuite vers la section « MCP Servers », où vous pouvez modifier le fichier de configuration directement depuis l’interface :
Notez la section où vous pouvez modifier le fichier « ~/.zencoder/settings.json »
Assurez-vous que votre fichier ~/.zencoder/settings.json inclut ce qui suit :

{
  "mcpServers": {
    "bright-data-web-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": ["@brightdata/mcp"],
      "env": {
        "API_TOKEN": "<YOUR_BRIGHT_DATA_API_KEY>",
        "PRO_MODE": "true"
      }
    }
  }
}

Si vous modifiez via l’interface, entrez la même configuration et cliquez sur « Enregistrer » :
Modification du fichier « ~/.zencoder/settings.json » dans l'interface Zenflow
Cette configuration reflète la commande npx testée précédemment et utilise des variables d’environnement pour l’authentification et la configuration :

  • API_TOKEN (requis) : Votre clé API Bright Data.
  • PRO_MODE (optionnel) : Définissez sur "true" pour activer les fonctionnalités Pro, ou supprimez-le pour utiliser le niveau gratuit.

Une fois configuré, Zencoder lancera le serveur Web MCP local en utilisant la commande npx spécifiée et s’y connectera. Fantastique !

Étape n°3 : Vérifier la connexion Web MCP

Au moment de la rédaction, Zenflow ne fournit pas d’interface directe pour inspecter les outils MCP disponibles. Pour vérifier la connexion, passez en mode Work et envoyez une invite comme :

Which MCP tools do you have access to?

Vous devriez voir un résultat similaire à :
Les outils Web MCP disponibles dans Zenflow
La réponse listera tous les outils MCP disponibles. En mode Pro, la liste inclut les 70+ outils Web MCP. Sinon, vous ne verrez que les outils disponibles en mode Rapid (gratuit).

Excellent ! Cela confirme que le Bright Data Web MCP est correctement connecté et expose des outils à votre produit Zencoder. Plus loin dans ce billet de blog, vous verrez comment utiliser le Web MCP conjointement avec les Bright Data Skills dans un vrai flux de travail.

Ajouter les Bright Data Skills à Zencoder

Ici, vous apprendrez comment ajouter les Bright Data Skills à votre configuration Zencoder via le flux de travail guidé fourni par l’outil skills de Vercel.

Configuration manuelle rapide : Si vous préférez une approche manuelle, commencez par cloner le dépôt des Bright Data skills. Ensuite, copiez les skills dans le répertoire ~/.zencoder/skills :

git clone https://github.com/brightdata/skills
cp -r skills/skills/* ~/.zencoder/skills/

Sinon, suivez l’approche plus guidée ci-dessous !

Prérequis

Assurez-vous d’avoir :

Remarque : Pour une configuration rapide de la CLI Bright Data, référez-vous au guide « Bright Data CLI : Installation & Configuration ». Alternativement, lisez le billet de blog dédié.

Une compréhension de base du standard Agent Skills et une certaine familiarité avec l’outil CLI skills de Vercel seront également utiles.

Étape n°1 : Installer les Bright Data Skills

Pour installer les Bright Data Skills dans votre environnement Zencoder, exécutez :

npx skills add brightdata/skills -a zencoder

La commande ci-dessus installe le package skills et lance le processus de configuration, qui va :

  • Télécharger les Bright Data skills depuis le répertoire officiel Agent Skills.
  • Les configurer pour une utilisation sur tous les produits Zencoder, y compris Zenflow et les plugins IDE.

Vous verrez d’abord un écran où vous pouvez choisir quels skills installer :
Sélectionner tous les Bright Data skills
Pour tous les installer, utilisez la barre d’espace pour sélectionner chaque skill, puis appuyez sur Entrée.

Ensuite, vous serez invité à sélectionner la portée de l’installation. Étant donné que l’intégration Web MCP a été configurée globalement, vous devriez également installer les Bright Data skills globalement. Choisissez donc l’option « Global » :
Choisir la portée de l'installation

Ensuite, vous verrez les sections « Résumé de l’installation » et « Évaluation des risques de sécurité ». Examinez-les attentivement et appuyez sur Entrée pour confirmer. Enfin, vous recevrez un message de confirmation :
La vue de confirmation finale
Les Bright Data skills seront installés dans le répertoire ~/.zencoder/skills. Redémarrez votre produit Zencoder pour vous assurer que les modifications sont chargées. Excellent !

Étape n°2 : Vérifier que les Skills sont disponibles

Vous devriez maintenant pouvoir accéder aux skills installés en tant que commandes spéciales. Pour vérifier cela, appuyez sur / dans Zencoder et vérifiez que les Bright Data skills apparaissent dans la liste (avec les skills Zencoder par défaut) :
Notez les Bright Data skills disponibles en tant que commandes
Les commandes listées devraient correspondre aux Bright Data skills, confirmant une installation réussie.

Important : Si les skills n’apparaissent pas, redémarrez votre produit Zencoder. Dans Zenflow, assurez-vous que les skills sont également copiés dans ~/.agents/skills (vous pouvez également les installer dans ce dossier avec npx skills add brightdata/skills -a cline). Ensuite, redémarrez Zenflow.

Optionnel : Si vous n’avez pas encore configuré la CLI Bright Data, exécutez le skill d’intégration et suivez les instructions :

/agent-onboarding

Les Bright Data onboarding skills
Mission accomplie ! Dans le prochain chapitre, vous verrez comment tirer pleinement parti du Bright Data Web MCP et des skills au sein des agents IA Zencoder.

Zencoder + Bright Data : Une expérience d’assistance IA de niveau supérieur

Pour vérifier à quel point la configuration Zencoder + Bright Data est puissante, considérons une tâche concrète nécessitant des données web du monde réel.

Supposons que vous recherchiez les meilleures bibliothèques Python de hachage pour un projet sur lequel vous travaillez.
Se fier uniquement à un LLM dans un tel scénario peut être risqué. Après tout, les modèles IA peuvent ne pas être au courant des mises à jour récentes, des problèmes de sécurité, des CVE affectant des bibliothèques spécifiques ou des changements dans les algorithmes sous-jacents. Pour cette raison, il est important d’ancrer l’agent dans des données web en direct.

Vous pourriez également vouloir scraper des informations depuis des sources telles que PyPI ou GitHub. Cela fournira à l’agent IA des détails supplémentaires sur les dépendances, les commandes d’installation, le statut de maintenance, et plus encore.

Atteignez l’objectif avec une invite comme celle-ci :

Discover online the best Python libraries for hashing. Start by performing a contextual search on Google, access the most relevant 2-3 pages, and then select a list of the top 5-7 Python libraries. For each library, scrape structured data from its PyPI page. 

With the scraped data, produce a final structured report with a ranking, including for each library: a description, main capabilities, installation instructions, and (if available) requirements, GitHub links, and other relevant details.

Lancez-la en mode Work, et voici ce qui devrait se produire :
Exécution de l'invite dans Zenflow Work
Voici ce qui s’est passé :

  1. L’agent commence par définir un plan.
  2. Il utilise l’outil search_engine (alimenté par Bright Data SERP API) du Web MCP pour récupérer des résultats Google SERP contextuels.
  3. Il sélectionne les pages les plus pertinentes et les scrape en utilisant scrape_batch (via Web Unlocker API).
  4. Il identifie les 7 bibliothèques les plus pertinentes et les enrichit avec des données PyPI structurées en appelant l’outil Web MCP Pro web_data_pypi_package en parallèle.
  5. Il agrège toutes les informations collectées dans un fichier report.md final.

Le résultat final est un fichier report.md dans le répertoire du projet :
Notez le fichier « report.md » produit

Ouvrez-le, et vous observerez un rapport Markdown structuré contenant des informations détaillées et vérifiables. Concentrez-vous sur une bibliothèque Python de hachage :
La section dans report.md dédiée à la bibliothèque « cryptography »
Notez comment chaque section de bibliothèque est basée sur des données PyPI en direct plutôt que sur les connaissances d’entraînement du modèle seul.

Le rapport inclut également un tableau comparatif pour faciliter la prise de décision :
Le tableau comparatif final
Et voilà ! Cet exemple simple démontre la valeur de l’intégration de Bright Data dans Zenflow Work (ou tout autre produit Zencoder). Les agents Zencoder peuvent désormais récupérer des informations web prêtes pour l’IA et à jour, produisant des résultats plus fiables dans une large gamme de cas d’utilisation.

Conclusion

Dans ce tutoriel, vous avez appris ce qu’est Zencoder et quelles fonctionnalités il offre via Zenflow et ses plugins IDE. En particulier, vous avez vu pourquoi et comment étendre les produits Zencoder en les connectant à Bright Data via le Web MCP et ses skills officiels.

Cette intégration améliore considérablement l’expérience d’assistance au codage IA de Zencoder. Grâce à elle, l’agent IA sous-jacent acquiert la capacité d’interagir avec le web pour l’ancrage, la recherche et les actions automatisées du navigateur.

Pour des flux de travail encore plus avancés, explorez la gamme complète de services compatibles IA dans l’écosystème Bright Data.

Créez un compte Bright Data gratuit aujourd’hui et commencez à intégrer nos outils de données web prêts pour l’infrastructure IA !