Bright Stone Ceramics

Eigenprojekt · React → Shopify-Migrationsstudie

Ein persönliches Projekt zur Auseinandersetzung mit E-Commerce-Plattformentscheidungen – zunächst als eigenes React-Frontend entwickelt, dann zu Shopify migriert, um zu zeigen, wann eine verwaltete Plattform einem kleinen Unternehmen besser dient als ein individuelles Entwicklungsprojekt. Das richtige Werkzeug für den richtigen Kontext.


Überblick

Bright Stone Ceramics – Shopify-Aufbau

Ein konzeptioneller E-Commerce-Shop für ein kleines Keramikunternehmen, der dazu dient, eine in der Webarbeit immer wieder auftauchende Frage zu untersuchen: Wann dient ein individuelles React-Frontend einem Kunden besser als eine verwaltete Plattform wie Shopify – und wann nicht? Beide Versionen zu bauen lieferte eine direkte, praktische Antwort.

„Das React-Frontend zuerst zu bauen hat mir ein klares Verständnis davon gegeben, was Shopify von Haus aus mitbringt – und warum das für ein kleines Unternehmen wichtig ist, das seinen Shop ohne Entwicklerbeteiligung verwalten muss.“

Herkunft

  • Eigenprojekt
  • Konzept-Shop

Meine Rolle

  • React-Frontend
  • Shopify-Theme
  • Migration

Stack

  • React → Shopify
  • Liquid
  • Custom CSS

Umfang

  • Startseite
  • Produkte
  • Warenkorb

Passwort: zintow


Zuerst die React-Version

Das individuelle Frontend

Der Shop wurde zunächst als individuelles React-Frontend entwickelt – komponentenbasiert, vollständig kontrolliert, mit einer klaren Trennung der Zuständigkeiten. Diese Version funktionierte technisch gut, warf aber sofort eine praktische Frage auf: Wer pflegt sie, wenn die Entwicklerin nicht verfügbar ist?

React-Aufbau – eigene Komponenten, volle Frontend-Kontrolle

  • Komponentenbasierte Architektur – Produktkarte, Warenkorb und Navigation als wiederverwendbare React-Komponenten
  • State-Management für den Warenkorb – Hinzufügen, Entfernen und Mengenanpassung ohne Seitenneuladung
  • Sauberer, wartbarer Code – aber jede Inhaltsänderung erfordert eine Entwicklerin

Die Migrationsentscheidung

Warum Shopify die bessere Wahl war

React-Frontend

Individueller Aufbau

  • Volle Designkontrolle
  • Individuelle Komponentenlogik
  • Entwicklerin für Updates erforderlich
  • Kein eingebautes CMS oder Admin-Bereich
  • Zahlung/Checkout selbst entwickelt

Shopify

Verwaltete Plattform

  • Kundin verwaltet Inhalte selbständig
  • Eingebautes Produkt- und Bestellmanagement
  • Sicherer Checkout von Haus aus
  • Theme ohne Code anpassbar
  • Skalierbar ohne Entwicklerbeteiligung

Für eine Kleinunternehmerin, die Keramik verkauft, schuf die React-Version eine Abhängigkeit, die ihr nicht diente. Shopify hat diese Abhängigkeit aufgelöst – die Kundin besitzt ihren Shop, verwaltet ihre Produkte und wickelt Zahlungen ab, ohne eine Entwicklerin auf Abruf zu benötigen.


Shopify-Aufbau

Theme-Entwicklung und Umfang

Umfang: Startseite, Produktseiten und Warenkorb fertiggestellt

  • Individuelle Liquid-Templates für Startseite, Kollektions- und Produktseiten – strukturiert für die Inhaltsverwaltung durch den Kunden
  • CSS Custom Properties für Markenfarben und Typografie – konsistent mit dem visuellen Design der React-Version
  • Warenkorb in funktionsfähigem Zustand – Artikel hinzufügen, Menge anpassen, entfernen, laufende Gesamtsumme
  • Durchgehend mobiles, responsives Layout

Projektumfang: Startseite, Produktseiten und Warenkorb fertiggestellt. Checkout-Prozess nicht implementiert – der Fokus dieses Projekts lag auf dem Plattformvergleich und der Theme-Entwicklung, nicht auf der Zahlungsintegration.


Gezeigte Kompetenzen

Was dieses Projekt zeigt

React-Komponentenarchitektur und State-Management · Shopify-Liquid-Templating · CSS in zwei unterschiedlichen Entwicklungsumgebungen · Plattformbewertung und Migrationsentscheidungen · Verständnis dafür, wann ein verwaltetes CMS einem Kunden besser dient als ein individueller Aufbau – direkt relevant für CMS-Management-Arbeit.


Hinweis: Alle Inhalte auf dieser Seite sind fiktiv und dienen ausschließlich der Demonstration des Website-Designs. Produktfotos von Tom Crew auf Unsplash sowie mit freundlicher Genehmigung von Turning Earth Ceramics. Weitere Fotos von Taylor Heery und Anne Nygard auf Unsplash.