# Shopify-Apps und -Themes mit KI bauen

> Shopify-APIs ändern sich oft, Agenten raten Felder und schreiben fehlerhaften Code.

Dieses Setup ist für Entwickler, die Shopify-Apps, Extensions oder Themes mit einem KI-Coding-Agenten bauen. Der Dev-MCP-Server von Shopify liefert Cursor oder Claude Code aktuelle Shopify-Dokumentation und GraphQL-Schemas, der GitHub-Server lässt den Agenten mit Branches und Pull Requests arbeiten. So prüft der Agent seinen Code gegen die echten Shopify-APIs statt gegen Felder aus älteren Versionen.

## Schritte

1. **Shopify Dev MCP hinzufügen**: Fügen Sie den Shopify-Dev-MCP-Server in Cursor oder Claude Code mit dem Befehl npx -y @shopify/dev-mcp@latest hinzu. Er braucht Node, aber keine Shopify-Anmeldung, da er öffentliche Doku und Schemas liefert. Lassen Sie den Agenten zum Test nach einem bekannten Thema wie Webhooks suchen.
   Tipp: Notieren Sie die verwendete API-Version im Projekt, damit der Agent das richtige Schema prüft.
2. **GitHub verbinden**: Fügen Sie den MCP-Server von GitHub hinzu, gehostet oder lokal mit einem Fine-grained Personal Access Token, der auf das Repository Ihrer App beschränkt ist. Erlauben Sie Code lesen, Branches anlegen und Pull Requests öffnen. Schützen Sie den Main-Branch, damit jede Änderung ein Review durchläuft.
   Tipp: Ein auf ein Repository begrenzter Token begrenzt den Schaden, falls er leakt.
3. **Mit echten Schemas bauen**: Beschreiben Sie die Funktion, etwa füge ein Produkt-Metafield hinzu und zeige es in einem Theme-App-Extension-Block. Lassen Sie den Agenten das Admin-GraphQL-Schema abfragen und seine Queries validieren, bevor er Code schreibt. Starten Sie die App lokal mit Shopify CLI auf einem Development Store und prüfen Sie den Pull Request.
   Tipp: Nennen Sie die Zielfläche wie Admin API, Storefront API, Functions oder Liquid, damit der Agent in der richtigen Doku sucht.

## Prompts zum Ausprobieren

- Such in der Shopify-Doku, wie man in einer Remix-App einen orders/create-Webhook registriert, und zeig mir den Code.
- Schreib eine Admin-GraphQL-Mutation, die ein eigenes Metafield an einem Produkt setzt, und validiere sie gegen das Schema.
- Füge einen Theme-App-Extension-Block hinzu, der das Metafield mit Pflegehinweisen des Produkts anzeigt.
- Prüfe alle GraphQL-Queries in diesem Repo gegen das aktuelle Admin-API-Schema und liste veraltete Felder auf.
- Leg einen Branch an, implementiere die Rabatt-Function aus docs/discount.md und öffne einen Pull Request.

## Was Sie brauchen

- Node.js für npx
- Ein Shopify-Partner-Konto und ein Development Store
- Cursor oder Claude Code
- Ein GitHub-Repository und ein eingeschränkter Access Token

## Grenzen

- Gültige Schemafelder garantieren keine korrekte Geschäftslogik. Tests und Reviews bleiben nötig.
- Der Agent kann sich nicht durch den Shopify-Admin klicken oder das Aussehen eines Themes prüfen. Das testen Sie selbst.
- Die Doku-Suche liefert Auszüge. Bei komplexen Themen müssen Sie eventuell den ganzen Leitfaden lesen.

## Sicherheitshinweise

- Dev MCP liest nur Doku und Schemas, der Shop bleibt unberührt.
- Pull Requests vor dem Deploy prüfen.

## MCP-Server

- [Shopify Dev MCP Server](https://shopify.dev/docs/apps/build/devmcp): docs-read, api-schema-read
- [GitHub MCP Server](https://github.com/github/github-mcp-server): repository-read, issue-write, pull-request-write

## Häufige Fragen

**Kann der Dev-MCP-Server meinen Shop ändern?**

Nein. Er durchsucht nur Dokumentation und liest API-Schemas. Änderungen am Shop kommen aus Ihrem App-Code, den Sie mit Shopify CLI und eigenen Zugangsdaten ausführen.

**Was kostet das?**

Der Shopify-Dev-MCP-Server ist kostenlos und läuft lokal über npx. Zum Testen brauchen Sie ein Shopify-Partner-Konto und einen Development Store, die Shopify kostenlos bereitstellt.

**Welche Editoren funktionieren?**

Cursor, Claude Code und andere MCP-Clients mit lokalen Servern. Claude Desktop geht auch, bringt ohne Zugriff auf Ihren Code aber weniger.

**Was ist mit Liquid-Themes?**

Der Server deckt neben den APIs auch Theme- und Liquid-Doku ab. Testen Sie Theme-Änderungen mit shopify theme dev auf einem Development Store, bevor Sie veröffentlichen.

## Tools

- **[Shopify](https://suiteintent.com/t/shopify?m=DE)**: Onlineshop aufbauen und betreiben. · Ideal für: Marken mit Onlineshop, Laden und Social Selling · Preis auf Anfrage · 1
- **[GitHub](https://suiteintent.com/t/github?m=DE)**: Code-Hosting, Issues und Pull Requests. · Ideal für: Teams mit Code-Review per Pull Request · Gratis-Tarif · 10000