Entwicklung einer Single Page Application in React TS für personalisierte Campingtouren

Ausgangslage:
Unabhängiges Reisen mit Camper ist Trend und wird durch die sozialen Medien gestärkt. Es wird ein Gefühl von Freiheit und Einfachheit vermittelt. Die Realität sieht oft anders aus. Stellplätze sind beschränkt, Wildcampen verboten und die Suche nach einem geeigneten Platz aufwendig. Eine Applikation soll den Vanlifer bei der Planung einer geeigneten Campingtour unterstützen. Bereits im Rahmen der Studienarbeit (SA) im HS 2022 wurde diese Idee verfolgt, sowie ein Prototyp für eine Applikation entwickelt.
Die Nutzung der Applikation ist für 3 Akteure vorgesehen: Vanlifer, Host und Travel Agent. Für diese Arbeit liegt der Fokus primär auf der Umsetzung von Features des Vanlifer-Bereichs. Ziel ist es individuelle Touren für einen gewünschten Zeitraum und gegebene Region zu generieren und dem Vanlifer übersichtlich zu präsentieren. Der User soll seine gewählte Tour nach Bedarf anpassen können.
Ein weiteres Ziel innerhalb der Arbeit ist die Operationalisierung der Applikation in der Azure Cloud.
Die umfangreiche Applikation wird von 2 Teams entwickelt, wobei die Aufgabenbereiche in Front- und Backend aufgeteilt ist. Diese Arbeit thematisiert den Bereich Frontend.

Vorgehen / Technologien:
Um von der Idee zur Realisierung einer funktionalen Applikation zu gelangen, wurde als Vorgehensmodell Scrum gewählt. In der Initialisierungsphase der Arbeit wurden Anforderungen evaluiert und priorisiert, sowie in den Backlog aufgenommen.
Eine umfangreiche Wireframe-Studie half bei der Entscheidung der Umsetzung des Buchungsprozesses. Eine weitere Studie zu Karten-Komponenten unterstützte die Wahl einer geeigneten Karten-API für die Darstellung der Touren. Dabei fiel die Wahl auf Here.
In einer Implementierungsphase wurden die Applikation im Vanlifer-Bereich schrittweise mit Features ausgebaut. Parallel wurden Entwicklungen im Host-Bereich und Registrierungsprozess verbessert.
Die Applikation wird aufbauend auf der React Library und Typescript als Programmiersprache entwickelt. Die Zustände der Webseite werden mit Redux-Store verwaltet und die Anbindung zum Backend geht über REST. Für die Gestaltung der einzelnen Elemente und Widgets kommt die Material UI Komponenten-Library zum Einsatz. 
Zusätzlich ist die Applikation als Teil einer Docker Compose Architektur zusammen mit dem Backend auf eine Azure VM deployt worden.

Fazit:
Dank einer geordneten Vorgehensweise nach Scrum konnten die wichtigsten Anforderungen realisiert werden. Der iterative Prozess erlaubte das fortwährende Einholen von Kundenfeedback, sowie dessen zeitnahen Umsetzung. Die Applikation konnte stetig ausgebaut werden, wobei Initial auf das Gesamtbild geachtet wurde und in späteren Sprints der Detaillierungsgrad vertieft wurde. Das dynamische Vorgehen, insbesondere die Möglichkeit weitere Anforderungen zu definieren, brachte Herausforderungen mit sich. Die Priorisierung und Definition der geplanten Tasks bildete ein Spannungsfeld zwischen Kunden, Backend-Team und Frontend.