Für meine Abschlussprüfung zum Mediengestalter Digital und Print (Schwerpunkt Frontend-Entwicklung) im Sommer 2025 habe ich eine Web-App für ein fiktives Gartencenter konzipiert und realisiert. Die App sollte ausschließlich auf Tablets laufen und als digitaler Info-Point im Laden dienen. Dabei umfasst die App die Entstehungsgeschichte des Gartencenters, aktuelle Angebote, eine Newsletter-Anmeldung sowie als Highlight einen dynamischen Gutscheingenerator. Während mit die technische Umsetzung (Note: 1) keine besonderen Schwierigkeiten bereitete, lag die eigentliche Herausforderung für mich eher im UI-Design (Konzept-Note: 2), da ich mich im Code einfach sicherer fühle als in UI-Gestaltung.
Technische Highlights
- Echtzeit-Gutscheingenerator: Eingabe von Name und Betrag werden via JavaScript verzögerungsfrei live auf das gewählte Gutschein-Motiv gerendert.
- Skalierbares Routing & Event Delegation: Ein zentraler Event-Listener auf dem App-Container fängt Klicks über HTML5 data-* Attribute ab, fängt verschachtelte Kind-Elemente (wie Icons) per .closest() ab und steuert die Page-Transitions
- Clientseitige Validierung: Dynamische Prüfung von Mail, Postleitzahl und komplexen Hausnummern-Kombinationen (RegEx) vor dem Absenden.
Roadmap
- Refactoring von JavaScript-Strukturen und Behebung von fehlerhaften Event-Listenern
- Umstellung des Layouts von starren CSS-Vorgaben auf ein vollresponsives CSS Grid / Flexbox-System
