Finnegan Berz
Alle Projekte

Dieses Portfolio

Neuaufbau meiner Website als statischer One-Pager – mit Tests zuerst, eigenem Design-System und KI-Agenten, die Issues in getrennten Branches umsetzen.

Jahr
Rolle
Konzept, Design und Entwicklung
Stack
Nuxt, Vue, TypeScript, Nuxt Content, Vitest, Playwright, Cloudflare Workers
Startseite dieses Portfolios: links Name, Rolle, Einleitungssatz und Kontakt-Button, rechts mein Porträtfoto im Grünen

Ausgangslage

Meine alte Seite war eine Sammlung aus Karten, Kennzahlen und einem Baustellen-Hinweis, der beim Öffnen die ganze Seite verdeckte. Sie sagte wenig über mich und sah aus wie viele andere. Ich wollte eine ruhige Seite, die in einer halben Minute zeigt, wer ich bin und woran ich arbeite – und die ich ohne Angst ändern kann.

Meine Rolle

Konzept, Gestaltung und Umsetzung. Größere Aufgaben habe ich als GitHub-Issues so ausführlich beschrieben, dass KI-Agenten (Claude Code) sie selbstständig in eigenen Branches umsetzen konnten. Jeden Pull Request habe ich vor dem Merge geprüft und freigegeben.

Umsetzung

  • Inhalte als Daten: Texte, Werdegang und Stack liegen in Nuxt Content mit Zod-Schemas. Ungültige Inhalte brechen den Build ab.
  • Komponenten statt Seiten: Die Startseite ist eine Folge von Sections, jede mit eigenem Test und eigener Doku.
  • Tests zuerst: Vitest für Logik und Komponenten, Playwright für Abläufe, Barrierefreiheit (axe), Hydration-Fehler und Screenshots in hellem und dunklem Modus, mobil und am Desktop.
  • Datenschutz als Test: Automatische Prüfungen stellen sicher, dass keine Ortsangaben und keine Bild-Metadaten veröffentlicht werden.
  • Auslieferung: Statisch generiert und über Cloudflare Workers ausgeliefert. Jeder Merge auf master geht automatisch live; die CI stellt den Cloudflare-Build vorher nach.

Ergebnis

Eine Seite ohne Template-Optik, die in der CI bei jedem Pull Request vollständig geprüft wird – und ein Arbeitsablauf, in dem ich Aufgaben beschreibe, prüfe und entscheide, während Routinearbeit automatisiert läuft.