embarc logo
embarc logo

Frontend-Architektur für Unternehmensanwendungen / Spicker #9

Oliver Zeigermann Oliver Zeigermann
09.12.2020

Lesezeit: 3 Minuten

In vielen Projekten im Unternehmenskontext wird ein modernes Web-Frontend benötigt. Dabei sind viele technische und strukturelle Entscheidungen zu fällen, die teilweise das Gewicht von Architektur-Entscheidungen haben. Dies wird oft unterschätzt und nur das Backend bekommt Aufmerksamkeit.

 
 

In vielen Projekten wird Frontend-Architektur nicht für voll genommen, so habe ich in meinem Projekt-Leben die folgenden Aussagen gehört:

Yehuda Katz, der Mitschöpfer von Ember.js fasst das so zusammen (der ganze Thread ist lesenswert)

 
 

Aber wie passt Architektur zu Frontend?

Moderne Web-Frontends haben häufig hohe Anforderungen an Benutzerfreundlichkeit, teilweise in demselben Maße wie klassische Desktop-Anwendungen. Single-Page Applications (SPAs) erlauben solche hochinteraktiven Web-Anwendungen, indem sie auf Benutzereingaben mit Veränderung einer einzigen HTML-Seite reagieren und diese auf dem Client, ohne Roundtrip zum Server rendern.

Sie verschieben damit den Schwerpunkt einer Anwendung in Richtung Browser. Das bringt besonders im Unternehmenskontext neue Herausforderungen mit sich.

Architektur: Die Summe der wichtigen Entscheidungen

Wir definieren Architektur als die Summe der wichtigen Entscheidungen. Wichtig ist eine Entscheidung zum Beispiel wenn

Daraus resultiert, dass manche Entscheidungen zwar getroffen werden müssen, aber eher weniger Gewicht haben oder einfacher geändert werden können. Sie zählen nach unserer dann Definition nicht zur Architektur und brauchen daher nicht so eine genaue Untersuchung und Betrachtung. Andere Entscheidungen sind hingeben höchst wichtig und sollten mit viel Bedacht gefällt werden. Diese Themen werden im Folgenden angerissen und in den verlinkten Ressourcen im größeren Detail behandelt.

 
 

Typische Anforderungen und Architektur-Entscheidungen

Laut der Expertenmeinungen auf https://tsh.io/state-of-frontend/#frameworks ist React das führende SPA-Framework und hat mit den in seinem Umfeld entstandenen Ideen den größten Einfluss auf die Entwicklungen im Bereich Frontend-Architektur.

React is king. But who’s the contender? (Dylan Schiemann, Co-Creator of Dojo)

Gemäß der bekanntesten Umfrage https://2019.stateofjs.com/front-end-frameworks/#front_end_frameworks_section_overview im Bereich Web-Entwicklung hat kein anderes Framework auch nur annähernd so gute Zufriedenheitswerte.

Aus architektonischer Sicht haben wir keine Vorliebe für eines der verbreiteten SPA-Frameworks, aber auch unsere langjährige Erfahrung liegt bei React.

Das Ökosystem von React hält viele Spielmöglichkeiten bereit, um einem breiten Anwendungsfeld gerecht zu werden. Das macht eine Orientierung gerade am Anfang eines Projekts schwierig, Anwendungen im Unternehmenskontext haben jedoch häufig ähnliche architektonische Anforderungen wie

Unsere Empfehlungen für Ihr React-Projekt
Unsere Empfehlungen für Ihr React-Projekt

Dazu passende Architektur-Entscheidungen haben wir bereits in unserem Github-Repository https://github.com/DJCordhose/react-showcase umgesetzt und dokumentiert. Manche Entscheidungen sind klarer, andere hängen noch mehr von den individuellen Anforderungen ab. Hier können Sie direkt mit unseren Architektur-Empfehlungen experimentieren.

Zu den individuellen und damit unsicheren Entscheidungen zählen häufig:

  1. Wie sollte die Anwendung strukturiert sein?
  2. Wie wird der Zustand der Anwendung verwaltet?
  3. Wie kann die Anwendung sinnvoll, effizient und stabil getestet werden?
  4. Wie integriert sich die Anwendung mit bestehender Software?
  5. Wie integrieren sich SPAs in einer eventuell existierenden Microservice-Strategie?

Fazit

Spicker 9: Moderne Frontend-Architektur
Spicker 9: Moderne Frontend-Architektur

Zur weiteren Beschäftigung mit Frontend-Architektur können Sie sich gern unseren Spicker als PDF herunter laden. Dort widmen wir uns neben den typischen Anforderungen und den gängigen Frameworks auch der inneren und äußeren Architektur und den weiteren Herausforderungen in einem Projekt mit modernem Web-Frontend.

zum arcvent(s)kalender