Wie stellt man Shopware Composable Frontend mit Vercel bereit?

Shopware Composable Frontend
Composable Storefront, Ecommerce, Shopware, Shopware 6, Vercel

Composable Frontend ist ein moderner Ansatz zum Aufbau schneller und skalierbarer eCommerce-Storefronts in Shopware. Mit Vercel können Sie die Vorteile des effizienten Hostings und der CI/CD-Funktionen von Vercel nutzen, wenn Sie Composable Frontend mit Vercel einsetzen. Folgen Sie einer Schritt-für-Schritt-Anleitung, um Ihr Shopware Composable Frontend auf Vercel zum Laufen zu bringen.

Voraussetzungen

Bevor Sie beginnen, vergewissern Sie sich, dass Sie die folgenden Informationen haben:

  • Eine Shopware 6-Instanz einrichten
  • Node.js (Version 16 oder höher) installiert
  • Git installiert und konfiguriert
  • Ein Vercel-Konto
  • Shopware PWA (Composable Frontend) lokal installiert

Schritt 1: Klonen des Shopware Composable Frontend Repository

Stellen Sie sicher, dass Sie das Composable Frontend installiert haben, falls Sie dies noch nicht getan haben. Sie müssen entweder das offizielle Repository klonen oder der “Lokale Installation von Composable Storefront” Blog. Danach gehen Sie in den Vorlagenordner.

Schritt 2: Abhängigkeiten installieren

Führen Sie den folgenden Befehl aus, um die erforderlichen Abhängigkeiten zu installieren:

Schritt 3: Umgebungsvariablen konfigurieren

Erstellen Sie eine .env-Datei im Stammverzeichnis Ihres Projekts und fügen Sie Ihre Shopware-API-Anmeldedaten hinzu:

SHOPWARE_API_URL=https://your-shopware-instance.com
SHOPWARE_ACCESS_KEY=your-access-key

Schritt 4: Lokaler Test

Vergewissern Sie sich, dass alles korrekt funktioniert, bevor Sie es einsetzen:

Besuchen Sie http://localhost:3000 um zu überprüfen, ob das Frontend ordnungsgemäß läuft.

Schritt 5: Code auf GitHub veröffentlichen

Initialisieren Sie ein Git-Repository und stellen Sie Ihren Code auf GitHub ein:

git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/your-username/composable-frontend.git
git push -u origin main

Schritt 6: Bereitstellung in Vercel

  • Anmelden bei Vercel und klicken Sie auf Neues Projekt.
  • Importieren Sie Ihr GitHub-Repository.
  • Konfigurieren Sie die Umgebungsvariablen in Vercel:
    SHOPWARE_API_URL
    SHOPWARE_ACCESS_KEY

Schritt 7: Verifizierung des Einsatzes

Nach der Bereitstellung erhalten Sie von Vercel eine Live-URL. Öffnen Sie die URL, um zu überprüfen, ob Ihr Shopware Composable Frontend korrekt funktioniert.

Schritt 8: Automatische Bereitstellungen aktivieren (optional)

So aktivieren Sie die automatische Bereitstellung für künftige Updates:

  • Pushen Sie die Änderungen in Ihr GitHub-Repository, und Vercel wird Ihr Projekt automatisch neu bereitstellen.

Bitte kontaktieren Sie uns unter manish@bay20.com oder rufen Sie uns an unter +91-8800519180 / +91-9582784309 für jegliche Unterstützung im Zusammenhang mit Shopware. Sie können auch die Shopware-Entwicklungsseite um unsere Dienstleistungen zu überprüfen.