Wie meine Website aufgebaut ist: Astro mit Markdown, Azure Static Web Apps und Github Copilot

Ich bin gefragt worden, welche Technologie hinter meiner Website steckt. Dieser Artikel gibt einen kurzen technischen Überblick über die einzelnen Bausteine und den Weg von einem neuen Markdown-Artikel bis zur veröffentlichten Seite.

Meine Ziele

1. Ich will einfach bloggen. Möglichst einfach und nicht viel Zeit mit irgendwelchen Editoren verschwenden, wo ich dann in 10 Menüs irgendetwas einstellen muss.
2. Möglichst kostengünstig.
3. Möglichst am Stand der Technik.
4. KI verwenden. Nicht nur, um mir die Arbeit zu erleichtern, sondern weil das auch Learning by Doing ist.

Die Bausteine

Astro

Das Grundgerüst basiert auf Astro. Astro erzeugt aus den Seiten und Markdown-Artikeln eine statische Website. Das passt gut zu einem Blog, weil die fertigen Seiten schnell ausgeliefert werden können und kein eigener Anwendungsserver für die Darstellung der Artikel notwendig ist.

Markdown und Astro-Komponenten

Die Artikel liegen als Markdown-Dateien im Repository. Frontmatter enthält die Metadaten wie Titel, Beschreibung, Datum, Sprache und Tags. Astro-Komponenten und Layouts übernehmen die gemeinsame Darstellung, zum Beispiel Header, Footer, Navigation, SEO-Metadaten und Blog-Artikel.

Tailwind CSS

Tailwind CSS wird für die Gestaltung verwendet. Farben, Abstände und die Darstellung für helle und dunkle Oberflächen werden zentral über die Styles der Website gesteuert.

Azure Static Web Apps

Azure Static Web Apps hostet die fertige Website. Für einen Blog mit statischen Seiten ist das eine passende und kostengünstige Lösung.

Ich verwende die kostenlose Variante, die für meine Zwecke ausreichend ist. Dort sind 100 GB Bandbreite pro Monat inklusive.

Umami

Umami wird für die Webanalyse verwendet. Es ist ein datenschutzfreundliches, cookiefreies Tool, das die Nutzung der Website ohne personalisierte Trackings analysiert und damit zu den Anforderungen an Datenschutz und DSGVO passt. Für meine Nutzung ist Umami kostenfrei und ohne API-Support.

Vom Artikel zur veröffentlichten Seite

Ich schreibe und bearbeite die Artikel in Visual Studio Code. Der Inhalt wird zusammen mit dem restlichen Projekt in ein GitHub-Repository gepusht.

Eine GitHub Action startet danach den Build. Astro prüft und erzeugt die statischen Dateien. Wenn der Build erfolgreich ist, werden sie automatisch in Azure Static Web Apps veröffentlicht.

Durch ein optionales Veröffentlichungsdatum kann ich einen Artikel außerdem vorbereiten und erst später sichtbar machen. Der eigentliche Veröffentlichungsprozess läuft dann weiterhin automatisch.

Mehrsprachigkeit und SEO

Die Website ist auf Deutsch und Englisch verfügbar. Die Sprachversionen eines Artikels werden miteinander verknüpft, damit Besucher zwischen den Sprachen wechseln können.

Für Suchmaschinen werden unter anderem Titel, Beschreibungen, Canonical URLs, Open-Graph-Daten und strukturierte Daten erzeugt. Das passiert über die gemeinsamen Layouts und muss nicht für jeden Artikel neu gebaut werden.

Die Rolle von GitHub Copilot

GitHub Copilot hat mich beim Erstellen des Grundgerüsts, beim Übersetzen und beim Korrigieren unterstützt. Die Änderungen werden trotzdem geprüft und getestet, bevor sie veröffentlicht werden. Copilot ersetzt also nicht den Build und die Kontrolle, sondern beschleunigt verschiedene Arbeitsschritte.

Die Bilder für die Website erstelle ich mit Microsoft Copilot - für den Prompt dafür, lasse ich mir ebenfalls von Microsoft Copilot helfen.

Trotz der ganzen KI: Das sind nur Tools, die mir helfen, einen besseren Output zu erzeugen.

Zu den Kosten: GitHub Copilot kostet aktuell 10 US-Dollar pro Monat für Pro, 39 US-Dollar pro Monat für Pro+ und 100 US-Dollar pro Monat für Max. Ich habe GitHub Copilot Max. Für die erstmalige Erstellung der Website wäre wahrscheinlich Pro+ ausreichend gewesen, weil dort bereits bessere Modell-Optionen und Agenten verfügbar sind. Pro hat zwar auch den Zugang zu Agents, aber die Credits sind bei der täglichen Nutzung deutlich enger. Ich habe die Website im April erstellt, als es noch Credits ohne Ende gab.

Wenn das Blog einmal steht, ist für den laufenden Betrieb im Wesentlichen nicht viel zu tun. Artikel schreiben und übersetzen – das funktioniert auch ohne KI, aber natürlich auch mit der GitHub Copilot Free-Version oder Microsoft Copilot Basic. Wenn man regelmäßig Astro-Updates machen will (aus Securitysicht nicht notwendig, da statische Webpage), dann ist hier vermutlich mehr Spaß mit GitHub Copilot Pro.

Kostenübersicht

Dienst	Kosten	Bemerkung
Azure Static Web Apps	0 €	Kostenlose Variante ausreichend
Domain / Name	Preis domänenabhängig	Je nach TLD, Anbieter und Verlängerung variabel
GitHub Copilot Pro	10 $ / Monat	Günstigste bezahlte Variante
GitHub Copilot Pro+	39 $ / Monat	Bessere Modell- und Agenten-Optionen
GitHub Copilot Max	100 $ / Monat	Meine Auswahl für intensivere Nutzung
Umami	0 $ / Monat	Datenschutzfreundliche Analyse, kostenfrei und ohne API-Support
GitHub / Repository	0 €	Für einen privaten Blog ausreichend

Fazit

Die Kombination aus Astro, Markdown, GitHub, GitHub Actions, Umami, Microsoft Copilot, GitHub Copilot und Azure Static Web Apps erfüllt meine ursprünglichen Ziele: Artikel lassen sich einfach schreiben, die Veröffentlichung ist automatisiert, die Analyse bleibt datenschutzfreundlich und die laufenden Kosten bleiben überschaubar. Und natürlich: es wird immer offensichtlicher, was mit am MVP Summit 2025 klar wurde: wenn du etwas entwickelst, benötigst du Github Copilot - oder ein Konkurenzprodukt.