Skip to the content.

Modul 2 – Werkzeug einrichten

🏠 Kursübersicht · Modul 2 von 8


🎯 Lernziele

Nach diesem Modul kannst du …

⏱️ Zeit: ca. 30 Minuten · Voraussetzungen: Modul 1, ein Laptop/PC mit Internet


Drei Wege – du brauchst nur einen

Es gibt nicht das eine Vibe-Coding-Werkzeug. Wähle den Weg, der zu dir passt:

Weg Was? Installation? Internet? Gut für
Weg 0 Chat-KI im Browser keine ja sofort starten, jüngere Lernende
Weg A opencode + DeepSeek V4 (Cloud) etwas ja der empfohlene Hauptweg
Weg B opencode + Ollama (lokal) mehr nein Offline, Datenschutz

💡 Tipp: Wenn du unsicher bist, starte mit Weg 0. Du kannst jederzeit später auf Weg A umsteigen, wenn du „richtige” Projektdateien bearbeiten willst.


Weg 0 – Ohne Installation (Chat-KI im Browser)

Der niedrigschwelligste Einstieg. Du brauchst nur einen Browser und einen kostenlosen Zugang zu einer Chat-KI:

So gehst du vor:

  1. Im Chat beschreibst du dein Projekt (siehe die Prompt-Vorlage).
  2. Die KI gibt dir den Code – meist eine oder mehrere Dateien.
  3. Du kopierst den Code in eine Datei auf deinem Rechner (z. B. index.html) und öffnest sie. Für Webseiten kannst du den Code auch direkt in https://codepen.io oder https://playcode.io einfügen und sofort sehen.
  4. Klappt etwas nicht? Beschreibe das Problem im Chat – die KI schickt dir eine neue Version.

🎓 Für Lehrkräfte: Weg 0 ist ideal für jüngere Klassen und für eine Frontal-Demo. Beachtet die Altersgrenzen der Anbieter und gebt keine personenbezogenen Daten ein. Details in Modul 6.

Der Rest dieses Moduls richtet opencode ein – ein KI-Werkzeug direkt im Terminal, das deine Dateien selbst anlegt und ändert. Das ist mächtiger, aber optional. Weg 0 reicht für die Module 3 und 4 vollkommen aus.


Was ist „opencode”?

opencode ist ein kostenloser KI-Coding-Agent, der im Terminal läuft. Du tippst, was entstehen soll – opencode legt die Dateien an und ändert sie selbstständig. Du wählst, welches KI-Modell dahinter rechnet: in der Cloud (Weg A) oder lokal auf deinem Gerät (Weg B).

Was ist ein Terminal? Ein Fenster, in das man Befehle tippt.

opencode installieren

macOS / Linux – ein Befehl, kopieren und ins Terminal einfügen:

curl -fsSL https://opencode.ai/install | bash

Danach das Terminal neu starten (schließen und neu öffnen).

⚠️ Wichtig (macOS): Falls danach opencode nicht gefunden wird („command not found: opencode”), kennt das Terminal den Installationsort noch nicht. Dann diese zwei Zeilen ins Terminal kopieren und mit Enter bestätigen:

echo 'export PATH="$HOME/.opencode/bin:$PATH"' >> ~/.zshrc
source ~/.zshrc

Hintergrund: opencode wird in den Ordner ~/.opencode/bin installiert. Damit das Terminal den Befehl findet, muss dieser Ordner im sogenannten PATH stehen. Das Installationsskript versucht das automatisch einzutragen – auf manchen Macs (z. B. wenn die Datei ~/.zshrc noch nicht existiert) klappt das aber nicht. Die zwei Zeilen tragen den Pfad dauerhaft nach.

Windows – Variante 1 (empfohlen für eigene Geräte mit Admin-Rechten)

Auf Windows 11 ist das der einfachste Weg. Du brauchst Administrator-Rechte auf deinem Gerät (auf einem eigenen Laptop hast du die in der Regel).

  1. Terminal als Administrator öffnen: Start-Menü → „Terminal” eintippen → Rechtsklick„Als Administrator ausführen”.

    ⚠️ Wichtigster Schritt! Ohne Administrator-Rechte bricht die Installation mit der Fehlermeldung EPERM ab. Das ist der mit Abstand häufigste Stolperstein.

  2. Node.js installieren:
    winget install OpenJS.NodeJS.LTS
    
  3. Terminal schließen und wieder als Administrator öffnen (damit Node erkannt wird).
  4. opencode installieren:
    npm install -g opencode-ai
    

🪄 Noch einfacher – das Helfer-Skript: Statt der Schritte 2–4 kannst du das fertige Skript material/install-opencode-windows.ps1 ausführen. Es prüft die Admin-Rechte, installiert Node.js und opencode und meldet jeden Schritt. Im als Administrator geöffneten Terminal, aus dem Kurs-Ordner heraus:

powershell -ExecutionPolicy Bypass -File .\material\install-opencode-windows.ps1

Windows – Variante 2 (Alternative): WSL

Nur nötig, wenn du lieber in einer Linux-Umgebung arbeitest. Aufwändiger (Neustart, Ubuntu-Setup).

  1. PowerShell als Administrator öffnen (Rechtsklick → „Als Administrator ausführen”).
  2. wsl --install ausführen, PC neu starten (Ubuntu wird automatisch eingerichtet).
  3. Im WSL-Terminal dann den macOS/Linux-Befehl von oben ausführen.

💡 PowerShell-Version? Auf Windows 11 ist die vorinstallierte PowerShell aktuell genug – du musst nichts nachrüsten. Wichtig ist nur, das Terminal als Administrator zu starten.

Installation prüfen

opencode --version

Erscheint eine Versionsnummer, hat es geklappt. ✅


Weg A – opencode + DeepSeek V4 Flash Free (empfohlen)

DeepSeek V4 Flash Free ist aktuell kostenlos über opencode nutzbar – ohne Zahlungsdaten.

⚠️ Datenschutz bei DeepSeek: DeepSeek ist das Modell eines chinesischen Anbieters – deine Eingaben werden auf dessen Servern außerhalb der EU verarbeitet. Gib daher keine personenbezogenen Daten ein (keine echten Namen, Noten, Adressen – Details in Modul 6). Für die Übungen dieses Kurses ist das unkritisch, weil nur Übungsprojekte und erfundene Daten verwendet werden. Sobald du mit sensiblen Daten arbeiten willst, führt der Weg zwingend über die lokale KI (Weg B, Ollama) – dort verlassen die Daten deinen Rechner nicht.

  1. opencode starten:
    opencode
    
  2. Im Programm /connect eingeben, Enter drücken.
  3. Mit den Pfeiltasten OpenCode Zen auswählen, Enter. Es öffnet sich der Browser mit opencode.ai/auth.
  4. Konto erstellen oder anmelden (E-Mail + Passwort genügen).
  5. API-Key kopieren (Button „Create API Key”).
  6. Den API-Key in opencode einfügen (Strg+V / Cmd+V).
  7. /models eingeben, Enter → DeepSeek V4 Flash Free auswählen.

Fertig! Wechsle in einen Projektordner und leg los:

mkdir ~/vibe-coding && cd ~/vibe-coding
opencode

⚠️ Hinweis: Das kostenlose Kontingent ist zeitlich begrenzt. Falls DeepSeek einmal nicht verfügbar ist, nutze Weg B (Ollama) oder Weg 0 (Browser).


Weg B – opencode + Ollama (offline)

Nur nötig, wenn du ohne Internet arbeiten willst oder Daten lokal halten musst.

Ollama installieren:

# macOS
brew install ollama
# Linux
curl -fsSL https://ollama.com/install.sh | sh
# Windows → in WSL den Linux-Befehl ausführen

Modell herunterladen (kompaktes Modell, ca. 2 GB Download – läuft auch auf Laptops ohne Spezial-Hardware, ab etwa 4 GB freiem Arbeitsspeicher):

ollama pull qwen2.5-coder:3b

Wichtig – 16k-Variante anlegen (sonst bearbeitet opencode keine Dateien):

ollama cp qwen2.5-coder:3b qwen2.5-coder:3b-16k

opencode mit Ollama verbinden – lege im Projektordner eine Datei opencode.json an:

{
  "$schema": "https://opencode.ai/config.json",
  "provider": {
    "ollama": {
      "npm": "@ai-sdk/openai-compatible",
      "name": "Ollama (local)",
      "options": { "baseURL": "http://localhost:11434/v1" },
      "models": {
        "qwen2.5-coder:3b-16k": { "name": "Qwen 2.5 Coder 3b (16k)" }
      }
    }
  },
  "model": "ollama/qwen2.5-coder:3b-16k"
}

Starte dann opencode – es nutzt jetzt das lokale Modell.

Wer einen Laptop mit ≥ 8 GB RAM hat, kann das stärkere qwen2.5-coder:7b (bzw. ...:7b-16k) verwenden – bessere Ergebnisse, höherer Speicherbedarf.


Mini-Befehlsreferenz für opencode

opencode        # Programm im Terminal starten
/connect        # Modell-Anbieter verbinden (z. B. OpenCode Zen → DeepSeek V4)
/models         # Modell auswählen
/exit           # opencode beenden

Danach einfach lostippen, was entstehen soll. Für die Praxis-Module brauchst du außerdem oft Node.js und Python – prüfe mit node --version und python3 --version, ob sie da sind (beide gibt es kostenlos auf nodejs.org bzw. python.org).


🛠️ Praxis: Erster Kontakt

Egal welcher Weg – stelle deinem Werkzeug eine erste Aufgabe, um zu sehen, dass es reagiert:

Schreibe eine einzelne HTML-Datei hallo.html, die in großer Schrift „Hallo Vibe Coding!” anzeigt und den Hintergrund in einem sanften Blauton einfärbt.

Wenn du „Hallo Vibe Coding!” auf blauem Grund siehst: Dein Werkzeug läuft. 🎉


✅ Selbstcheck (Kurzcheck vor Modul 3)

Frage: Warum braucht der Ollama-Weg die „16k”-Modellvariante?

Lösung Weil das Modell ein ausreichend großes **Kontextfenster** braucht, um ganze Dateien zu lesen und zu bearbeiten. Mit zu kleinem Kontext „bearbeitet opencode keine Dateien".

Keine Panik bei Problemen. Wenn etwas klemmt: Frag die KI selbst nach Hilfe, probiere Weg 0 als Ausweichlösung, oder schreib eine Mail an jochen.leeder@mzgivb.de. Ausführliche Installationshilfen liegen bereit – für Windows und für Linux Mint.


📋 Aufgaben

Abhaken speichert direkt in dieser Datei. In MindGraph Notes erscheinen diese Aufgaben automatisch im Tasks-Widget und am Fälligkeitstag im Focus. Übersicht & Kursfahrplan: Aufgaben.md.


⬅️ Modul 1 · 🏠 Übersicht · ➡️ Modul 3: Deine erste Webseite