Whitelabel Tarifrechner
Mandantenfähiger Whitelabel-Tarifrechner für Strom- und Gastarife verschiedener Energieversorger.
- Projektumfeld
- yay! digital
- Branche
- Energie & Utilities
- Zeitraum
- 2018
- Dauer
- 2 Monate
- Rolle
- Frontend Engineer
Kontext
Entwicklung eines Whitelabel-Tarifrechners für Strom- und Gastarife bei der yay! digital GmbH — einer Digitalagentur mit Fokus auf E-Commerce- und SaaS-Lösungen. Der Tarifrechner wurde als wiederverwendbare Lösung konzipiert, die von verschiedenen Energieversorgern unter eigener Marke eingesetzt werden kann.
Aufgabe
Energieversorger benötigen interaktive Tarifrechner, die Endkunden eine einfache Möglichkeit bieten, Strom- und Gastarife zu vergleichen und direkt online abzuschließen. Die Herausforderung: Ein einzelner Rechner muss flexibel genug sein, um sich an verschiedene Marken, Tarifstrukturen und regionale Besonderheiten anzupassen — ohne dass für jeden Kunden eine eigene Lösung entwickelt werden muss.
Technische Umsetzung
Der Tarifrechner wurde als Vue.js-basierte Single-Page-Application entwickelt, die sich über Konfiguration an verschiedene Energieversorger anpassen lässt. Das Whitelabel-Konzept ermöglicht es, Design, Tariflogik und Inhalte pro Mandant zu konfigurieren.
Architektur-Highlights
- Vue.js Frontend: Reaktive, komponentenbasierte UI für interaktive Tarifberechnung
- Whitelabel-Architektur: Konfigurationsbasierte Anpassung an verschiedene Energieversorger
- SASS Theming: Flexibles Styling-System für mandantenspezifisches Branding
- HTML5: Semantische Markup-Struktur
Mein Beitrag
Als Frontend Engineer war ich für die Entwicklung des Vue.js-Frontends verantwortlich. Der Fokus lag auf einer sauberen Komponentenarchitektur, die es ermöglicht, den Tarifrechner effizient an verschiedene Mandanten anzupassen.
Wiederverwendbare Vue-Komponenten und konfigurierbares Theming unterstützten die Anpassung an verschiedene Mandanten.
Tech Stack
Ein schlanker, fokussierter Frontend-Stack — Vue.js für die Interaktivität, SASS für flexibles Theming.
- Vue.js
- JavaScript
- HTML5
- SASS
