In eigener Sache: Wie dieser Blog gebaut ist
Diesen Blog gibt es erst seit ein paar Tagen, und er hat eine eigene kleine Entstehungsgeschichte. Ich wollte zeigen, woran ich an GODAV Pro arbeite und warum ich Dinge so entscheide, wie ich sie entscheide. Dafür brauchte es eine Seite, die sich leicht pflegen lässt, sicher ist und keine Daten verrät, die nicht nach draußen gehören. In diesem Beitrag erzähle ich, wie sie aufgebaut ist.
Die Startseite holt Version und Roadmap-Stand direkt aus GODAV.
Statische Seiten statt eines Blogsystems
Die naheliegende Wahl wäre ein fertiges Blogsystem gewesen. Ich habe mich dagegen entschieden, und zwar aus einem einfachen Grund: Ein Blogsystem ist eine Anwendung mit Datenbank und Anmeldung, die im Internet steht und dort gepflegt, aktualisiert und abgesichert werden muss. Für ein paar Beiträge im Monat ist das viel Angriffsfläche.
Stattdessen erzeugt Astro aus den Texten fertige HTML-Seiten. Auf dem Webspace liegen danach nur Dateien, die ausgeliefert werden. Es gibt dort kein Login, das man erraten, und keine Datenbank, die man angreifen könnte. Nebenbei läuft das auf jedem günstigen Webspace.
Die Gestaltung lehnt sich an GODAV an: dieselben Farben und Schrift, weiße Karten mit feinem Rahmen, Hell- und Dunkelmodus. Eine Ausnahme habe ich bewusst gemacht: Statt der dunklen Seitenleiste von GODAV gibt es eine dunkle Kopfleiste. Ein Blog wird gelesen, nicht bedient, und auf dem Smartphone würde eine Seitenleiste die halbe Breite kosten.
Ein Kontaktformular ohne Drittanbieter
Das Einzige, was auf dem Server wirklich etwas tun muss, ist das Kontaktformular. Dafür gibt es ein kleines PHP-Skript, das auf praktisch jedem Webspace läuft und nur eine Aufgabe hat: die Nachricht prüfen und per Mail an mich weiterleiten.
Gegen Spam schützt ein Captcha, und hier war die Entscheidung schnell getroffen. Die bekannten Captchas kommen von großen Anbietern, binden deren Skripte ein und setzen oft Cookies. Das verlangt einen Hinweis in der Datenschutzerklärung und wirkt sich auf die Besucher aus. Ich nutze stattdessen ALTCHA, selbst gehostet. Statt Ampeln oder Zebrastreifen anzuklicken, löst der Browser eine kleine Rechenaufgabe, die etwa eine Sekunde dauert. Für einen Menschen ist das unauffällig, für jemanden, der tausend Formulare abschicken will, eine spürbare Rechnung. Kein Drittanbieter, keine Cookies, kein Bilderrätsel.
Dazu kommt eine Sperre pro Absender: Von einer Adresse lassen sich nur wenige Nachrichten pro Stunde und Tag senden. Die IP-Adresse wird dafür nicht gespeichert, sondern nur ein nicht umkehrbarer Hashwert davon. Für die Sperre genügt es zu wissen, dass zwei Anfragen von derselben Adresse kamen. Welche Adresse das war, muss ich nicht wissen.
Ein Backend nur auf meinem Rechner
Geschrieben wird nicht auf dem Webspace, sondern in einem lokalen DevBlog-Backend. Es läuft ausschließlich auf meinem eigenen Rechner, ist von außen gar nicht erreichbar und verlangt trotzdem ein Passwort. Die doppelte Sperre ist Absicht: Falls doch jemand an meinem Rechner sitzt oder eine fremde Webseite im Browser versucht, dorthin zu schreiben, steht noch eine zweite Tür davor.
Alle Inhalte liegen als Dateien in einem Ordner: Beiträge als Markdown, Roadmap und Features als Daten, Bilder daneben. Ein Ordner ist eine Sicherung, und er lässt sich mit Git versionieren wie Quellcode.
Links Markdown, rechts die Vorschau: Was ich schreibe, sehe ich so, wie es später erscheint.
Verpixeln, bevor etwas online geht
Die meisten Bildschirmfotos in diesem Blog stammen aus meiner Entwicklungsumgebung. Beim Schreiben der ersten Beiträge habe ich dabei etwas gelernt: Die Entwicklungsdatenbank enthält neben den Demodaten auch echte Daten. Projektnamen, Anfragende, interne Adressen. Auf den ersten Blick sieht man den Unterschied nicht.
Deshalb hat das DevBlog-Backend ein eigenes Verpixelungswerkzeug. Man zieht Rechtecke über alles, was nicht öffentlich sein darf, und ein Klick ersetzt die Bereiche. Ich verpixele dabei, statt weichzuzeichnen: Ein leichter Weichzeichner lässt sich bei Text oft zurückrechnen. Beim Verpixeln wird jeder Bereich auf wenige Blöcke verkleinert, und die ursprünglichen Pixel sind danach nicht mehr im Bild. Das Original wird ersetzt, damit es beim nächsten Hochladen nicht doch wieder mitkommt. Außerdem wird jedes hochgeladene Bild neu kodiert, wobei Ortsangaben und Kameradaten verschwinden.
Rechtecke aufziehen, „Verpixeln” klicken, fertig.
Prüfen, bauen, hochladen
Vor dem Hochladen prüft das DevBlog-Backend die veröffentlichten Inhalte. Übrig gebliebene Platzhalter, etwa im Impressum, sperren das Hochladen. Eine Seite ohne gültiges Impressum wäre ein rechtliches Problem und kein kosmetisches. Mailadressen, IP-Adressen, lokale Pfade oder interne Projektnamen im Text erscheinen als Warnung, die ich mir ansehen soll.
Ist alles in Ordnung, baut ein Klick die Seite und lädt sie per SFTP oder verschlüsseltem FTP hoch. Übertragen wird nur, was sich seit dem letzten Mal geändert hat.
Keine Fehler, keine Warnungen: Der Weg zum Hochladen ist frei.
Verbunden mit GODAV
Zwei Verbindungen gibt es zwischen Blog und GODAV, und beide sind bewusst nur in eine Richtung angelegt:
- Die Roadmap holt das Block-Backend auf Knopfdruck live aus der laufenden GODAV-Instanz, und zwar mit einem API-Schlüssel, der nur lesen darf. Es schreibt dort nie, also soll es das auch nicht können. Die Erklärungen zu den einzelnen Punkten pflege ich im Blog, und ein Abgleich überschreibt sie nicht.
- Neue Beiträge entstehen beim Nachziehen der Dokumentation in GODAV gleich mit: Wenn ich dort Neuerungen und Hilfe aktualisiere, wird zum Schluss ein Blogbeitrag als Entwurf angelegt. Veröffentlicht wird er erst, wenn ich ihn gelesen und nach meinen Vorstellungen angepasst habe. KI schreibt gut, aber auch ein bisschen seelenlos.
Der Blog selbst liegt in einem eigenen Ordner neben GODAV. Nichts davon gerät in das Installationspaket von GODAV.
Außerdem
- Die ersten elf Beiträge, einer je Version, sind parallel von mehreren KI-Agenten entworfen worden, nach denselben Regeln für Stil und Datenschutz. Gelesen, geprüft und verpixelt wurde danach trotzdem jedes Bild einzeln. Mehr dazu auf der Seite Arbeit mit KI.
- Bildschirmfotos lassen sich per Klick in voller Größe öffnen.
- Es gibt einen RSS-Feed für alle, die neue Beiträge nicht verpassen wollen.
Wie es weitergeht
Der Blog wird ständig aktualisiert.
Zusätzlich sagen Videos mehr als Worte. Zu den wichtigsten Features möchte ich Videos aufnehmen und online stellen. Die nächste Skillerweiterung: Videoschnitt und -bearbeitung steht an.
Darüber hinaus überlege ich noch, ob ich eine Online-Demoversion anbieten kann.