Werkzeuge bereitlegen: Node.js, Projektordner, Plan-Modus und Vorschau
Danach ist Node.js installiert, dein Projektordner angelegt, und du kennst die zwei wichtigsten Helfer in Claude Code: den Plan-Modus und die Vorschau deiner App.
Stand 23. Oktober 2026 · Wir prüfen die Inhalte regelmäßig gegen die aktuellen Programme. Was ist neu?
Für eine Web-App braucht dein Rechner ein zusätzliches, kostenloses Programm: Node.js. Damit laufen die Werkzeuge, mit denen Claude die App baut und auf deinem Rechner startet. Außerdem lernst du zwei Helfer in Claude Code kennen, die dir viel Ärger ersparen: den Plan-Modus, in dem Claude erst plant und noch nichts verändert, und die Vorschau, in der du deine App sofort im Browser siehst.
Schritt für Schritt
Prüf dein Abo. Claude Code ist ab dem Pro-Abo enthalten, nicht im kostenlosen Abo (Lektion 1.6 und 3.2).
Installier Node.js. Geh auf nodejs.org und lade die Version mit dem Zusatz „LTS“ herunter. LTS heißt „Long Term Support“, also lange gepflegt und stabil. Im Oktober 2026 ist das Version 24. Öffne die heruntergeladene Datei und klick dich durch die Installation (Mac: Paket öffnen, „Fortfahren“; Windows: Installer starten, Voreinstellungen lassen).
Prüf bitte, ob Node.js auf meinem Rechner installiert ist und welche Version. Erklär mir, falls etwas fehlt, Schritt für Schritt, was ich tun muss.
Leg einen Projektordner an. Erstell in deinen Dokumenten einen Ordner für deine App, zum Beispiel „helferliste“. Jede App bekommt ihren eigenen Ordner.
Öffne ihn in Claude Code. In der Claude Desktop-App im Bereich „Code“, unter dem Eingabefeld „Local“, dann „Open folder…“ – wie in Lektion 3.2.
Lern den Plan-Modus kennen. Im Plan-Modus liest Claude, denkt nach und schlägt einen Plan vor, ändert aber nichts, bis du zustimmst. Ideal, um erst gemeinsam zu überlegen. Du wählst ihn in der Desktop-App über die Modus-Auswahl unter dem Eingabefeld, Eintrag „Plan“ – oder mit Cmd+Shift+M (Mac) bzw. Strg+Shift+M (Windows). Im Terminal schaltest du mit Shift+Tab durch die Modi, bis „plan mode on“ erscheint.
Lern die Vorschau kennen. Die Desktop-App kann deine App selbst starten und in einem Browser-Bereich direkt neben dem Gespräch anzeigen. Claude prüft nach Änderungen auch selbst, ob alles noch läuft. Die Einstellungen dafür legt Claude in deinem Projekt in der Datei .claude/launch.json ab. Du musst nichts davon selbst einrichten – sag einfach, dass du die App sehen willst.
Leg das Sicherungsbuch an.
Das kennst du aus Lektion 3.3. Bei einer App ist es noch wichtiger: Geht etwas kaputt, kommst du jederzeit zum letzten funktionierenden Stand zurück.
Leg in diesem Ordner ein Git-Sicherungsbuch an und erklär mir in zwei Sätzen, wofür es da ist.
Ich mache gerade die Lektion „W.2 Werkzeuge bereitlegen: Node.js, Projektordner, Plan-Modus und Vorschau“ im AWA Campus und hänge bei diesem Schritt: … Erklär ihn mir bitte einfacher, Schritt für Schritt. Ich bin Anfänger.
- Node.js installiert ist und Claude die Version bestätigt hat,
- dein Projektordner in Claude Code geöffnet ist und ein Sicherungsbuch hat,
- du weißt, wie du den Plan-Modus einschaltest, und was die Vorschau ist.
Wörter erklärt
- Node.js: ein kostenloses Programm, mit dem die Werkzeuge zum Bauen und Starten von Web-Apps laufen.
- LTS: „Long Term Support“ – eine Version, die lange gepflegt wird. Für Einsteiger immer die richtige Wahl.
- Plan-Modus: Claude plant und schlägt vor, ändert aber nichts ohne dein Ja.
- Vorschau: deine App läuft auf deinem Rechner und wird in der Desktop-App angezeigt.
- Dev-Server: das kleine Programm, das deine App beim Bauen auf deinem Rechner startet.