Komponentenbasierte Entwicklung von Softwareanwendungen
Das sich in den letzten Jahren der Trend zum auf Komponenten basierenden Entwicklungsansatz (component driven development) hin entwickelt hat, haben wir im Blogartikel “Wie wir bei kreITiv ein stimmiges User Interface entwickeln” kürzlich schon beschrieben.
In einem zweiten und deutlich technischeren Beitrag möchten wir nun weiterführend auf die Vorteile dieses Ansatzes eingehen und das Konzept mit der sogenannten Redux-Implementierung vervollständigen.
Vorteile des komponentenbasierten Entwicklungsansatzes
Die komponentenbasierte Entwicklung beschreibt ein innovatives Vorgehen, welches sich in unserer Branche immer größerer Beliebtheit erfreut. Im Vergleich zu herkömmlichen Ansätzen, wird hier von vornherein mehr auf klare Strukturierung und ein hohes Maß an Wiederverwendbarkeit von Codestrukturen geachtet. Arbeitspakete sind deutlich einfacher zu gliedern und lassen sich flexibler in Teams teilen.
Der Ansatz stammt aus dem Bereich der Entwicklung von webbasierter Software und kann Unternehmen als Neuerung wertvolle Rückschlüsse auf Entwicklungsprozesse für Anwendungen liefern. Er eignet sich besonders für Projekte, die mehr als einen Entwickler in der Umsetzung benötigen oder einen sehr hohen qualitativen Anspruch an das User Interface legen. Mit dem Konzept schafft man sich Strukturen, die eine spätere Weiterentwicklung sowie die Skalierbarkeit der eigenen Anwendung deutlich erleichtern.
Ganz konkret lassen sich vier entscheidende Vorteile festhalten.
Sind alle Komponenten mit ihren States entwickelt worden, so können diese auch optional in eine Library, also eine Bibliothek, implementiert werden, um in späteren Projekten wiederverwendet zu werden. In der Regel folgt danach die Implementierung der Anwendung. Dies kann innerhalb des Storybooks oder auch außerhalb realisiert werden. In diesem Schritt werden nun die zuvor entwickelten Komponenten in Container Elemente implementiert, damit diese eine direkte Anbindung an den Store der Bibliothek erhalten können.
In einem unserer Storybooks können Sie sich einen Überblick der einzelnen Komponenten, eingearbeitet in den jeweiligen Views, verschaffen. Komponenten können z.B. Input-Felder, Grafiken, aber auch die umschließenden Komponenten in Form einer Karte sein. Ein Storybook beinhaltet im Normalfall tatsächlich nur einzelne Komponenten, keine ganzen Seitenansichten. Das Ziel ist es, alle benötigten Elemente in ihren verschiedenen Stadien während der Entwicklung darzustellen. Eine weitreichende Logik wird dabei vernachlässigt.
Das Konzept der Redux-Implementierung
Die Überführung der entwickelten Komponenten in eine Bibliothek macht nun die Installation von Redux als State Management Library und der Erweiterung React-Redux notwendig. Redux selbst ist eine quelloffene und mittlerweile von React unabhängige Bibliothek und kann auch für andere reaktive Frameworks verwendet. So zum Beispiel für die auch von uns in Projekten verwendeten Frameworks Vue oder Angular.
Aufbau einer Redux-Implementierung
Vorteile der Redux-basierenden Datenverarbeitung
- Strikte Trennung von Präsentation und Verarbeitung der Daten: Die Darstellung der Daten selbst wird in der Regel über Stateless-Komponenten realisiert, welche Änderungen der Daten selbst über ihre Properties und Container triggern können. Die eigentliche Manipulation der Information geschieht über die Reducer, die als Pure Function geschrieben werden.
- Deterministische Zustände: Dank der strikten Vorgaben für die Konzeption eines Reducers sind alle Zustände, welche Daten einer Anwendung annehmen können, begrenzt. Dies minimiert die möglichen Fehler in Punkto Verarbeitung enorm.
- Standardisiertes Architekturkonzept: Redux als Library gibt den Aufbau der Datenverarbeitung vor, was zu Folge hat, dass Anwendungen einheitlicher und damit wartbarer werden.
Auf Basis unserer Projekterfahrungen können wir damit als Fazit ziehen: Mit einem komponentenbasierten Entwicklungsansatz benötigt man mehr Zeit für die Entwicklung von Anwendungen, jedoch rechtfertigt sich mehr Mehraufwand, da letztlich qualitativ hochwertige Anwendungen entstehen.
Wir sind gespannt, welche Entwicklungen es in diesem Bereich in den kommenden Jahren noch geben wird und behalten natürlich insbesondere die Webtechnologien für unsere Kunden und Projekte genau im Auge.
Durch das interaktive Entwickeln bekommt der Kunde auch einen Einblick in die Entstehung der Software und kann den Fortschritt stets mitverfolgen. Eine zeitnahe Feedback-Übermittlung bzw. Gegensteuerung bei ungeplanten oder ungewollten Entwicklungen ist damit jederzeit möglich. Missverständnisse, die oft erst gegen Ende von Projekten sichtbar werden, können deutlich reduziert werden. Das trägt zur Zufriedenheit aller Stakeholder des Entwicklungsprojektes bei.