impzz
Shopify-Front-End- und Full-Stack-Entwickler
Fünf Jahre Front-End, seit 2024 auf Shopify spezialisiert. Vor allem Liquid-Themes und Kampagnenseiten, die das Team selbst pflegt, dazu eine eigenständig entwickelte Shopify-App, GA4-Tracking und Performance-Arbeit.
- Front-End
- 5 Jahre
- Shopify
- Seit 2024
- Offen für Stellen
- Shenzhen
01 / 07 · Liquid-Kampagnenseite
Was Stellenanzeigen verlangen und wo man es sieht
Jede Zeile öffnet etwas Echtes. „Live-Shop“ steht für anonymisierte Arbeit aus meinem Job, „PORTVA“ für diesen Konzept-Shop.
Liquid · OS 2.0
PORTVA
Eine Kampagnenseite aus Sections und Blocks, im Theme-Editor bearbeitbar und sortierbar.
Seite ansehen →Shopify-App · Datengetriebene Seiten
Live-Shop
Eine interne App prüft, veröffentlicht und rollt Daten zurück, neue Seiten brauchen keine Theme-Änderung.
Fall lesen →GA4-Tracking · Attribution
Live-Shop
Kampagnen und Aktionen starten mit Event-Funnel und Bestellzuordnung, damit das Ergebnis messbar ist.
Fall lesen →Shopify Functions
PORTVA
Eine Cart-Validation-Function stoppt Bestellungen mit falschem Stecker im Checkout.
Fall lesen →Webhooks · Back-End
PORTVA
HMAC-Prüfung, und ein Bestandsereignis wird auch bei doppelter oder gleichzeitiger Zustellung nur einmal verarbeitet.
Fall lesen →Shopify Markets
PORTVA
Ein fester Preis pro Markt, einheitlich auf Produktseite, im Warenkorb und im Checkout.
Fall lesen →Headless · Storefront API
PORTVA
Ein vollständiger Next.js-16-Storefront, der sich den Katalog mit dem Liquid-Theme teilt.
Shop öffnen →Performance · Core Web Vitals
PORTVA
PageSpeed 95 auf der mobilen Startseite, mit erhaltenem Echtzeit-3D.
Bericht ansehen →
Was ich in PORTVA gebaut habe
PORTVA ist eine fiktive Lademarke, die zeigt, was mein Arbeitsalltag nicht abdeckt.
- Liquid-Theme: Online-Store-2.0-Sections und -Blocks, selbst pflegbare Kampagnenseiten, Sprachen und Märkte
- Shopify-Back-End: Cart-Validation-Function, Bestands-Webhook, Metaobject-Speicher
- Headless-Storefront: Next.js 16, Storefront API, Warenkorb und Test-Checkout
- Katalog als Code: Produkte, Varianten, Bestand, Märkte und Übersetzungen per Skript
- 3D-Pipeline: Blender-Modelle per Skript → GLB im Shopify-CDN → Echtzeit-WebGL
- Produkt- und Markenkonzept, Informationsarchitektur und UI-Design
Entscheidungen, nach denen man mich fragen kann
- 01Der Markt steht in der URL (/en-us, /de-de), damit Produktdaten pro Markt gecacht werden und das Land des Warenkorbs immer zu den Preisen passt.
- 02Ein Warenkorb pro Markt: Beim Länderwechsel entsteht ein korrekt bepreister Warenkorb, statt Währungen still zu mischen.
- 03Steckervarianten werden im Storefront pro Markt eingeschränkt, und eine Cart-Validation-Function setzt dieselbe Regel serverseitig durch – der Checkout lehnt einen unpassenden Stecker ab, egal aus welchem Storefront der Warenkorb kommt.
- 04Alles funktioniert ohne Animationen – 3D ist eine Verbesserung, nie eine Hürde zum Kauf.
Stack
- Liquid · Online Store 2.0
- Shopify Plus (dev store)
- Shopify Functions
- Webhooks
- Storefront API 2026-10
- Admin API (seed scripts)
- Next.js 16 · React 19
- next-intl
- Tailwind CSS 4
- three.js · React Three Fiber
- GSAP
- Blender 5 (scripted)
Ehrliche Hinweise
PORTVA ist keine echte Marke. Daten und Richtlinien sind beispielhaft, der Checkout läuft im Testmodus, und es gibt keine Bewertungen, weil es keine Kunden gibt.