Herausforderung
Ein europäischer Multichannel-Händler benötigte eine Weboberfläche zur Verwaltung physischer Drucker an allen Standorten – inklusive Geräteübersicht, Einstellungen, Standortzuordnung und Metadaten. Das Projekt diente gleichzeitig als erster Einstieg des Unternehmens in Vue.
Lösung
Ich entwickelte die Webanwendung mit Vue 3 und einer internen, auf StencilJS basierenden UI-Komponentenbibliothek, verbunden mit einer REST-API nach OpenAPI Spec 3 mit OIDC-Authentifizierung. Ich implementierte den vollständigen OAuth-Flow inklusive Audience- und Berechtigungsprüfung, überbrückte Abweichungen zwischen Design und Komponentenbibliothek und hielt Deadlines durch Mock-Daten und Mock-Services ein, während die API noch in Entwicklung war. Zudem onboardete ich das Entwicklungsteam in Vue und vermittelte Best Practices in Komponentendesign und Vue-Ökosystem.
Ergebnis
Die Anwendung wurde erfolgreich ausgeliefert und dient als Basis für künftige Erweiterungen. Das Team wurde vollständig in Vue eingearbeitet. Bugfixes, die an die Komponentenbibliothek zurückgespielt wurden, kamen allen Framework-Konsumenten zugute.
Entwickelt mit
Projektübersicht
Entwickelt bei CAMAO Tec (später umbenannt in mmmake), umfasste dieses Projekt den Aufbau einer Drucker-Management-Webanwendung für einen europäischen Multichannel-Händler. Ziel war es, Betriebsteams eine klare Übersicht über alle physischen Drucker im europäischen Filialnetz zu geben – inklusive Einstellungen, Standorten und zugehöriger Metadaten.
Funktionen
- Geräteübersichts-Dashboard für alle Filialstandorte
- CRUD-Operationen für Drucker, Einstellungen und Metadaten
- OIDC/OAuth-Authentifizierung mit Audience-Validierung und berechtigungsbasierter Zugriffskontrolle
- Integration einer internen StencilJS UI-Komponentenbibliothek
- Mock-Datenschicht zur Einhaltung von Lieferterminen während der API-Entwicklung
Technische Highlights
Die Anwendung wurde auf Basis von Vue 3 entwickelt – dem ersten Einsatz des Frameworks im Unternehmen. Die REST-API folgte OpenAPI Spec 3 und erforderte die Implementierung eines vollständigen OIDC-Authentifizierungsflows gegen einen internen Identity Provider. Wo das Produktdesign von der Komponentenbibliothek abwich, arbeitete ich direkt mit den Bibliothekseigentümern zusammen, um Probleme zu identifizieren und zu beheben.