Headless-Onlineshop für die Luchs-Destille
+90 % schnellere Ladezeiten, modernes Design & vollständig automatisierte Bestellprozesse
01. Die Herausforderung
Die bestehende WooCommerce-Seite war technisch in die Jahre gekommen: lange Ladezeiten, ein unübersichtlicher Checkout und fehlende Automatisierungen erschwerten den Verkauf der Spirituosen. Gleichzeitig wuchs das Sortiment und die Marke brauchte eine moderne Plattform, die sowohl Privat- als auch Geschäftskunden ein hochwertiges Einkaufserlebnis bietet. Zudem sollte die Pflege von Produkten, Varianten, Veranstaltungen und Blog-Inhalten deutlich effizienter werden.
02. Das Ziel
Ziel war der Relaunch eines modernen, performanten und zuverlässigen Online-Shops, der die Marke Luchs-Destille hochwertig präsentiert, Bestellungen automatisiert verarbeitet und einen einfachen Pflegeprozess für das Marketing- und Vertriebsteam bietet. Neben der UX-Verbesserung standen Geschwindigkeit, CMS-Flexibilität, SEO und eine reibungslose Zahlungsabwicklung im Fokus.
03. Die Lösung
Ich habe den Shop mit Gatsby und Strapi neu aufgebaut. Den Schwerpunkt bildeten Produkt- und Variantenpflege, Zahlungsabwicklung und automatisierte Abläufe nach einer Bestellung.
- Frontend: GatsbyJS + Tailwind für maximale Performance und eine elegante, dunkle Markenoptik.
- Backend: Strapi als Headless-CMS für Produkte, Varianten, Gutscheine, Blog-Artikel, Veranstaltungen & statische Inhalte.
- E-Commerce-Logik:
- vollständig automatisierte Rechnungs- und Stornierungs-PDFs inkl. Mail-Versand
- Varianten-Handling, Lagerbestände, Bundles
- Rabattcodes & Gutscheinsystem
- Zahlungsabwicklung: Anbindung der offiziellen PayPal API (inkl. CheckoutJS).
- Newsletter: Integration von Brevo, inkl. DSGVO-konformem Double-Opt-In.
- Optimierungen: Bildoptimierung, prerenderte Shopseiten, statisches Routing für ein schnelles und stabiles Einkaufserlebnis.
Das gesamte System wurde mit klaren Prozessen für das Team der Destillerie ausgestattet: einfache Produktpflege, übersichtliche Struktur und intuitive Redaktionsabläufe.
Du planst ein ähnliches Projekt? Erfahre mehr über meine individuelle E-Commerce-Entwicklung.
04. Ergebnis & Wirkung
Der neue Shop ging im Oktober 2023 live und zeigte sofort spürbare Effekte:
- Deutlich kürzere Ladezeiten, verbesserte Conversion und niedrigere Absprungraten
- Starker visuell konsistenter Markenauftritt, der perfekt zur hochwertigen Destille passt
- Volle Automatisierung von Bestell-, Rechnungs- und Stornierungsprozessen, was Zeit spart und Fehler reduziert
- Einfachere interne Pflege: Inhalte, Produkte, Blogartikel und Events können schnell und effizient bearbeitet werden
Die Destillerie wird seitdem laufend technisch betreut und weiterentwickelt.
"Unsere bisherige Internetpräsenz mit Online-Shop war von der Performance her in die Jahre gekommen. Sowohl Geschwindigkeit als auch die Übersichtlichkeit des Shops ließen stark zu wünschen übrig. Das EasyCode Team nahm sich intensiv die Zeit, unsere Änderungswünsche zu prüfen. Fachlich fundiert, aber dennoch leicht verständlich, rieten uns beide, eine neue Website mit Online-Shop aufzusetzen und für uns zu programmieren. Dabei überzeugten ein faires Preis-Leistungs-Verhältnis, die persönliche Abstimmung, das ästhetische Verständnis für unsere Spirituosenmarke, sowie die prompte Behebung von kleineren Problemen beim Serverwechsel bzw. auf der neuen Website. Fazit: Klare Weiterempfehlung. "
Tech Stack
Technische Umsetzung
Das System setzt auf eine Headless-Architektur mit Gatsby als statischem Frontend, das über inkrementelles Rebuild sowohl schnelle Deployments als auch aktuellste Shopdaten ermöglicht. Rechnungs- und Storno-PDFs werden serverseitig über einen Node-Workflow generiert und automatisiert per Webhook versendet.
Die PayPal-Integration basiert auf dem offiziellen SDK mit serverseitiger Order-Validierung. Produkt- und Variantenstrukturen sind in Strapi modular angelegt, inklusive Beziehungen für Bundles, Events, Kategorien und Blogposts.
Das Frontend nutzt Tailwind, PrimeReact-Komponenten und optimierte Gatsby-Images für maximale Geschwindigkeit. Alle Shop-Prozesse laufen über robuste API-Routen, die eng mit Strapi synchronisiert sind.
Für den laufenden Betrieb unterstütze ich dich außerdem bei Hosting und automatisierten Deployments.