Einleitung
Immer wieder versuche ich mehr oder weniger strukturiert Blogs zu betreiben. Der letzte war mit Hilfe von WordPress und hatte eigentlich mehr Funktionalität wie gedacht - Inhalt war allerdings keiner da. Nun nehme ich mir vor, regelmäßiger Blog-Einträge zu schreiben als früher und beginne mit dem heutigen, mit Fokus auf AI-Tools und Code-Generierung.
Heute habe ich die ganze Webseite mit Claude Code modernisiert: SEO-Meta-Tags hinzugefügt, PWA-Funktionalität implementiert, i18n für Deutsch/Englisch eingebaut, den CV komplett redesigned (von zwei-spaltig auf moderne Card-basierte Single-Column-Ansicht) und ein Mini-Python-Script generiert, das mir aus Markdown-Dateien Blog-Einträge macht. Die Webseite ist jetzt zu 100% statisch - kein Backend, keine Datenbank, keine Sicherheitsrisiken.
The Good
Wenige Anweisungen und schwuppdiwupp hat alles funktioniert und die Webseite war geupdated. Der Blog-Generator ist elegant simpel: Markdown-Dateien in blog_entries/en/ und blog_entries/de/, Frontmatter mit Titel und Datum, und python3 generate.py generiert statische HTML-Seiten mit automatischer Verlinkung von Übersetzungen. Kein WordPress, kein PHP, keine Sicherheitslücken - nur statische Files.
Das CV-Redesign von der alten Zwei-Spalten-Ansicht (die auf Mobile eh nicht funktioniert hat) zu modernen Cards mit Skill-Tags statt fragwürdigen Prozentbalken sieht wirklich gut aus. Die i18n-Integration funktioniert nahtlos mit Browser-Spracherkennung und localStorage für User-Präferenzen.
The Bad
Es gab einen Fehler bei der mobilen Version - die Ausrichtung der Navigation hat nicht gepasst. Das Hamburger-Menü war komplett off-screen, und bis der Prompt präzise genug war, dass Claude das Problem verstanden hat, hätte ich es auch selber lösen können. Es dauerte mehrere Iterationen mit verschiedenen CSS-Ansätzen (Flexbox, dann absolute Positioning, dann wieder Flexbox mit anderen Properties), bis ich explizit sagte "use maybe icons only in the menu for mobile" und Claude dann endlich den kompletten Top-Bar-Ansatz vereinfacht hat: Nur Hamburger-Button oben, alles andere im Dropdown.
Claude hat auch teilweise Lösungen vorgeschlagen, die das Problem nicht wirklich adressiert haben - "try this CSS" ohne zu verstehen, warum es off-screen war. Das klassische "let me try something else" statt "let me understand the root cause". Bei so was wäre ein Screenshot hilfreich gewesen, aber das geht halt nicht.
The Ugly
Tokens und User-Limits: Besonders mit Claude und dem neuesten 4.6er Modell erreicht man sehr schnell die Limits. Es ist ein bisschen wie bei den "Free to Play"-Games - man wird verleitet, mehr Tokens zu kaufen. Eine Session mit mehreren Redesign-Iterationen, Blog-Generator-Entwicklung und Mobile-Debugging frisst locker 100k+ Tokens.
Context-Komprimierung: Nach einer Weile werden alte Messages komprimiert. Claude "vergisst" dann Details aus früheren Schritten. Ich musste mehrmals erklären, dass die Hero-Section auf Mobile komplett versteckt werden soll, nicht nur verkleinert.
Halluzinationen bei File-Reads: Claude hat manchmal behauptet, Dateien gelesen zu haben oder wusste von Inhalten, die es nicht gelesen hatte. Bei generate.py musste ich explizit sagen "read the file first" bevor es editieren konnte, sonst kam "File has not been read yet"-Error.
Over-Engineering-Tendenz: Claude wollte initial ein komplexes Blog-System mit separaten Index-Seiten pro Sprache und fancy Navigation bauen. Ich musste mehrmals sagen "keep it simple" - am Ende ist es ein 150-Zeilen Python-Script mit Jinja2-Templates. Manchmal ist weniger mehr.
Inkonsistente Tool-Nutzung: Manchmal nutzt Claude Bash mit grep statt dem Grep-Tool, obwohl das explizit in den Instructions steht. Oder versucht mit find zu arbeiten statt Glob. Das führt zu unnötigen Umwegen.
Das "Let me..." Syndrom: "Let me read the file", "Let me update the CSS", "Let me verify" - es wird viel angekündigt statt einfach gemacht. Bei 30+ Tool-Calls summiert sich das.
Fazit
Trotz der Limitierungen: Die Webseite ist modernisiert, der Blog funktioniert, und ich habe jetzt ein Setup, mit dem ich tatsächlich bloggen kann. Das Python-Script ist wartbar, die Struktur ist klar (blog_entries/de/ vs blog_entries/en/), und die generierten HTML-Seiten sind sauber.
Würde ich es wieder mit Claude machen? Ja, aber mit mehr Struktur: Erst Requirements klären, dann in kleinere Tasks aufteilen, und bei CSS-Problemen früher selber debuggen statt 10 Iterations mit dem AI zu verschwenden.
Was ich noch lernen muss: Die Nutzung von Claude optimieren, um weniger Tokens zu verschwenden. Das heißt: Die richtigen Dinge in den Context füttern (nicht alles auf einmal), Skills richtig nutzen (statt alles selbst zu machen), und CLAUDE.md sinnvoll pflegen, damit Claude beim nächsten Mal direkt weiß, wie das Projekt strukturiert ist. Heute haben wir 100k+ Tokens verbraten - hätte mit besserer Vorbereitung wahrscheinlich die Hälfte gereicht.
Das Wichtigste: Die Seite ist jetzt statisch, sicher, und wartbar. Kein WordPress, das gehackt werden kann. Kein PHP, das Updates braucht. Nur HTML, CSS, und JavaScript. Und genau so soll es sein.
Code auf GitHub: Wer sich das ganze Setup anschauen will - der komplette Code der Webseite inklusive Blog-Generator ist auf GitHub: github.com/tobiwan88/trmk. Feel free zu stöbern, Verbesserungen vorzuschlagen, oder das Setup für eigene statische Blogs zu nutzen.
Nächster Post: Lass uns probieren ein embedded projekt (wetter station) mit claude zu genieren, der versuch mit cline war weniger erfolgreich vor ein paar wochen.