Shopify App entwickeln: Eine ehrliche Anleitung 2025
•18 min Lesezeit

Shopify App entwickeln: Eine ehrliche Anleitung 2025

#Shopify Apps#Node.js#Private Apps#Development#API

Sie haben eine Idee für eine Shopify App? Vielleicht eine interne Lösung für Ihren eigenen Shop oder ein Produkt für den App Store? In diesem umfassenden Guide zeige ich Ihnen den kompletten Weg – von der ersten Idee bis zur produktionsreifen App.

Die drei Arten von Shopify Apps

Bevor wir in die Entwicklung einsteigen, müssen Sie verstehen, welche App-Typen es gibt:

1. Custom Apps (ehemals Private Apps)

Für wen? Einzelne Shops, die eine maßgeschneiderte Lösung brauchen.

  • ✅ Direkter API-Zugriff ohne Authentifizierungs-Flow
  • ✅ Keine App-Store-Review nötig
  • ✅ Volle Kontrolle über Funktionalität
  • ❌ Nur für einen Shop nutzbar
  • ❌ Keine Einnahmen durch andere Händler

Typische Anwendungsfälle:

  • ERP-Integration (SAP, Microsoft Dynamics)
  • Custom Dashboard mit Geschäftslogik
  • Automatisierte Workflows (Lagerbestand, Rechnungen)

2. Public Apps (App Store)

Für wen? Entwickler, die eine Lösung für viele Händler anbieten wollen.

  • ✅ Skalierbare Einnahmen (Abo-Modelle)
  • ✅ Millionen potenzieller Kunden
  • ✅ Shopify-Marketing-Support
  • ❌ Strenge Review-Prozesse
  • ❌ 20% Revenue Share an Shopify
  • ❌ Komplexere Architektur (OAuth, Webhooks)

3. Unlisted Apps

Für wen? Agenturen, die Apps für mehrere Kunden entwickeln.

  • ✅ Wiederverwendbare Lösung
  • ✅ Kein App-Store-Review
  • ✅ Flexibles Pricing
  • ❌ Manueller Installationslink nötig
  • ❌ Kein Marketplace-Exposure

Der Tech-Stack 2025

Das offizielle Shopify Stack

Shopify empfiehlt und unterstützt folgende Technologien:

Frontend:  React + Polaris (Shopify's Design System)
Backend:   Node.js + Express oder Remix
Database:  PostgreSQL oder MongoDB
Hosting:   Vercel, Railway, Fly.io
Auth:      @shopify/shopify-api (OAuth 2.0)

Shopify CLI: Ihr bester Freund

Die Shopify CLI ist das zentrale Werkzeug für die App-Entwicklung:

# Neue App erstellen
npm init @shopify/app@latest

# Entwicklungsserver starten
npm run dev

# App deployen
npm run deploy

Die CLI generiert automatisch:

  • OAuth-Flow
  • Session Management
  • Polaris-Integration
  • Webhook-Handler
  • App Bridge für eingebettete Apps

Die Shopify APIs verstehen

Admin API (GraphQL)

Die wichtigste API für Backend-Operationen:

# Produkte abrufen
query {
  products(first: 10) {
    edges {
      node {
        id
        title
        variants(first: 5) {
          edges {
            node {
              price
              inventoryQuantity
            }
          }
        }
      }
    }
  }
}

Rate Limits:

  • Standard: 1000 Punkte/Sekunde
  • Plus: 2000 Punkte/Sekunde

Storefront API

Für Kundenseitige Anwendungen (Headless, PWA):

  • Öffentlich zugänglich (mit Storefront Access Token)
  • Lese-Zugriff auf Produkte, Collections
  • Cart-Management
  • Customer Account API

Webhook-Subscriptions

Webhooks sind essentiell für reaktive Apps:

// Webhook für neue Bestellungen
app.post('/webhooks/orders/create', async (req, res) => {
  const order = req.body;
  
  // Ihre Geschäftslogik
  await processNewOrder(order);
  
  res.status(200).send('OK');
});

Wichtige Webhooks:

  • orders/create – Neue Bestellung
  • products/update – Produktänderung
  • app/uninstalled – App deinstalliert
  • customers/data_request – DSGVO-Anfrage

App-Architektur Best Practices

1. Embedded vs. Standalone

Embedded Apps (empfohlen):

  • Läuft innerhalb des Shopify Admin
  • Nutzt App Bridge für nahtlose UX
  • Single Sign-On automatisch

Standalone Apps:

  • Eigene Domain
  • Volles Design-Control
  • Komplexerer Auth-Flow

2. Session Storage

Shopify-Sessions müssen persistent gespeichert werden:

import { shopifyApp } from '@shopify/shopify-app-express';
import { PrismaSessionStorage } from '@shopify/shopify-app-session-storage-prisma';

const shopify = shopifyApp({
  sessionStorage: new PrismaSessionStorage(prisma),
  // ...
});

3. Background Jobs

Für lange Operationen nutzen Sie Queues:

// Bull.js für Background Jobs
const queue = new Bull('sync-products');

queue.process(async (job) => {
  const { shopDomain } = job.data;
  await syncAllProducts(shopDomain);
});

Kosten und Zeitaufwand

Entwicklungskosten (realistisch)

| App-Typ | Zeitaufwand | Kosten (Agentur) | |---------|-------------|------------------| | Simple Custom App | 40-80h | €4.000 - €8.000 | | Komplexe Custom App | 120-200h | €12.000 - €25.000 | | Public App (MVP) | 200-400h | €25.000 - €50.000 | | Public App (Full) | 400-800h | €50.000 - €100.000 |

Laufende Kosten

  • Hosting: €20-100/Monat (Vercel, Railway)
  • Database: €20-50/Monat (PlanetScale, Supabase)
  • Monitoring: €0-50/Monat (Sentry)
  • Shopify Partner Gebühren: Kostenlos (20% Revenue Share bei App Store)

Der App Store Review Prozess

Wenn Sie eine Public App entwickeln, müssen Sie durch das Review:

1. Technische Anforderungen

  • ✅ HTTPS überall
  • ✅ Korrekter OAuth-Flow
  • ✅ GDPR-Webhooks implementiert
  • ✅ Keine deprecated APIs
  • ✅ Performance unter 3s Ladezeit

2. UX/Design Anforderungen

  • ✅ Polaris-konformes Design
  • ✅ Responsive Layout
  • ✅ Accessibility (WCAG 2.1)
  • ✅ Klare Onboarding-Experience

3. Business Anforderungen

  • ✅ Transparentes Pricing
  • ✅ Funktionierender Support-Kanal
  • ✅ Privacy Policy
  • ✅ Terms of Service

Timeline: 2-6 Wochen für das erste Review

Monetarisierung

Pricing-Modelle

  1. Subscription (beliebt)

    • "Starter: $9/Monat"
    • "Pro: $29/Monat"
    • "Enterprise: Custom"

  2. Usage-Based

    • "Pro Bestellung: $0.10"
    • "Pro API-Call: $0.001"

  3. Freemium

    • Kostenlose Basis-Features
    • Premium-Upgrade

Shopify Billing API

Nutzen Sie die eingebaute Billing API für nahtlose Abrechnung:

const response = await client.request(
  `mutation {
    appSubscriptionCreate(
      name: "Pro Plan"
      lineItems: [{
        plan: {
          appRecurringPricingDetails: {
            price: { amount: 29.00, currencyCode: USD }
          }
        }
      }]
      returnUrl: "${process.env.HOST}/billing/confirm"
    ) {
      confirmationUrl
    }
  }`
);

Häufige Fehler vermeiden

1. Rate Limits ignorieren

Implementieren Sie immer Retry-Logic mit exponential Backoff.

2. Webhooks nicht verifizieren

Sicherheitsrisiko! Verifizieren Sie jeden Webhook mit HMAC:

const verified = shopify.webhooks.validate({
  rawBody: req.rawBody,
  hmac: req.headers['x-shopify-hmac-sha256'],
});

3. Keine Offline-Tokens

Speichern Sie Offline Access Tokens für Background-Jobs.

4. Schlechtes Error Handling

Shopify-APIs geben detaillierte Fehlermeldungen – nutzen Sie diese!

Fazit

Shopify App-Entwicklung ist komplex, aber lohnend. Starten Sie mit einer Custom App für einen einzelnen Shop, um die APIs zu lernen. Erst wenn Sie die Grundlagen beherrschen, wagen Sie sich an Public Apps.

Mein Tipp: Nutzen Sie die offiziellen Shopify-Tutorials und die Partner-Community. Dort finden Sie Antworten auf fast jede Frage.

Brauchen Sie Unterstützung bei Ihrer Shopify App? Kontaktieren Sie mich für ein unverbindliches Gespräch. Ich helfe Ihnen von der Konzeption bis zum Launch.

Justin Kreutzmann

Über den Autor

Justin Kreutzmann ist Experte für Shopify-Entwicklung und E-Commerce-Skalierung. Er hilft Marken dabei, technische Grenzen zu überwinden und performante Online-Shops zu bauen.

Zusammenarbeiten →