Nach und nach wurde das Design verfeinert, und so war es Zeit, einen Footer zu erstellen. Auf der Dokumentationsseite von DaisyUI fanden sich einige Beispiele, von denen eines als Vorlage diente. Dieses wurde so angepasst, bis es optisch ansprechend war: Alle Kontaktdaten, E-Mail-Adresse, Webseite (falls vorhanden) und ein Link auf hunae.de wurden integriert.

Erste statische Version

Ich war dem DaisyUI-Projekt erneut sehr dankbar, da es als Open-Source-Projekt zahlreiche Hilfestellungen bietet und mir die Arbeit erheblich erleichtert hat.

Nach wie vor war das Ziel, zunächst eine rein statische Seite zu erstellen, bei der alle Daten direkt im HTML gepflegt werden. Sie sollte nicht perfekt sein, sondern das Wesentliche meiner bestehenden Webseite abbilden. Gedacht war das Ganze als Ausgangspunkt. Sobald die Seite fertiggestellt ist, soll der nächste Schritt darin bestehen, die Daten aus dem HTML herauszulösen und in ein Datenmodell zu übertragen.

Vorbereitung des Datenmodells

Für dieses Datenmodell stand bereits fest, dass es mit TypeScript umgesetzt werden soll. Das reduziert potenzielle Fehlerquellen erheblich und ermöglicht durch klar definierte Interfaces eine sofortige Rückmeldung bei Tippfehlern direkt im Editor (Visual Studio Code).

Zunächst war mir das jedoch egal. Wichtig war, eine nahezu vollständige Seite zu haben, um anschließend mit der Arbeit am Datenmodell starten zu können. Dann weiß ich schließlich genau, welche Daten benötigt werden.

Finalisierung der Seite

Der Footer war bald fertig, und auch das Menü wurde erweitert und verbessert, sodass die Seite insgesamt fertig wirkte.

Und irgendwie war sie dann tatsächlich fertig. Rein theoretisch hätte ich das Ergebnis nun bereits hochladen und die Seite live stellen können. Eine Webseite, komplett im Text-Editor in HTML erstellt, ist etwas, das man heute aus Zeitgründen selten macht. Es ist zwar bis ins letzte Detail anpassbar, aber viele würden sich diesen Aufwand nicht leisten wollen, da die Entwicklung in Handarbeit entsprechend teuer wäre.

Fazit

Insgesamt war es sehr zeitintensiv, alles manuell zu entwickeln und die notwendigen TailwindCSS-Klassen aus der Dokumentation herauszusuchen. Doch genau so entsteht ein komplett offenes System, das sich bis ins Detail anpassen lässt. Alle bisher verwendeten Software-Komponenten sind Open-Source und völlig kostenfrei nutzbar. Darum geht es schließlich: Neben der investierten Zeit, die ich bewusst nicht zähle, soll das Projekt möglichst geringe laufende Kosten verursachen.

Jedenfalls war nun der angestrebte Punkt erreicht: eine erste Vorlage für das zukünftige Datenmodell.