28. Dezember 2020

Simpel Web Architektur

Ohne Handbremse

IT wird häufig als langsam und zögerlich wahrgenommen. Der Grund können die strikten Sicherheitsvoraussetzungen und dadurch langen Evaluationsphasen sein. Uns war es von Anfang an sehr wichtig, nicht alten Tools und Vorgehensweisen ausgeliefert zu sein. Denn nur so könnten wir den heutigen Anforderungen von schnellen und häufigen Iterationen nachkommen.

Monorepository

Features statt Fleißarbeit

Ein fauler Programmierer ist nicht automatisch ein guter Entwickler. Durch Fleiß und überdurchschnittlich hohe Motivation kann man eigene Hürden überwinden und man wächst in seiner Expertise.

Aber eine ganz wichtige Schlüsselkompetenz in der Zeit immer schneller wechselnder Anforderungen ist es, sich auf geforderte Funktionen und wertschaffende Aspekte zu fokussieren. Repetitive Tätigkeit empfinden wir als frustrierend und vermeidbar.

Und diese grundsätzliche Herausforderung versucht das Konzept von Monorepositories zu beantworten. Oft werden ähnliche Softwareprojekte voneinander getrennt erstellt und gewartet und gleiche Aufwände entstehen mehrmals. Bei einem Monorepository verschmilzen diese Codearchive miteinander und viele Arbeiten können einmalig und mit größerer Sorgfalt erfüllt werden. Wir haben uns gleich zu Beginn für diese Arbeitsweise entschieden und setzen deswegen für die Verwaltung unseres Monorepositorys auf das Tool Lerna. Lerna hilft unseren Workflow bei der Arbeit mit mehreren Projekten unter der Verwendung von git und npm zu optimieren.

Simpel Web Architektur

Gatsby

Gatsby ist ein in vielerlei Hinsicht sehr spannendes Framework. Es basiert auf React und ist deswegen sehr zugänglich. Denn React bietet eine Abstraktion von Javascript, durch die mit einer sehr flachen Lernkurve schnell Ergebnisse erzielt werden können. Gatsby Builds liefern zudem statische Webseiten aus, behalten aber Interaktivität bei – das Beste aus zwei Welten also. So bieten wir schnelles Laden unserer Seiten, das verbessert neben Benutzerkomfort auch das Suchmaschinenranking! Durch ein stetig wachsendes Ökosystem von Gatsby Plugins können Anforderungen rund um moderne Webseitenentwicklung häufig extrem einfach durch “drop-in”-Lösungen erfüllt werden.

Headless WordPress

Das WordPress-Ökosystem ist auch deswegen so mächtig, weil der Funktionsumfang des CMS durch Plugins praktisch nach Belieben erweitert werden kann. Dieser Vorteil führt aber bei unbedachter Nutzung oft zu Herausforderungen bei Versionsupdates von WordPress, Themes und Plugins.

Deswegen nutzen wir nur sehr wenige Plugins, die durch die logische Trennung von statischer Webseite und Datenquelle zu keinem Zeitpunkt die Funktionalität der Webseite beeinträchtigen können. Die wichtigsten Plugins sind dabei:

Durch die Wiederverwendung von Komponenten auf den Webseiten unserer Kunden bietet es sich an, auch das durch ACF stark angepasste WordPress-Backend so zu nutzen, dass Redundanzen vermieden werden. Dies wird durch eine WordPress Multisite ermöglicht, die eine Vielzahl von Vorteilen mit sich bringt:

  • Installation und Update von Plugins an zentraler Stelle
  • Themeupdates und damit neue Felder/Inhaltstypen werden ebenfalls zentral deployed
  • Nutzung von Subdomains für die Kundenzugänge, also keine Hosting-Kosten für das CMS der Kunden
  • Backups können automatisiert und zentral verwaltet werden

Github

Inzwischen findet unsere (sidyesrobkrause) Versionskontrolle in Github statt. Dabei nutzen wir sehr stark die CI-Möglichkeiten von Github Actions. Ein erfolgreicher Build, Snapshot-Tests, Linting Rules, Visual Regression Tests, sowie Code Reviews sind Voraussetzungen für den Merge und damit das Deployment. Das WordPress Theme wird zudem automatisch deployed. Im Falle des Gatsby Monorepositories erfolgt dieser Schritt aber mit Netlify. Dependency Updates werden automatisiert durch den Renovate Bot vorbereitet und teilweise vollautomatisch vollzogen.

Netlify

Gerade Hosting kann hohe Aufwände verursachen. Genau dieser Herausforderung nehmen sich Unternehmen wie Netlify an. Viele grundsätzlichen Funktionen sind hier out-of-the-box dabei. So entfällt die Einrichtung einer Laufzeitumgebung, die Konfiguration von SSL-Verschlüsselung, und die Deployment-Konfiguration an sich. Inzwischen haben wir das Deployment stark modifiziert, so dass nur betroffene Projekte gebaut und deployed werden. Den damit verbunden Vendor-Lock-in nehmen wir gerne in Kauf, weil wir inwischen riesige Fans des immer mächtiger werdendem Netlify-Öko-System sind. Weitere Features, die wir nutzen und sehr schätzen:

  • Grafische Oberfläche zur übersichtlichen Anpassung von z.b. DNS Einstellungen und Umgebungsvariablen
  • Netlify-Forms – Formular-Handling
  • Netlify Plugins
  • Deploy-Previews

Die WordPress Multisite und damit verbundene Datenbank wird bei einem deutschen Anbieter gehostet.

Weiter Vollgas

Wir sind mit unserer Architektur sehr zufrieden, verpflichten uns aber dennoch, weiterhin neue Möglichkeiten im Jamstack-Umfeld zu evaluieren und zu nutzen. Gerne diskutieren wir unsere Technologieentscheidung per Mail oder auf Twitter. Natürlich können Sie auch von diesen Vorteile der modernen Webseiten und Webapp-Entwicklung profitieren. Nehmen sie jederzeit Kontakt mit uns auf!

Zur Startseite