AI

Integration von Zed mit Bright Data’s Web MCP

In diesem Leitfaden wird erläutert, wie Sie den KI-nativen Editor von Zed mit dem Web MCP von Bright Data verknüpfen können, um direkt in Ihrer Programmierumgebung Live-Websuchen und Datenextraktionen durchzuführen.
10 min lesen
Zed with Bright Data

Erfahren Sie, wie Sie den KI-nativen Editor von Zed mit dem Web MCP von Bright Data verbinden können, um Echtzeit-Webzugriff, saubere Datenextraktion und webbasierte KI-Workflows direkt in Ihrer Entwicklungsumgebung zu ermöglichen.

In diesem Tutorial erfahren Sie:

  • Was Zed ist und wie sein KI-natives, agentenbasiertes Bearbeitungsmodell in einem modernen Code-Editor funktioniert.
  • Warum die Erweiterung von Zed um Echtzeit-Webinteraktion und Datenextraktionsfunktionen für eine genaue KI-gestützte Entwicklung unerlässlich ist.
  • Wie Sie Zed mit Bright Datas Web MCP verbinden, um einen webbasierten KI-Agenten zu ermöglichen, der live öffentliche Webdaten direkt im Editor abrufen und verwenden kann.

Lassen Sie uns loslegen!

Was ist Zed?

Zed Editor

Zed ist ein moderner, leistungsstarker Code-Editor, der auf Geschwindigkeit, Zusammenarbeit und KI-gestützte Entwicklung ausgelegt ist. Er wurde von Grund auf mit Fokus auf Reaktionsfähigkeit und geringer Latenz entwickelt, um das Codieren auch bei großen Codebasen unmittelbar und flüssig zu gestalten.

Zed ist vollständig in Rust geschrieben und so konzipiert, dass es mehrere CPU-Kerne und GPU-Beschleunigung effizient nutzt. Durch diese Designentscheidung bietet Zed schnelle Startzeiten, reibungslose UI-Interaktionen und minimale Eingabelatenz, was zentrale Aspekte der Entwicklererfahrung sind.

Zed ist für macOS, Linux und Windows verfügbar und bietet eine konsistente native Erfahrung auf allen Plattformen.

Zed enthält standardmäßig eine Vielzahl von Kernfunktionen für Entwickler, darunter

  • Native Git-Unterstützung für Staging, Committing, Pulling, Pushing und das Anzeigen von Diffs.
  • Debugging-Unterstützung auf Basis des Debug Adapter Protocol (DAP).
  • Unterstützung des Language Server Protocol (LSP) für mehrere Programmiersprachen.
  • Multibuffer-Bearbeitung zum Erstellen und Bearbeiten von Inhalten aus verschiedenen Dateien in einer einzigen Ansicht.
  • Integrierte Funktionen für die Zusammenarbeit, wie gemeinsame Bearbeitung, Chat und Bildschirmfreigabe.
  • Modale Bearbeitung im Vim-Stil für Entwickler, die einen modalen Workflow bevorzugen.

Warum Sie Zed mit Bright Data Web MCP optimieren sollten

Unabhängig davon, welches KI-Modell Sie in Zed verwenden, gibt es eine wesentliche Einschränkung: LLMs haben keinen Live-Zugriff auf das Internet. Ihre Antworten basieren auf Trainingsdaten, die einen Momentaufnahme darstellen und schnell veralten können.

Diese Einschränkung wird deutlich, wenn Sie mit sich weiterentwickelnden Dokumentationen, Tools oder Frameworks arbeiten. Ein KI-Assistent in einem Editor kann aktuelle Informationen nicht selbst überprüfen, Websites durchsuchen oder reale Inhalte extrahieren.

Stellen Sie sich nun vor, Sie erweitern den KI-Agenten von Zed um folgende Funktionen:

  • Live-Dokumentationsseiten lesen
  • Aktuelle Anleitungen und Referenzen abrufen
  • Inhalte von echten Websites zu durchsuchen und zu extrahieren

Diese Funktionen werden durch die Verbindung von Zed mit Bright Data Web MCP freigeschaltet. Bright Data Web MCP bietet über 60 KI-fähige Tools, die auf der KI-Infrastruktur von Bright Data basieren und KI-Agenten Echtzeit-Webinteraktionen und Datenabrufe ermöglichen.

Die beiden am häufigsten verwendeten Tools, die auch in der kostenlosen Version verfügbar sind, sind:

Tool Beschreibung
scrape_as_markdown Extrahiert Inhalte aus einer Webseite und gibt sauberes Markdown zurück, wobei Bot-Schutz und CAPTCHAs verarbeitet werden.
search_engine Ruft Suchergebnisse von Google, Bing oder Yandex im JSON- oder Markdown-Format ab.

Über die Kerntools hinaus bietet Web MCP viele erweiterte Optionen für die Browserinteraktion und die Extraktion strukturierter Daten. Die kostenlose Version bietet Zugriff auf die grundlegenden Tools, während der Pro-Modus den vollen Funktionsumfang für fortgeschrittenere Anwendungsfälle freischaltet.

Durch die Verbindung von Bright Data Web MCP mit Zed kann der KI-Agent mit Live-Webinhalten anstelle von statischem Wissen arbeiten, was zu einer genaueren und zuverlässigeren Unterstützung direkt im Editor führt.

So integrieren Sie Bright Data Web MCP in Zed

In diesem Abschnitt erfahren Sie:

  • Bright Data Web MCP als MCP-Server in Zed konfigurieren
  • den MCP-Server mit einem Bright Data API-Token authentifizieren
  • den KI-Agenten von Zed für den Zugriff auf Live-Webinhalte über MCP aktivieren
  • Überprüfen, ob die Integration korrekt funktioniert

Befolgen Sie die folgenden Schritte, um loszulegen!

Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie über Folgendes verfügen:

  • Ein unterstütztes Betriebssystem (macOS, Linux oder Windows)
  • Zed installiert und ausgeführt
  • Node.js installiert (neueste LTS-Version empfohlen)
  • Ein Bright Data-Konto mit einem API-Token

Sie müssen Bright Data nicht im Voraus einrichten. Die erforderliche Konfiguration wird in den folgenden Abschnitten Schritt für Schritt erläutert.

Obwohl nicht erforderlich, kann es hilfreich sein, über einige Vorkenntnisse zu verfügen, z. B.:

Schritt 1: Zed installieren und starten

Laden Sie Zed von der offiziellen Website herunter und installieren Sie es für Ihr Betriebssystem (macOS, Linux oder Windows).

Installing Zed

Öffnen Sie Zed nach der Installation über Ihr Anwendungsmenü und vergewissern Sie sich, dass der Editor ohne Fehler startet.

Sie sollten die Hauptoberfläche des Editors sehen und das Einstellungsfenster öffnen können. Wenn Zed erfolgreich gestartet ist, können Sie mit dem nächsten Schritt fortfahren.

Zed successfully installed and launched

Schritt 2: Aktivieren Sie KI und agentenbasierte Bearbeitung in Zed

Öffnen Sie die Einstellungen in Zed und navigieren Sie zum Abschnitt „LLM-Anbieter“.

Melden Sie sich bei Zed AI an oder konfigurieren Sie einen unterstützten Anbieter wie Anthropic, Google AI oder Amazon Bedrock, um KI-gestützte Funktionen zu aktivieren.

Configure LLM Provider in Zed

Sobald ein Anbieter aktiv ist, kehren Sie zum Editor zurück und öffnen Sie das KI- oder Chat-Fenster, um zu überprüfen, ob Eingabeaufforderungen akzeptiert und Antworten generiert werden. Wenn die KI innerhalb des Editors antwortet, wurde die agentenbasierte Bearbeitung erfolgreich aktiviert.

Testing Zed LLM Provider

Schritt 3: Richten Sie Bright Data Web MCP lokal ein

Um den Echtzeit-Webzugriff für den KI-Agenten von Zed zu aktivieren, müssen Sie Bright Data Web MCP auf Ihrem lokalen Rechner einrichten. Dieser MCP-Server fungiert als Brücke zwischen dem KI-Agenten und den Live-Webdaten.

Erstellen Sie zunächst ein Bright Data-Konto über das Bright Data-Dashboard. Wenn Sie bereits ein Konto haben, melden Sie sich einfach an.

Für eine schnelle Einrichtung öffnen Sie die Seite „MCP“ in Ihrem Konto und folgen Sie den Anweisungen:

MCP Setup Docs

Andernfalls führen Sie die folgenden Schritte aus:

Generieren Sie im Bright Data-Dashboard einen API-Token und bewahren Sie ihn sicher auf. Dieser Token wird vom Web-MCP-Server verwendet, um Anfragen zu authentifizieren und auf die Web-Tools von Bright Data zuzugreifen.

Für dieses Tutorial ist der API-Token die einzige Anmeldeinformation, die Sie benötigen.

Bright Data Web MCP läuft als lokaler Server mit Node.js. Installieren Sie es global, indem Sie den folgenden Befehl in Ihrem Terminal ausführen:

npm install -g @brightdata/mcp

Dadurch wird das Web-MCP-Paket installiert, mit dem Zed später eine Verbindung herstellen wird.

Starten Sie den Web-MCP-Server, indem Sie Folgendes ausführen:

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

Ersetzen Sie YOUR_BRIGHT_DATA_API_TOKEN durch Ihren tatsächlichen API-Token.

Bright Data Web MCP package installed successfully using npm.

Wenn der Server erfolgreich gestartet wurde, sollten Sie Protokollmeldungen sehen, die anzeigen, dass der MCP-Server läuft und bereit ist, Anfragen anzunehmen.

Bei der ersten Ausführung erstellt der Bright Data Web MCP-Server automatisch zwei erforderliche Zonen in Ihrem Bright Data-Konto: eine für Web Unlocker und eine für die Browser-API. Diese Zonen werden intern von Web MCP verwendet, um die verfügbaren Tools zu unterstützen.

Sie können deren Erstellung überprüfen, indem Sie den Abschnitt „Proxies & Scraping-Infrastruktur“ (Proxys und Scraping-Infrastruktur ) des Bright Data-Dashboards aufrufen. Wenn Ihr API-Token keinen Administratorzugriff hat, müssen die Zonen möglicherweise manuell erstellt und über Umgebungsvariablen referenziert werden.

Bright Data dashboard showing MCP-related zones

Standardmäßig stellt Web MCP nur die Tools „search_engine“ und „scrape_as_markdown“ zur Verfügung, die in der kostenlosen Version verfügbar sind. Durch die Aktivierung des Pro-Modus werden alle Tools freigeschaltet, einschließlich der erweiterten Browser-Automatisierung, wobei zusätzliche Kosten anfallen können.

Um auf erweiterte Funktionen wie Browser-Automatisierung und strukturierte Datenextraktion zugreifen zu können, aktivieren Sie den Pro-Modus, indem Sie PRO_MODE=true einstellen, bevor Sie den Web MCP-Server starten.

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

Sobald Sie sich vergewissert haben, dass der Server ordnungsgemäß läuft, stoppen Sie ihn vorerst. Zed wird so konfiguriert, dass es im nächsten Schritt automatisch startet und sich mit dem Web-MCP-Server verbindet.

Schritt 4: Konfigurieren Sie Bright Data Web MCP in Zed

Öffnen Sie die Einstellungen in Zed und navigieren Sie zum Abschnitt „Model Context Protocol (MCP) Servers“ (MCP-Server). Klicken Sie auf „Add Server“ (Server hinzufügen), um einen neuen lokalen MCP-Server zu registrieren.

Add Server Option in MCP

Wenn Sie dazu aufgefordert werden, definieren Sie den Bright Data MCP-Server, indem Sie den Befehl zum Ausführen des Web-MCP-Pakets (npx @brightdata/mcp) festlegen und die erforderliche Umgebungsvariable für die Authentifizierung (API_TOKEN) hinzufügen. Speichern Sie die Konfiguration, damit der MCP-Server für den KI-Agenten von Zed verfügbar ist.

Zed MCP server configuration template for registering a local MCP server.

Nach dem Hinzufügen wird Bright Data in der Liste „MCP-Server“ angezeigt, was bedeutet, dass Zed bereit ist, während KI-gestützter Workflows eine Verbindung zum Web-MCP herzustellen.

Bright Data Web MCP configured in Zed with the required command and environment variables.

Mit aktiviertem MCP-Server kann der KI-Agent von Zed nun die Web-Tools von Bright Data während KI-gestützter Workflows im Editor verwenden.

Tools available in Zed MCP

Schritt 6: Führen Sie eine reale Aufgabe in Zed aus

In diesem Schritt verwenden Sie den KI-Agenten von Zed zusammen mit Bright Data Web MCP, um Live-Webinhalte abzurufen, lokal zu speichern und ein kleines Skript auf der Grundlage realer Daten zu generieren.

Öffnen Sie das KI- oder Chat-Fenster von Zed (das gleiche, das Sie zuvor zum Testen der KI-Antworten verwendet haben).

  • Hier geben Sie Ihre Eingabe ein.
  • Sie sprechen jetzt mit dem KI-Agenten von Zed und schreiben keinen Code.

Kopieren Sie genau diese Eingabeaufforderung und fügen Sie sie in Zed ein:

Rufen Sie die Live-Dokumentationsseite unter
https://nodejs.org/en/docs

Verwenden Sie Bright Data MCP, um den Hauptinhalt der Dokumentation zu extrahieren und in sauberes Markdown zu konvertieren. Speichern Sie den extrahierten Inhalt als docs.md. Erstellen Sie dann eine kurze Zusammenfassung der Dokumentation und speichern Sie sie als summary.md. Erstellen Sie schließlich ein einfaches Node.js-Skript namens readDocs.js, das docs.md lädt und die ersten Zeilen ausgibt.

Nachdem Sie die Eingabeaufforderung abgeschickt haben, beobachten Sie, was passiert:

  • Der KI-Agent erklärt oder plant die Schritte, die er unternehmen wird
  • Er erkennt, dass ein Webzugriff erforderlich ist
  • Er wählt ein Bright Data MCP-Tool aus (in der Regel scrape_as_markdown)
  • Zed bittet Sie möglicherweise, die Ausführung des Tools zu genehmigen
Zed AI agent prompt requesting live documentation data using Bright Data MCP.

Überprüfen Sie nach Abschluss der Aufgabe, ob die generierten Dateien in Ihrem Projektverzeichnis vorhanden sind. Öffnen Sie die Markdown-Dateien, um zu überprüfen, ob sie Inhalte enthalten, die aus der Live-Dokumentationsseite extrahiert wurden.

Durch Ausführen des generierten Skripts sollten Daten aus dem gescrapten Inhalt ausgegeben werden, wodurch überprüft wird, ob der Workflow erfolgreich ausgeführt wurde.

Zed agent planning the task and selecting a Bright Data MCP tool for web access.

Fazit

In diesem Tutorial haben Sie gelernt, wie Sie Zed mit Bright Data Web MCP integrieren können, um Echtzeit-Webinteraktionen in einem KI-nativen Editor zu ermöglichen. Durch die Kombination des agentenbasierten Bearbeitungsmodells von Zed mit den Web-Tools von Bright Data haben Sie einen Workflow erstellt, in dem KI Live-Inhalte abrufen, lokal speichern und auf der Grundlage realer Daten nutzbare Codes und Dateien generieren kann.

Bright Data Web MCP eröffnet die Möglichkeit, zuverlässigere und kontextbewusste KI-gestützte Entwicklungs-Workflows zu erstellen, indem es Zugriff auf strukturierte, aktuelle Webdaten bietet. Dieser Ansatz trägt dazu bei, die Abhängigkeit von statischem Wissen zu verringern und die Genauigkeit der KI-generierten Ergebnisse zu verbessern.

Um weitere fortgeschrittene Anwendungsfälle für Agenten zu entdecken, werfen Sie einen Blick auf die umfassendere Bright Data-Plattform und ihre KI-fähigen Webdatenlösungen.

Sie können mit einem kostenlosen Bright Data-Konto beginnen und weiter mit Web MCP experimentieren, um Ihre eigenen KI-gesteuerten Entwicklungsworkflows zu optimieren.