KI als Coding-Partner
Du nutzt KI für Coding? Perfekt! Aber lerne, wie du damit wirklich verstehst – statt nur zu kopieren. Von Copy-Paste zu "Ah, jetzt check ich's!"
Deine Lernziele
Die Copy-Paste-Falle
Szenario: Du fragst die KI: "Mach mir eine responsive Navigation mit CSS", kopierst den Code, einfügen, fertig. Funktioniert? Ja. Verstehst du ihn? Nein.
Das Problem: Bei der nächsten Aufgabe (z.B. ein Footer) fragst du wieder die KI. Und wieder. Und wieder. Nach 20 Aufgaben:
- ❌ Du kannst keinen einfachen Code selbst schreiben
- ❌ Du verstehst nicht, warum etwas funktioniert (oder nicht)
- ❌ Bei Prüfungen bist du aufgeschmissen
- ❌ Fehler zu finden ist unmöglich (weil du den Code nicht kennst)
"KI ist kein Fahrservice, sondern ein Fahrlehrer. Wenn du nur mitfährst, lernst du nie Auto fahren."
Der bessere Weg: KI als Tutor nutzen
"Schreib mir den Code für eine Navbar"
"Ich will eine Navbar mit Flexbox verstehen. Zeig mir den Code UND erklär mir Zeile für Zeile, was passiert. Ich bin Anfänger."
Die Tutor-Mindset-Fragen:
"Kannst du mir das erklären, als wär ich 12?"
"Was passiert in dieser Zeile genau?"
"Wie würde das aussehen, wenn ich [X] statt [Y] mache?"
"Was ist der Unterschied zwischen dieser und jener Methode?"
Der Code-Erklärer
Paste Code ein, den du nicht 100% verstehst – und lass ihn dir erklären:
Dein Code:
Debugging mit KI (richtig!)
Der "Was ist falsch?"-Ansatz
"Mein Code funktioniert nicht."
"Ich bekomme einen Fehler: 'TypeError: Cannot read property of undefined'. Mein Code ist: [Code]. Ich verstehe nicht, was 'undefined' in diesem Kontext bedeutet."
Der "Erklär mir den Fehler"-Ansatz
Statt nur die Lösung zu wollen, frag nach der Ursache:
"Mein Code wirft [FEHLER].
1. Was bedeutet dieser Fehler genau?
2. Warum tritt er in meinem Code auf?
3. Wie kann ich ihn vermeiden (nicht nur fixen)?"
Der Rubber-Ducky-Ansatz mit KI
Erklär der KI deinen Code – dann merkst du selbst, wo der Fehler ist!
"Ich erklär dir meinen Code, und du sagst mir, ob ich ihn richtig verstanden habe:
[Deine Erklärung hier]
Stimmt das so?"
Englisch für Coding, Deutsch für Verständnis!
Coding-Hintergründe lassen sich oft besser auf Deutsch erklären:
"Erkläre mir 'flex-direction' wie ich 5 wäre. Warum braucht man das?"
Deutsch für komplexe Konzepte und "Warum"-Fragen
"Fix this error: ReferenceError: document is not defined"
Englisch für Fehlermeldungen und Code-Review
Pro-Tipp: Nutze Deutsch für:
Konzept-Erklärungen, "Warum"-Fragen, Zusammenhänge verstehen.
Nutze Englisch für: Fehlermeldungen, Best Practices, Code-Optimierung.
Der Lern-Zyklus mit KI
1. Problem definieren
"Ich will ein Modal mit JavaScript öffnen/schließen können"
2. KI fragen (richtig!)
"Zeig mir ein einfaches Beispiel UND erklär mir jeden Schritt"
3. Verstehen (nicht kopieren!)
Code lesen, Fragen stellen, Konzept verstehen
4. Selbst schreiben
Ohne KI versuchen. Wenn nicht: Zurück zu Schritt 2
5. Gelernt!
Du kannst es jetzt selbst – ohne KI
Übung: Echte Szenarien
Szenario: CSS Grid verstehen
Dein Ziel: Ein 3-spaltiges Layout mit Grid.
"Mach mir Grid Code"
"Ich lerne CSS Grid. Zeig mir ein 3-spaltiges Layout und erklär mir:
1. Was macht 'grid-template-columns'?
2. Was ist der Unterschied zu früher (float)?
3. Warum brauche ich 'gap'?"
Szenario: JavaScript Event Listener
Dein Ziel: Ein Button soll etwas tun bei Klick.
"Code für Button Klick"
"Erklär mir 'addEventListener' für einen Anfänger:
- Was bedeutet 'click'?
- Was ist der Unterschied zwischen 'function() {}' und '() => {}'?
- Warum brauche ich 'document.querySelector'?"
Szenario: Fehler finden
Dein Code funktioniert nicht.
"Hier mein Code, fix ihn"
"Mein Code wirft: [FEHLERMELDUNG]. Ich verstehe nicht, was [spezifischer Teil] bedeutet. Kannst du mir:
1. Den Fehler erklären?
2. Zeigen, wo im Code das Problem ist?
3. Erklären, wie ich solche Fehler selbst finde?"
Schnell-Check
1. Was ist das Hauptproblem bei reinem Copy-Paste?
2. Was solltest du immer fragen?
3. Was ist der "Rubber Ducky"-Ansatz?
Dein Missions-Fortschritt
Mission 5 abgeschlossen!
Du codest jetzt smarter – nicht härter!