Dieses Jahr feiert die aktuelle Version der Webseite ihren 8. Geburtstag. Doch vermutlich wird es der letzte sein, da eine Gruppe von ITlern im Verein schon seit über einem Jahr an der vierten Version arbeitet. In dieser Artikelreihe werden wir euch in dem Prozess mitnehmen, wie wir auf den neusten Stand der Technik updaten!
Schon seit mehreren Jahren gab es die Idee und den Wunsch, unsere Webseite radikal zu verbessern. Natürlich wurden in diesen 8 Jahren immer wieder neue Dinge programmiert, aktualisiert oder Bugs behoben, aber wir haben uns nie ganz getraut, den großen Schritt zu wagen. Teilgeschuldet ist das auch dem CMS (Content Management System) in dem die Webseite läuft: Drupal 7. Das CMS ist in PHP geschrieben, und somit sind auch quasi alle unsere Plugins dafür (hauptsächlich) in PHP programmiert. Allerdings ist die Sprache nicht mehr wirklich beliebt und besonders hatten wir als junge Studierende keine Lust mehr, uns mit der alten Sprache genauer zu beschäftigen.
Quelle: Stackoverflow Survery 2021
Mit der Ankündigung von 2019, dass Drupal 7 im November 2023 End-Of-Life (keine Security Updates mehr) erreicht, hatten wir also 2 grundlegende Optionen: Entweder, wir updaten auf Drupal 8 bzw. 9, oder wir schauen uns nach etwas ganz anderem um. Da unsere Plugins teilweise nicht unbedingt mit den Best-Practices geschrieben wurden, würde das Update von Drupal auch ziemlich große Arbeit mit sich bringen, und wir hätten natürlich weiterhin PHP als Programmiersprache. Also wollten wir uns nach etwas anderem umsehen.
Wordpress (das am weitesten verbreitete CMS) war schonmal keine Option für uns, da es auch in PHP geschrieben ist und durch die vielen Plugins, die man braucht um die Webseite zum laufen zu bekommen, recht schnell bloat ansammelt und langsam wird. In der Recherche stießen wir dann auf einen "relativ" neuen aber recht effektiven Ansatz: den JAM-Stack (Für Javascript + APIs + Markup). Viele der größten Websites wie zum Beispiel Facebook, Youtube oder auch Github nutzen (zumindest teilweise) den Ansatz. Dabei wird das Frontend (das, was man im Browser sieht) in Javascript programmiert und mit Daten von APIs zu "static" Seiten generiert, die sehr viel schneller laden als Webseiten, die alle Daten dynamisch laden. In vielen Situationen ist es aber natürlich dennoch Standard, auch im Browser, bei Interaktionen die Daten je nach Notwendigkeit zu laden. Ein weiterer Vorteil von diesem Stack ist auch, dass jetzt die Daten und das Interface komplett unabhängig voneinander sind (anders als bei traditionellen CMS) und man sehr viel leichter Integrationen oder Bots schreiben, oder je nach Bedarf die Daten auch an anderer Stelle (einer anderen Webseite oder vielleicht auch in einer App) verwenden kann.
Wir haben uns also für einen Grundansatz entschieden, jetzt fehlen nur noch die tatsächlichen Technologien. Hierfür ist GitHub immer eine Hilfe: Und zwar gibt es eine super Liste mit aller möglichen Software in allen Bereichen, die man auf dem eigenen Server hosten kann. Das ist für uns ein wichtiger Faktor, da wir dann selbst die Kontrolle über alles haben und natürlich auch einiges darüber lernen, aber auch weniger dafür zahlen müssen, was für einen ehrenamtlichen und gemeinnützigen Verein natürlich ein wichtiger Aspekt ist.
Nach mehrfachem ausprobieren und haben wir uns dann für den folgenden Techstack entschieden:
- Strapi als Headless CMS
- NextJS für das Frontend (Framework basierend auf React, geschrieben in Typescript)
- Chakra-UI als UI-Framework
- Meilisearch für Instantsearch nach verschiedensten Inhalten
- PostgreSQL als Datenbank
- GraphQL als API zwischen Strapi und Frontend (wird zum Beispiel auch von Netflix verwendet)
- Docker weiterhin auf dem Server wo die einzelnen Anwendungen in Containern laufen
Und somit steht der Anfang für eine spannende Zeit, eine neue Webseite zu entwickeln. Doch vorerst will ich im nächsten devlog nochmal einen Rückblick zu den vergangenen Webseiten geben, um ein wenig in Nostalgie zu schwelgen und auch ein wenig zu zeigen, was unser Fokus für die nächste Webseite sein wird.
Dir hat dieser Beitrag gefallen und du hast Lust, an der neuen Webseite mitzuwirken? Zusätzliche Funktionen im Studiumsbereich oder zum Beispiel eine Wohnungsbörse zu entwickeln, die allen Bamberger Studierenden zugute kommen? Dann schnupper gerne mal bei uns rein indem du dich hier anmeldest! :)
