Making-of
Wie diese Seite entstanden ist
Stand: August 2026 · wird fortgeschrieben
Diese Website ist bewusst beides: mein Lebenslauf und eine Arbeitsprobe. Der komplette Quellcode ist öffentlich — inklusive der Recherche, der verworfenen Designentwürfe und der Architekturentscheidungen.
Architektur
Die öffentliche Seite ist eine statisch vorgerenderte Angular-Anwendung. Inhalte pflege ich in einem privaten, nur lokal laufenden Backend („Studio": .NET 10, EF Core, SQLite) und veröffentliche sie als JSON ins Repository; der Site-Build liest ausschließlich diese Datei. Es gibt kein öffentliches Laufzeit-Backend, keine Cookies, kein Tracking. Ein Sichtbarkeitsflag im Datenmodell trennt, was auf die Website darf und was nur in Bewerbungsdokumente gehört — automatisierte Tests erzwingen das.
Design
Vor dem Design stand Recherche: was auf Entwickler-Portfolios alle machen (Skill-Prozentbalken, Template-Layouts, Typewriter-Effekte) — und was ich deshalb weglasse. Aus fünf Entwürfen wurde die Richtung „Cinematic": dunkle Bühne, Partikelfeld, scroll-gezeichnete Timeline. Alle Effekte sind handgeschriebenes Vanilla-JS/CSS hinter einem gemeinsamen Animations-Loop, respektieren prefers-reduced-motion, und ohne JavaScript bleibt die Seite vollständig lesbar. Schriften liegen lokal, es wird nichts von Dritt-Servern nachgeladen.
KI-Einsatz
Gebaut habe ich die Seite mit Claude Code — bewusst als Test, wie weit professionelle KI-gestützte Entwicklung trägt: verbindliche Projektregeln in einer CLAUDE.md, Architekturentscheidungen als ADRs, phasenweise Commits, Recherche und Entwürfe im Repo nachvollziehbar. Die Gegenprobe ist mein Lernprojekt FamHub, das ich komplett ohne KI von Hand schreibe.
Eckdaten
- Alle Seiten statisch vorgerendert; rund 82 KB initialer Transfer
- Backend-, Studio- und Site-Tests laufen in jeder CI-Pipeline
- Hosting über ein CDN, laufende Kosten: 0 €