+170 XP

Plugins und Ökosystem-Integrationen

# Plugins und Ökosystem-Integrationen

Claude liefert die beste Arbeit, wenn es in dem Tool sitzt, das Sie bereits offen haben, und nicht in einem Browser-Tab, zu dem Sie ständig wechseln. Diese Lektion kartiert jede Stelle, an der Claude sich einhängt: Ihren Editor, Ihren Desktop, Ihr Slack, Ihre Repos und die Connector-Schicht, die alles zusammenhält. Danach richten wir die VS-Code-Integration von A bis Z ein und ziehen eine klare Linie, ab wann sich eine Integration gegenüber Copy-Paste lohnt.

Die Integrationsfläche im Überblick

Stellen Sie sich Claude mit drei „Körpern“ vor, in die Sie es installieren können.

Die Claude-Apps. Web, Desktop und Mobile teilen denselben Kern: Projects (dauerhafte Kontext-Container), Artifacts (lebende, editierbare Outputs), Styles (wiederverwendbare Ton- und Format-Presets) und Skills (gebündelte Anweisungen plus Dateien, die Claude bei Bedarf lädt). Die Desktop-App ist hier am wichtigsten, weil sie Connectors und lokale MCP-Server ausführen kann, was die Web-App nicht erreicht.

Claude Code. Ein terminal-nativer Agent, der Ihr echtes Dateisystem liest und bearbeitet, Befehle ausführt und mit Ihrer git-Historie arbeitet. Genau das treibt die IDE-Extensions an.

Die API-Schicht. Die Anthropic Messages API und das Claude Agent SDK für den Fall, dass Sie Ihre eigene Fläche bauen statt die von Anthropic zu nutzen.

Das Bindegewebe über alle drei hinweg ist MCP (Model Context Protocol), ein offener Standard, um einem Modell Tools und Daten zugänglich zu machen. Ein „Connector“ in den Claude-Apps ist unter der Haube meist ein MCP-Server. Lernen Sie MCP einmal, und dasselbe mentale Modell gilt, ob Sie in der Desktop-App, in Claude Code oder in Ihrem eigenen SDK-Build unterwegs sind. Die Spezifikation liegt unter modelcontextprotocol.io.

Connectors und der Marketplace

Ein Connector erlaubt Claude, aus einem externen System zu lesen und darin zu handeln: Ihr Google Drive, ein Notion-Workspace, eine Postgres-Datenbank, ein Sentry-Projekt. Anthropic liefert eine Reihe eigener Connectors und betreibt ein Connector-Verzeichnis; viele davon sind von der Community gebaute MCP-Server, auf die Sie Claude zeigen lassen.

Zwei Varianten sind relevant:

  • Remote Connectors (gehostet, OAuth-basiert) funktionieren in der Web- und Desktop-App. Gut für SaaS-Tools.
  • Lokale MCP-Server laufen auf Ihrer Maschine und brauchen die Desktop-App oder Claude Code. Gut für lokale Dateien, Datenbanken und interne Tools, die Sie nicht ins Internet stellen wollen.

Diese Unterscheidung (remote vs. lokal) entscheidet, nach welchem „Körper“ von Claude Sie greifen. Lokale Daten heißt Desktop oder Claude Code, nicht Web-App.

Die VS-Code-Integration einrichten

Machen wir den konkreten Fall. Die Claude Code Extension bringt den Agenten direkt in VS Code, sodass er Ihre offenen Dateien, Ihre Auswahl und Ihre Diagnostics sieht und dann Änderungen vorschlägt, die Sie inline prüfen.

Installation

Sie brauchen zuerst die Claude Code CLI, danach hängt sich die Extension daran.

bash
# Install Claude Code (macOS / Linux)
curl -fsSL https://claude.ai/install.sh | bash

# Verify, then authenticate
claude --version
claude   # first run opens a browser to log in

Öffnen Sie dann in VS Code das Extensions-Panel, suchen Sie Claude Code und installieren Sie die offizielle Anthropic-Extension. Sie erkennt die CLI automatisch. JetBrains-Nutzer bekommen ein paralleles Plugin aus dem JetBrains Marketplace; der Workflow unten ist nahezu identisch.

Nach der Installation haben Sie ein Claude-Panel in der Sidebar und ein Tastenkürzel, um die aktuelle Auswahl oder Datei in den Kontext zu schicken. Der entscheidende Unterschied zur Web-App: Claude sieht jetzt das echte Projekt, nicht ein eingefügtes Snippet. Es kann Nachbardateien öffnen, Ihre package.json lesen und Ihren Test-Befehl ausführen.

Mit einer Projekt-Konfiguration eingrenzen

Legen Sie eine CLAUDE.md-Datei ins Repo-Root. Das sind die dauerhaften Anweisungen des Projekts, die in jeder Session automatisch geladen werden. Es ist die Datei mit dem größten Hebel im gesamten Setup.

markdown
# Project: billing-service

## Stack
- TypeScript, Node 20, Fastify, Prisma, Postgres
- Tests: vitest. Run with `npm test`.

## Conventions
- No `any`. Prefer explicit return types on exported functions.
- All money values are integer cents, never floats.
- DB access goes through `src/db/`, never inline Prisma in routes.

## Before you finish
- Run `npm run lint && npm test` and report results.

Wenn Sie jetzt sagen „füge einen Refund-Endpoint hinzu“, kennt Claude bereits Ihren Stack, Ihre Geldbetrag-Regel und weiß, dass es vor dem Erfolgsmeldung Lint und Tests laufen lassen soll. Sie erklären den Kontext nicht mehr bei jedem Prompt neu.

Einen lokalen MCP-Server hinzufügen

Angenommen, Claude soll Ihre Dev-Datenbank direkt in VS Code abfragen. Registrieren Sie einen MCP-Server mit Projekt-Scope:

bash
claude mcp add postgres-dev \
  --env DATABASE_URL="postgres://localhost:5432/billing_dev" \
  -- npx -y @modelcontextprotocol/server-postgres

Danach funktioniert „zeig mir das Schema der invoices-Tabelle und schreibe eine Migration, die eine Spalte refunded_at hinzufügt“ gegen Ihr laufendes Dev-Schema, ohne die Ausgabe von \d invoices zu kopieren. Der Server läuft lokal, der Connection String verlässt Ihre Maschine also nie.

Claude Code in VS Code: Full Setup & Workflow

Watch on YouTube

Die GitHub-Integration

Die GitHub-Integration bringt Claude von „in Ihrem Editor“ zu „in Ihrer Pipeline“. Installieren Sie die Claude GitHub App auf einem Repo, und Sie können @claude in einem Issue oder PR-Kommentar taggen: Es öffnet einen Branch, schreibt die Änderung und pusht einen PR, oder es reviewt einen bestehenden PR und hinterlässt Inline-Kommentare.

Das ist das sauberste Beispiel dafür, wie eine Integration die Web-App schlägt. Das Modell handelt dort, wo die Arbeit schon liegt: im Diff, in den CI-Logs, im Review-Thread. Nichts wird irgendwohin kopiert. Sie verkabeln es mit einem GitHub-Actions-Workflow und Ihrem Anthropic API Key als Repo Secret. Nutzen Sie es für das Triagieren von Issues, für erste PR-Entwürfe bei gut spezifizierten Tickets und für automatisierte Reviews per Label.

Slack und Team-Flächen

Die Claude-Slack-Integration setzt Claude in einen Channel oder DM, wo es den Thread lesen kann, in dem es erwähnt wurde, und mit Ihrem verbundenen Kontext antwortet. Kombinieren Sie das mit Connectors (etwa einem Notion- oder Drive-Connector), und „@Claude fasse die Entscheidung in diesem Thread zusammen und entwirf das Update für #eng-announce“ wird zur Ein-Nachricht-Aufgabe.

Das Muster lässt sich verallgemeinern: Jede Fläche, auf der Ihr Team schon redet oder arbeitet, ist ein Kandidat. Der Wert liegt nicht in einem schlaueren Modell, sondern darin, dass der Schritt des Kontextsammelns wegfällt, den der Mensch sonst von Hand machen würde.

Wissenscheck

1. Was ist die Hauptrolle von MCP (Model Context Protocol) über Claudes verschiedene Flächen hinweg?

2. Claude soll eine lokale Postgres-Datenbank und interne Dateien lesen und darauf handeln, die nicht ins Internet gelangen sollen. Nach welcher Fläche greifen Sie?

3. Warum ist die Desktop-App bei bestimmten Integrationen wichtiger als die Web-App?

MEHRFACHAUSWAHL

4. Wählen Sie ALLE Aussagen, die den Unterschied zwischen Remote Connectors und lokalen MCP-Servern korrekt beschreiben.

Wählen Sie alle richtigen Antworten aus.

MEHRFACHAUSWAHL

5. Wählen Sie ALLE der folgenden Punkte, die gemeinsame Fähigkeiten der Claude-Apps (Web, Desktop, Mobile) sind.

Wählen Sie alle richtigen Antworten aus.

Wann eine Integration Copy-Paste schlägt

Hier ist die Entscheidungsregel. Die Web-App ist ein guter Notizblock. Eine Integration gewinnt, sobald einer dieser Punkte zutrifft:

1. Der Kontext ist groß oder liegt in vielen Dateien. Zwölf Dateien in einen Chat zu kopieren ist verlustbehaftet, und eine vergessen Sie garantiert. Die IDE-Integration liest das Repo. Genau die Kosten des manuellen Kontext-Zusammenbaus fallen mit der Integration weg.

2. Der Output muss an einer bestimmten Stelle landen. Ein PR, eine Slack-Nachricht, eine Datenbankzeile, eine bearbeitete Datei. Wenn Sie Claudes Antwort ohnehin kopieren und in ein anderes Tool einfügen, entfernt eine Integration, die direkt dorthin schreibt, eine Fehlerquelle (das Copy-Paste, bei dem Sie Formatierung verlieren oder den falschen Block greifen).

3. Die Aufgabe wiederholt sich. „Prüfe jeden PR gegen unsere Regel für Geldbeträge“ ist eine GitHub Action wert. Eine einmalige Frage nicht. Automatisieren Sie die Schleife, nicht den Einzelfall.

4. Die Daten dürfen Ihre Maschine oder Ihre Organisation nicht verlassen. Lokale MCP-Server und die Desktop-App halten alles im Haus. Die Web-App heißt, dass Daten in Ihre Browser-Session wandern.

Wenn KEINER dieser Punkte zutrifft (eine schnelle Einzelfrage, ein Brainstorming, ein Snippet, das klein genug zum Einfügen ist), ist die Web-App tatsächlich das richtige Werkzeug. Bauen Sie nicht zu viel. Der Overhead einer Integration (Config-Dateien, Auth, MCP-Server) zahlt sich nur aus, wenn Kontext, Ziel oder Wiederholung im Spiel sind.

Ein durchgerechneter Vergleich

Sie müssen Input-Validierung zu einer Route hinzufügen.

  • Copy-Paste-Weg: Route einfügen, Schema-Datei einfügen, Docs der Validierungs-Library einfügen, Konvention beschreiben, Antwort zurückkopieren, den falsch geratenen Import-Pfad korrigieren, Tests selbst laufen lassen.
  • VS-Code-Integrationsweg: „Füge der Route POST /refunds Validierung nach unseren Konventionen hinzu.“ Claude liest die Route, das Schema und CLAUDE.md, schreibt die Änderung mit korrekten Imports, führt npm test aus und meldet zurück. Sie prüfen den Diff.

Der zweite Weg ist nicht klüger. Es ist dasselbe Modell, nur ohne Reibung.

Eine eigene Fläche bauen

Wenn keine bestehende Integration passt, bauen Sie eine mit dem Agent SDK. Das ist die Notausgangsluke: Sie behalten Claudes Tool-Use- und MCP-Fähigkeiten, verpacken sie aber in Ihre eigene App, Ihren Cronjob oder Ihren internen Service.

python
import anthropic

client = anthropic.Anthropic()

resp = client.messages.create(
    model="claude-sonnet-4-5",
    max_tokens=1024,
    messages=[{
        "role": "user",
        "content": "Summarize today's failed payments and flag any over $500.",
    }],
)
print(resp.content[0].text)

Das ist die rohe Messages API. Das Agent SDK setzt darauf auf und gibt Ihnen dieselbe Agent-Schleife, dasselbe Tool Calling und dieselbe MCP-Unterstützung, die Claude Code nutzt, sodass ein Nachtskript erledigen kann, was Sie sonst von Hand in der App machen würden. Die Startpunkte und der SDK-Quellcode liegen unter github.com/anthropics.

Das mentale Modell: Apps zum Denken, Claude Code und IDE-Extensions zum Bauen, das SDK, um die Schleife in Ihre eigene Infrastruktur zu bringen. MCP ist die Leitung, die Ihre Tools mit allen drei verbindet.

Zentrale Erkenntnisse

  • Passen Sie die Fläche an die Daten an. Remote-SaaS-Connectors funktionieren in der Web-App; lokale Dateien und Datenbanken brauchen die Desktop-App oder Claude Code. Kämpfen Sie nicht gegen diese Grenze.
  • Schreiben Sie eine `CLAUDE.md` für jedes Repo. Es ist der Schritt mit dem größten Hebel im IDE-Setup; er beseitigt den Kontext, den Sie sonst bei jedem Prompt neu eintippen.
  • Nutzen Sie die Vier-Punkte-Regel (großer Kontext, bestimmtes Ziel, wiederholte Aufgabe oder Daten, die nicht raus dürfen), um zwischen Integration und Web-App zu entscheiden. Trifft keiner zu, nehmen Sie einfach die Web-App.
  • Greifen Sie zur GitHub-Integration und zu Slack, wenn die Arbeit schon in einem PR oder Thread liegt, damit Claude an Ort und Stelle handelt statt Sie Output herumkopieren zu lassen.
  • Lernen Sie MCP einmal. Dasselbe Protokoll liegt Connectors, Claude-Code-Servern und Ihren eigenen Agent-SDK-Builds zugrunde, die Fähigkeit überträgt sich auf jede Fläche.

Was Sie aus dieser Lektion umsetzen

Diese Maßnahmen sind im Playbook der Rolle zusammengefasst.

  • Eine CLAUDE.md anlegen mit Test-Befehl, Konventionen und Off-limits-Verzeichnissen
Vollständiges Action Playbook ansehen