Sebastian Heẞ

Ich bin kein großer Freund von dicken und fetten PHP Monstern, wie Wordpress. Mir ist es am Liebsten meinen persönlichen Workflow aus VIM, git und einigen Skripten nicht brechen zu müssen.

Nun ist diese Webseite mein Aushängeschild im privaten und potentiell auch im geschäftlichen, daher möchte ich etwas Einblick in die Technik dahinter geben. Möglicherweise inspiriert es ja den ein oder anderen dazu sich mit kleineren Tools auseinanderzusetzen und nicht immer gleich die Wordpress / Typo3 Keule zu schwingen :)

Für mich muss das Erstellen von neuer Texte nicht mehr Arbeit bedeuten als das Anlegen einer Datei, das Commiten und Pushen in git. Der Rest muss vollständig automatisch ablaufen. Genau diesen Workflow habe ich für mich mit Hugo gefunden.

Meine Hauptanforderungen sind im Bereich des Datenschutz und der Datensparsamkeit zu finden, ich möchte keine Cookies, ich möchte keine Daten meiner Besucher an Google, Meta oder andere amerikanische Unternehmen übertragen. Aus diesem Grund sind alle Dateien, egal ob Stylesheet, Font oder Grafik, bei mir lokal gehostet. Auch hier bietet Hugo eine elegante Lösung mit dem ablegen von Assets und statischen Dateien an.

Als Theme habe ich mich für Almeida CV entschieden und entsprechend meiner Anforderungen angepasst. Neben dem reinen CV sind nun Blogeinträge oder statischer Seiten möglich. Außerdem gibt es einen Bereich für Gremien, Ehrenamt und die Verlinkung des Blogs.

Sobald ich einen neuen Blogpost mit hugo new content/de/$datum-$name.md angelegt habe, muss ich für das Theme noch Tags und eine Beschreibung (description) im Header der Datei setzen und danach einfach drauf los tippen. Mit hugo server -d kann ich mir meine Seite dann lokal anschauen und prüfen, dass alles soweit passt.

Sobald ich mit dem Ergebnis zufrieden bin reicht git add content/de/$datum-$name.md; git commit -a -m'New blogpost on $datum; git push und mein gitea Server baut die neue Webseite und lädt diese per rsync auf meinen VServer.

gitea habe ich erst in den letzten Monaten richtig kennen und lieben gelernt. Es ist schlank, einfach und schnell. Wir haben in der Firma auf gitlab gesetzt; im privaten reicht mir gitea allerdings komplett aus und durch die Integration bei TrueNas bleibt es stets aktuell.

Seit einiger Zeit hat gitea auch gelernt über sogenannte “Runner” Bauanleitungen/Pipelines auszuführen. Genau einen solchen nutze ich aktuell, um die Änderungen an meiner Webseite automatisch hochzuladen. Dabei habe ich mich explizit dazu entschlossen auf dem Server einen Nutzer anzulegen, welcher nur auf das Verzeichnis der Webseite Zugriff hat und außer rsync keine weiteren Befehle ausführen darf. Der Nutzer authentifiziert sich am VServer über einen SSH Keys, der sich ebenfalls im git Repository befindet. Da außer mir niemand Zugang zu diesem privaten git hat, ist dies sicherheitstechnisch unkritisch.

 1name: Build webpage hessdev.de
 2run-name: Build running on ${{ gitea.actor }} for hessdev.de
 3
 4# Define the brances to run this script on
 5on:
 6  push:
 7    branches:
 8      - main
 9
10jobs:
11  deploy-prod:
12    runs-on: ubuntu-latest
13    steps:
14      - name: Check out repository code
15        uses: actions/checkout@v3
16        with:
17          token: ${{ secrets.BUILD_TOKEN }}
18          submodules: 'true'
19      - name: Install apt packages
20        run: |
21          apt update && apt install -y jq rsync
22      - name: Get latest Hugo version
23        run: |
24          url=$(curl --silent "https://api.github.com/repos/gohugoio/hugo/releases/latest" | jq -r '.assets[] | select(.name | contains("linux-amd64.tar.gz")) | .browser_download_url' | grep -E 'hugo_[0-9]+\.[0-9]+\.[0-9]+_linux-amd64.tar.gz')
25          wget -P /tmp/hugo/ "$url"
26      - name: Unpack Hugo
27        run: |
28          mkdir -p ${{ gitea.workspace }}/bin
29          tar -xf /tmp/hugo/* -C ${{ gitea.workspace }}/bin
30      - name: Build the static webpage
31        run: |
32          ${{ gitea.workspace }}/bin/hugo --minify
33      - name: rsync public directory
34        run: |
35          chmod 600 .gitea/ssh-key
36          rsync -avz --delete -e "ssh -i .gitea/ssh-key -o StrictHostKeyChecking=no" ${{ gitea.workspace }}/public/* username@hessdev.de:/var/www/hessdev/

Der Ablauf ist relativ einfach in der YAML Datei beschrieben und jeder Commit auf den Branch main führt automatisch zu einer aktuellen Webseite.

Diese Seite nutzt keine Cookies. Diese Seite bindet keine Ressourcen abseits der eigenen Domain ein. Wir speichern den Zeitpunkt, die IP und den genutzten Browser zu Sicherstellung des Betriebs des Webservers.

Es handelt sich bei dieser Webseite um eine rein private Seite, weshalb keine Verpflichtung für ein Impressum oder der Bestimmung eines Datenschutzbeauftragten besteht.

Alle Inhalte sind - sofern nicht anders angegeben - durch Sebastian Heß erstellt und entsprechend geschützt. Das Theme stammt von Inês Almeida.