bansemir.net DE | EN

So wurde diese Website gebaut

AI-assisted Development mit Claude Code -- eine dokumentierte Session

63min

Implementierung

21

Workpackages

9

AI-Agenten

11k

Zeilen Code

1 Stunde statt 4-5 Wochen

Das PRD schätzte 4-5 Wochen für die Umsetzung. Die reine Implementierung dauerte 63 Minuten. Mit Planung, Tests, Deployment und Post-Launch-Fixes waren es insgesamt 5 Stunden -- an einem Abend. 21 Workpackages, 30 Dateien, 9 spezialisierte AI-Agenten, 10.834 Zeilen Code.

Ausgangslage

Der Content wurde in einer Cowork-Session vorbereitet: Projektbeschreibungen, Skills-Daten, Toolkit-Texte -- alles als strukturierte JSON-Dateien. Ein PRD (v2.1, 997 Zeilen) definierte Architektur, MVC-Regeln und Agenten-Zuordnung. Die Basis für den Build war gelegt.

Content-Vorbereitung in der Cowork-Session
Alle Content-Dateien wurden in einer Cowork-Session verifiziert und finalisiert.

Planung

Vor der ersten Zeile Code: offene Fragen geklärt. Calendly-URL, Portrait-Foto, SAPUI5-Version (1.136 LTS statt 1.460), Theme-Entscheidung (Standard Fiori statt Custom). Ein Project-Planner-Agent zerlegte das PRD dann in 21 Workpackages, verteilt auf 6 Ausführungswellen mit klaren Abhängigkeiten.

Klärung offener Entscheidungen vor Implementierung
Offene Punkte geklärt: Calendly, Foto, Version, Theme -- bevor die Implementierung startet.
Workpackage-Plan: 21 Pakete in 6 Ausführungswellen
21 Workpackages in 6 Wellen -- jedes mit zugewiesenem Agenten und Abhängigkeiten.

Implementierung

6 Wellen, bis zu 7 Agenten parallel. Welle 1: App-Skeleton und Git-Setup (10 Minuten). Welle 4: sieben Features gleichzeitig -- Hero, Skills-Matrix, Projekterfahrung, Toolkit, Built-with-AI, Kontakt und Footer. 63 Minuten für alle 21 Workpackages, vom ersten Commit bis zum letzten Quality Gate.

Ausführungswellen mit parallelen und sequenziellen Agenten
Welle 4: sieben Agenten arbeiten gleichzeitig an verschiedenen Features.
Vier AI-Agenten arbeiten parallel an Infrastruktur-Aufgaben
Parallele Ausführung: jeder Agent bearbeitet sein Workpackage unabhängig.

Qualitätssicherung

11 End-to-End-Tests, ein Code Review (3 Major Findings gefixt), ein Accessibility Audit (7 Fixes für WCAG AA). UI5 Linter: 0 Errors, 0 Warnings. Erster Testlauf: 8 von 8 fehlgeschlagen. Sechs Runtime-Bugs identifiziert und behoben -- darunter deprecated manifest.json-Attribute und ein i18n-Fallback-Problem. Zweiter Testlauf: 11 von 11 bestanden.

End-to-End-Testplan für alle Seiten und Funktionen
Strukturierter Testplan: 11 Tests für SAPUI5-App, Landing Pages und Legal-Seiten.
Vollständige SAPUI5-App mit Skills-Matrix und Projektliste
Die fertige App nach allen Bugfixes: Skills-Tabelle, Projekterfahrung, Toolkit.

Problem-Lösung

Drei Probleme forderten iteratives Debugging. Die ShellBar war in sap_fiori_3 unsichtbar (weiss auf weiss) -- nach 6 Versuchen gelöst durch Wechsel von Content zu customHeader. sap_horizon war mit SAPUI5 1.136 inkompatibel -- zurück auf sap_fiori_3. Der Sprachwechsler verlor die Auswahl nach Reload -- gelöst durch URL-Parameter statt In-Memory-State.

Analyse des ShellBar-Rendering-Problems in sap_fiori_3
ShellBar-Debugging: DOM-Analyse und 6 Iterationen bis zur strukturellen Lösung.
Iterative Lösung des Sprachwechsler-Bugs
Sprachwechsel-Bug: von Select-Dropdown über Button-Pattern bis URL-Parameter.

Go-Live

Build via @ui5/cli, Deploy via SFTP zu IONOS. 44 Dateien, 604 KB. Sofort ein Berechtigungsproblem: JSON-Dateien hatten 600 statt 644 -- 403 Forbidden. Fix: chmod nach jedem Deploy. Cache-Control per .htaccess (max-age 300 Sekunden). Der SAP Application Cache Buster war nicht kompatibel mit statischem Hosting.

Deployment-Übersicht und Phasen-Roadmap
Deployment zu IONOS: 44 Dateien, ein Berechtigungsfix, Cache-Control konfiguriert.

Ergebnis

63 Minuten reine Implementierung. 90 Minuten Post-Launch-Fixes (ShellBar, Theme, Sprache, Cache). 45 Minuten Content-Extraktion in Templates. AI schreibt nicht magisch perfekten Code -- aber mit dem richtigen Workflow wird es ein massiv beschleunigter, qualitätsgesicherter Prozess. Die gesamte Session ist als Open-Source-Projekt auf GitHub dokumentiert.

Implementierungs-Timeline: 63 Minuten für die komplette App
Zeittabelle: jede Phase mit Dauer -- von der Planung bis zum Content-Update.
Session-Abschluss: Log geschrieben, Kontext gespeichert
Session-Ende um 00:45 Uhr: Log geschrieben, Memory gespeichert, 19 Commits.