Neue Blog-Software

Die bestehende software für dieses Blog wurde damals in 2017 auf grüner Wiese entwickelt und hat seit dem nur wenige updates erhalten. Es ist and der Zeit, es etwas zu überarbeiten.

Das Redesign

Nun, Jblog wurde genau so gebaut, wie ich das brauche. Für den Redesign habe ich das als Basis genommen und von da an weiter gearbeitet. Das ganze Projekt hat ca. zwei Monate gedauert (an Wochenenden und Abends). Wenn ich die netto Zeit schätzen müsste, die in das Projekt geflossen sind, käme vermutlich etwas um die 40h reine Arbeitszeit raus.

Ich hab das Projekt mehr oder minder spontan gestartet und eigentlich ohne einen echten Plan, was ich genau erreichen wollte. Der Auslöser war, dass ich meine Blog Posts gerne mit einem brauchbaren Editor bearbeiten wollte und nicht mit einem "einfachen" HTML-Widget.

Das in die Webseite zu integrieren wäre auch eine Lösung gewesen, aber lokal kann man wesentlich besser arbeiten, und kann seinen Editor aus 100en aussuchen. Viel flexibler.

Da ich der einzige User dieses Blogs bin, ist das auch sicher ein brauchbarer Weg (wieder mal alles auf meine Bedürfnisse zugeschnitten).

Lokales Editieren der Posts

Das Bearbeiten eines blog posts war ein wenig ein Gefummel mit der alten Software. Die Editor Ansicht war nicht besonders gut entwickelt (ja, von mir) und eigentlich hätte ich gerne ein paar coole Markdown features.

Ich wollte aber auch keinen aufgeblähten, fancy HTML-Widget, Markdown Editor einbauen. Eigentlich habe ich auch NeoVim und Obsidian genutzt, um meine Blog Posts zu bearbeiten. Ich musste dann aber den Text manuell in die Editor Seite einfügen. War etwas umständlich.

Die lokalen Daten

lokal werden die Daten in einem Verzeichnis gehalten, dass sowohl von Obsidian als auch von NeoVim aus erreichbar ist. Damit kann ich mit beiden (oder eigentlich beliebigen) Editoren die Seiten bearbeiten. Wobei Obsidian weit mehr ist, als ein Editor.

Blog Posts werden in Jblog2 durch einen eindeutigen Namen referenziert (eine ID haben sie auch noch, dass man den Namen evtl. auch ändern kann). Dieser Name wird als Verzeichnisname genutzt.

In diesem Verzeichnis gibt es eine Datei .settings.json, welche die Meta-Informationen über diesen Blog-Post enthält: Ersteller, Wann erstellt, Status, sichtbar auf welchen Blogseiten.

Dann sind da noch files für die englischen und deutschen Versionen des Texts sowie die teaser-Texte (die auf der Index-Seite gezeigt werden). Außerdem noch ein verzeichnis in dem in dem Post verwendete Bilder gespeichert werden.

Twitter vs X and API

Ich hatte in Jblog eigentlich twitter4j genutzt, aber seit geraumer Zeit funktioniert das nicht mehr richtig. Ich habe die Twitterunterstützung in JBlog2 entfernt. Vielleicht baue ich das irgendwann wieder ein.

History der posts

Als ich die Posts noch auf der Webseite editiert habe, musste es eine Möglichkeit geben, zwischen aktuellem Edit und der aktuellen Live version zu unterscheiden. Ich habe damals gleich eine history-Funktion eingebaut.

Eine Versionshistory aufzuheben war nicht wirklich nötig (aber cool 😉), also habe ich das relativ bald auf ein currentEdit und currentLive reduziert. Aber ihr versteht, wie es funktioniert.

Wenn man die Dateien jetzt lokal editiert, ist das eigentlich überhaupt nicht mehr nötig. Da ich hier ein git repository anlegen kann, bekomme ich so eine Versionshitorie. Der Text auf dem Verzeichnis ist der currentEdit und das, was an den Server gesendet wird ist die Live version.

Blog post status

Blog Posts haben aktuell einen Status NEW, DRAFT, LIVE und DELETED. Wobei NEW und DRAFT eigentlich gleich sind und keinen Unterschied haben. Eigentlich sind die States überflüssig geworden, da man das ganze über die Verzeichnisse abbilden kann.

die neue Rest API

Das war ja der Hauptgrund für dieses Projekt - erstellen einer API damit man lokal die Blog posts und zugehörige Informationen lokal mit einem Editor der Wahl editieren kann. Evtl. im Terminal mit NeoVim, oder mit einer Grafischen Oberfläche. oder auf dem iPhone / iPad.

ein paar Gedanken zu der API:

• so einfach wie möglich, straight forware implementierung, keine komplexen Frameworks
• Authentifizierung ist wichtig. Ich muss sicher stellen, dass mein Blog nicht wieder von irgendwelchen Spammern misbraucht wird (wie mit WordPress seinerzeit)
• Wie mache ich den Client? Wird eine eigene implementierung sein, aber in welcher Sprache? Was neues Lernen?

Das Frontend ist etwas alt geworden

Das Frontend war 2017 mit einem Pre-Release von bootstrap und irgendeinem freien Admin Theme erstellt worden. Das war ein guter Start, musste jetzt aber mal aktualisiert werden.

Ich habe mich für Bootstrap 5, Freemaker für SEO-relevante Seiten und VUE.js als Frontend framework entschieden.

Obwohl die Seiten hauptsächlich durch Freemarker mehr oder minder statisch erzeugt werden, nutze ich Vue.js doch für die Authentifizierung und ein paar dynamische Seiten wie die Suchen.

Außerdem habe ich die Anzeigelogik ein wenig geändert. Akutell wird auf der Startseite neben dem Namen eines Blog-Eintrags auch ein "Teaser" oder "Textanlauf" gezeigt. Damit wird die Startseite nicht so überfüllt dargestellt.

Client

Den Client habe ich dann in Python3 implementiert. War eine gute Gelegenheit, meine Python Kenntnisse etwas aufzufrischen 😉

Es gibt ein größeres Python script, welches über Kommandozeilenparameter aktionen auslöst. Folgende Funktionen hab ich aktuell implementiert:

• Erstellen eines neuen Blogeintrags. Damit wird die Verzeichnisstruktur angelegt und der BlogPost beim Server als "NEW" angelegt
• Sync der Daten: damit werden die Serverseitig gespeicherten Informationen mit den lokalen verglichen. Und wenn es einen unterschied gibt, wird die Server-Version überschrieben. Gibt es den Eintrag lokal nicht, wird selbiger angelegt. Wichtig: wenn man auf verschiedenen geräten arbeitet, müssen die Verzeichnisse synchronisiert sein (iCloud Drive, OneDrive, git oder so), da man sonst evtl. änderungen überschreibt. Das lokale Verzeichnis hat immer recht!
• Metadaten eines Post anzeigen
• Vorschau eines Posts öffnen
• Kategorien runterladen oder auf den Server spielen

Damit kann eigentlich alles realisiert werden, wofür ich sonst eine HTML-Oberfläche gebraucht hätte. Die Implementierung dieses Python-Scripts hat vermutlich ca. 10h in Anspruch genommen (aber auch nur deswegen, weil mein Python etwas eingerostet war, musste sehr viel nachschlagen)

Fazit

Das war ein nettes projekt nebenbei, ich hab viel gelernt und am schluss sogar einer hübschere Seite hin bekommen (glaube ich). Es gibt sicher noch einige Dinge zu tun, aber aktuell ist das ein ganz guter Start.