Claude Code Tutorial: Dein erster KI-Assistent in 30 Minuten

Claude Code Tutorial: In 30 Minuten zum eigenen KI-Assistenten

Du moechtest KI in deine Projekte integrieren? Mit Claude Code von Anthropic geht das einfacher als du denkst. In diesem Tutorial zeige ich dir Schritt fuer Schritt, wie du deinen ersten KI-Assistenten einrichtest und nuetzliche Anwendungen damit baust.

Was ist Claude Code?

Claude Code ist ein KI-Coding-Assistent, der direkt in deinem Terminal laeuft. Er kann deine Codebase verstehen, Dateien bearbeiten, Tests ausfuehren und komplexe Entwicklungsaufgaben autonom erledigen. Im Gegensatz zu ChatGPT oder dem Claude-Webinterface arbeitet Claude Code direkt mit deinen lokalen Dateien und Tools.

Voraussetzungen

Bevor wir starten, stelle sicher, dass du Folgendes installiert hast:

• Node.js (Version 18 oder hoeher)
• npm oder yarn
• Ein Anthropic API-Key (kostenlos auf console.anthropic.com erstellbar)
• Ein Terminal (macOS Terminal, Windows Terminal oder Linux Shell)

Schritt 1: Installation

Oeffne dein Terminal und installiere Claude Code global:

npm install -g @anthropic-ai/claude-code

Verifiziere die Installation:

claude --version

Schritt 2: Authentifizierung

Beim ersten Start wirst du zur Authentifizierung aufgefordert:

claude

Du kannst dich entweder ueber deinen Anthropic-Account anmelden oder einen API-Key hinterlegen. Fuer den API-Key setze die Umgebungsvariable:

export ANTHROPIC_API_KEY="dein-api-key-hier"

Schritt 3: Dein erstes Projekt

Erstelle ein neues Projektverzeichnis und starte Claude Code:

mkdir mein-ki-projekt
cd mein-ki-projekt
claude

Claude Code analysiert automatisch dein Projektverzeichnis und versteht die Struktur. Du kannst jetzt natuerlichsprachliche Anweisungen geben.

Schritt 4: Einen einfachen Chatbot bauen

Sag Claude Code, was du bauen moechtest:

> Erstelle eine einfache Web-App mit Next.js und TypeScript,
  die einen Chatbot implementiert. Der Chatbot soll die
  Anthropic API nutzen und Nachrichten streamen.

Claude Code wird daraufhin:

1. Ein neues Next.js Projekt mit TypeScript initialisieren
2. Die notwendigen Abhaengigkeiten installieren
3. Die Projektstruktur anlegen
4. Den Frontend-Code fuer das Chat-Interface schreiben
5. Die API-Route fuer die Anthropic-Anbindung erstellen

Schritt 5: Die Anthropic API nutzen

Hier ist ein Beispiel, wie die API-Route aussehen koennte, die Claude Code fuer dich erstellt:

// app/api/chat/route.ts
import Anthropic from "@anthropic-ai/sdk";

const client = new Anthropic();

export async function POST(req: Request) {
  const { messages } = await req.json();

  const response = await client.messages.create({
    model: "claude-sonnet-4-20250514",
    max_tokens: 1024,
    messages: messages,
    stream: true,
  });

  const stream = new ReadableStream({
    async start(controller) {
      for await (const event of response) {
        if (event.type === "content_block_delta" &&
            event.delta.type === "text_delta") {
          controller.enqueue(
            new TextEncoder().encode(event.delta.text)
          );
        }
      }
      controller.close();
    },
  });

  return new Response(stream, {
    headers: { "Content-Type": "text/plain; charset=utf-8" },
  });
}

Schritt 6: Nützliche Claude-Code-Befehle

Hier eine Uebersicht der wichtigsten Befehle, die du in Claude Code nutzen kannst:

• Dateien bearbeiten: "Aendere die Hintergrundfarbe der Navigation zu dunkelblau"
• Bugs fixen: "Der Login funktioniert nicht. Finde und behebe den Fehler"
• Tests schreiben: "Schreibe Unit-Tests fuer die Datei utils/helpers.ts"
• Refactoring: "Refactore die User-Komponente zu kleineren Teilkomponenten"
• Erklaerungen: "Erklaere mir, wie die Authentifizierung in diesem Projekt funktioniert"

Schritt 7: CLAUDE.md konfigurieren

Erstelle eine CLAUDE.md-Datei im Wurzelverzeichnis deines Projekts. Diese Datei teilt Claude Code den Kontext deines Projekts mit:

# Mein Projekt

## Stack
- Next.js 14 mit App Router
- TypeScript
- Tailwind CSS
- PostgreSQL

## Konventionen
- Deutsche Variablennamen fuer Business-Logik
- Englische Variablennamen fuer technischen Code
- Tests mit Vitest

Fortgeschrittene Tipps

Parallele Aufgaben: Claude Code kann mehrere Aufgaben gleichzeitig bearbeiten. Nutze dafuer den Subagent-Modus, der automatisch aktiviert wird, wenn die Aufgaben unabhaengig voneinander sind.

Git-Integration: Claude Code versteht Git und kann Commits erstellen, Branches wechseln und Pull Requests vorbereiten. Beispiel: "Erstelle einen Commit mit den aktuellen Aenderungen und einer passenden Nachricht."

Kostenmanagement: Behalte deine API-Kosten im Blick. Claude Code zeigt dir am Ende jeder Session eine Zusammenfassung der verbrauchten Tokens. Fuer die meisten Projekte liegt der taegliche Verbrauch bei 2-5 EUR.

Fazit

Claude Code ist ein maechtigees Werkzeug, das deinen Entwicklungsworkflow erheblich beschleunigen kann. Von einfachen Codeaenderungen bis hin zu komplexen Architekturentscheidungen kann der KI-Assistent dich effektiv unterstuetzen. Probiere es aus und teile deine Erfahrungen in den Kommentaren!