Ein Erfahrungsbericht über den produktiven Einsatz von ChatGPT und CursorAI in der Frontend-Entwicklung.
Warum ich KI beim Coden nutze und wofür nicht
Ich nutze KI nicht, um meine Arbeit als Entwickler einfacher zu machen. Im Gegenteil: Ich setze sie gezielt ein, um klarere Strukturen zu schaffen, Codequalität zu erhöhen und komplexe Anforderungen besser zu lösen.
Die Versuchung ist groß, generierten Code einfach zu übernehmen. Doch langfristig erzeugt man so mehr Baustellen als Lösungen. KI funktioniert nicht als Kopiermaschine, sondern als intelligenter Co-Pilot.
Die Ausgangsfrage: Was lässt sich mit Next.js, TypeScript und Three.js sinnvoll umsetzen?
Ich wollte nicht nur technisch lernen, sondern auch konkret erfahren, welche Kundenprobleme ich lösen könnte. Es sollte interaktiv, 3D-basiert, prozessoptimiert und mit schlanker Architektur sein. Nach einer Brainstorming-Session mit ChatGPT entstand schnell eine konkrete Idee: ein 3D-Konfigurator für individuell gedruckte Ringe.
Vom Use Case zum fiktiven Startup
Mit ChatGPT habe ich die erste Produktidee weiter verfeinert. Daraus entstand das fiktive Startup „VÉLORA“, spezialisiert auf individuell gefertigte Ringe in Kleinserie. Innerhalb weniger Minuten hatte ich Markenname, erste Produktbeschreibung, technologische Ansätze und Infos zu geeigneten Filamenten für den 3D-Druck zusammen.
Vom Prompt zum Prototyp mit Figma und v0 von Vercel
Zuerst nutzte ich einen Prompt in Vercel v0 für eine einfache UI-Skizze. In Figma entwickelte ich daraus einen detaillierten Prototyp mit einer Visualisierungsfläche für den Ring und ein Eingabefeld für Maße und Kontaktdaten.
Pair-Programming mit einer KI
Mit CursorAI setzte ich ein neues Next.js-Projekt auf und verband es mit Vercel. Der Formularteil war schnell fertiggestellt, doch das dynamische 3D-Modell des Rings stellte mich vor Herausforderungen.
Die ersten Versuche waren einfache Zylinder-Operationen, doch scharfkantige Ringe trägt niemand gerne. Statt aufzugeben, ging ich iterativ vor: Anforderungen konkretisieren, KI-Vorschläge testen, Probleme identifizieren und Lösungsansätze verbessern.
Iterativer Prozess: Lernen in Runden
Ich merkte schnell, dass der Schlüssel zum Erfolg die klare und präzise Beschreibung der Probleme ist. Je genauer ich Anforderungen formulierte, desto hilfreicher waren die Vorschläge der KI.
Die Rollen zwischen mir und der KI wechselten dabei ständig:
- - Ich erkläre die Anforderungen.
- - Die KI schlägt Lösungen vor.
- - Ich prüfe, verwerfe und verfeinere diese Vorschläge.
- - Jede Iteration führt zu besseren Ergebnissen und Problembeschreibung.
Beispiele für schnelle Erfolge waren etwa der Versand von E-Mail-Anfragen über Nodemailer und Mailtrap sowie eine unkomplizierte Lösung für Zweisprachigkeit.
Wichtige Learnings aus dem Projekt
- - Gute Prompts beginnen mit einer groben Skizze und möglichst viel Kontext.
- - Komplexe Probleme in kleinere, lösbare Einheiten aufteilen.
- - Fehlerhaft generierter Output sind wertvolles Lernmaterial
- - KI-Vorschläge immer kritisch hinterfragen, nie blind übernehmen.
- - Eigene Kenntnisse bleiben entscheidend für Qualität und Verständnis.
-
Fazit: KI ist da, um mit uns zu entwickeln, nicht für uns
VÉLORA ist kein fertiges Produkt, sondern ein echter Proof of Concept. Mein wichtigstes Fazit: KI ersetzt mich nicht – sie verstärkt meine Fähigkeiten. Sie unterstützt mich dabei, schneller zu denken, strukturierter zu arbeiten und bessere Lösungen zu entwickeln. Voraussetzung dafür ist, KI aktiv einzusetzen und nicht passiv zu konsumieren.
