Portierung nach Jekyll

In meinem ersten richtigen Beitrag wird es meta, denn es geht um die Portierung der Webseite von einem gemischten HTML- & Jekyll-Projekt hin zu einem reinen Jekyll-Projekt.
“Aber warum Jekyll?”, wirst du dich bestimmt fragen. Um diese Frage zu beantworten, werde ich erstmal kurz erklären, was Jekyll überhaupt ist. Danach skizziere ich den bisherigen Weg und gehe anschließend auf die Portierung der Seite ein.

Jekyll in kurz

Jekyll ist ein statischer Webseiten-Generator. Man definiert auf der einen Seite mittels Templates das Layout und Design der Seiten und erstellt dann z.B. mittels Markdown den Inhalt der Seite und lässt dann von Jekyll die einzelnen Seiten generieren. Diese Seiten sind wie in den Anfangstagen des Internets statisch, bedeutet die Seiten werden so ausgeliefert wie sie auf dem Server gespeichert sind. Es läuft keine Webapplikation, die dynamisch die Seiten erstellt.
Im Gegensatz zu ausgewachsenen Content Management Systemen wie WordPress oder Drupal benötigt man keine Datenbank und man muss das System nicht kontinuierlich aktualisieren. Man erstellt lokal die Seiten und lädt sie dann mittels eines FTP-Programms auf den Server. Mit den entsprechenden Kenntnissen lohnt es sich also bei kleinen Seiten auf Jekyll zu setzen.

Der bisherige Weg

Von Anfang an war und ist es wichtig für mich, eine möglichst einfache Struktur und eine gute Wartbarkeit der Seite zu gewährleisten. In der Vergangenheit habe ich bereits mehrere CMS ausprobiert, allerdings war ich von keinem richtig überzeugt. Klassische CMS wie z.B. WordPress benötigen sehr viel Administrationsarbeit, für die ich weder Zeit noch Lust habe und die besonders für eine kleine Seite wie diese hier in keinem Verhältnis steht.
Angefangen habe ich dann mit Grav, einem Flat-File-CMS. Statt in einer Datenbank sind die Texte hier in einzelnen Dateien gespeichert. Mein Problem war hier allerdings, dass ich das Aussehen der Seite nicht ganz nach meinen Wünschen ändern konnte. Deshalb habe ich für meine Homepage ganz klassisch eine HTML-Datei erstellt, Bootstrap eingebunden und erstmal den Blog-Part links liegen gelassen.
Als ich mich dann um den Blog gekümmert habe, bin ich dann auf Jekyll gestoßen. Das Konzept hat mir von Anfang an gefallen, weshalb ich den Blog darauf aufgebaut habe. Das Problem: Ich hatte in meinem Projekt zwei Bestandteile, den Jekyll-Blog und die Homepage.

Die Portierung

Die einfachste Möglichkeit, um eine einzige Codebasis zu schaffen, war eine Portierung der gesamten Seite auf Jekyll. Für den Blog habe ich mit Amplify bereits ein minimalistisches Theme mit AMP-Unterstützung verwendet. Ganz naiv habe ich also einfach alle bisherigen Nicht-Jekyll- Dateien in den Jekyll-Ordner verschoben und den Generator angeworfen. Das Ergebnis war alles andere als zufriedenstellend. Das hieß für mich eine Rolle rückwärts und in einem externen Projekt die Änderungen durchführen.
Mein Vorgehen sah folgendermaßen aus: Das Amplify-Repo klonen, die Dateien aus meinem Ursprungsprojekt kopieren und verschieben und die Konfiguration so abändern, dass Jekyll ein mindestens zufriedenstellendes Ergebnis generiert. Danach habe ich die gesamte Struktur in das alte Projekt kopiert und “Detailarbeit” durchgeführt (Dateien in sinnvolle Unterordner verschoben, Templates erstellt, etc.). Das alles hat allerdings statt der von mir veranschlagten Stunde mehrere Stunden gedauert. Ich habe zwischendurch mehrere andere Themes ausprobiert, die allerdings nicht ganz meinen Erwartungen entsprachen, und mit verschiedenen Templates gespielt. Am Ende habe ich für die Portierung mehrere Stunden gebraucht, obwohl es an sich keine große Aufgabe war. Letztendlich läuft jetzt alles so wie es soll und ich habe eine gute Basis, die ich in Zukunft einfach weiterentwickeln kann.

Fazit

Mit Jekyll habe ich ein gutes Werkzeug gefunden, mit dem ich einen einfachen Blog ohne viel Administrationsarbeit führen kann. Die Portierung der bisher außenstehenden Inhalte, namentlich die Homepage und das Impressum, hat länger gedauert als gedacht, was aber teilweise auch an meinem Wunsch liegt, alles möglichst bis ins Detail zu verstehen. Ab jetzt sollte es für mich einfach sein, Änderungen im Inhalt vorzunehmen ohne dabei das Layout zu zerstören.
Da ich hier allerdings mit statischen Seiten arbeite, habe ich bislang keine direkte Möglichkeit für Kommentare eingebaut. Eine Lösung hierfür zu finden wird eine meiner nächsten Aufgaben bei der Verbesserung der Seite sein. Bis dahin erreicht ihr mich bei Fragen oder Kommentaren allgemein und zu diesem Post auf Twitter.