YAPU — Webseite einrichten macOS

Onboarding — 26. März 2026

Heute richten wir Claude Code auf eurem Rechner ein. Am Ende der Session könnt ihr eure Webseite über das Terminal bearbeiten — Texte ändern, Sprachen anpassen, neue Inhalte hinzufügen. Jede Änderung ist versioniert und rückgängig machbar.
1 — Installation

Terminal öffnen

Cmd + Leertaste, dann “Terminal” tippen und Enter.

Das Terminal ist die Kommandozeile eures Macs. Claude Code lebt hier — ihr tippt Befehle oder redet mit der KI, und sie setzt Dinge um.

Homebrew installieren

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Homebrew ist ein Paketmanager — wie ein App Store fürs Terminal. Installiert Programme mit einem Befehl.

Wichtig: Am Ende zeigt Homebrew zwei Befehle an die mit echo und eval anfangen. Die müssen auch ausgeführt werden — einfach kopieren und einfügen.

Node.js & Git installieren

brew install node git

Node.js ist die Laufzeitumgebung für Claude Code. Git ist die Versionsverwaltung — damit werden Änderungen gespeichert und nachvollziehbar.

Check: node --version && git --version

Claude Code installieren

curl -fsSL https://claude.ai/install.sh | bash

Diesen Befehl im Terminal ausführen. Installiert Claude Code automatisch — das KI-Werkzeug, mit dem ihr eure Webseite pflegt. Kein npm nötig.

Claude Code starten und einloggen

claude

Beim ersten Start öffnet sich der Browser. Dort mit eurem Anthropic-Konto einloggen.

Anthropic-Account: Ihr braucht ein eigenes Konto bei console.anthropic.com. Claude Pro (20 $/Monat) oder Claude Max (100 $/Monat) — je nachdem wie viel ihr es nutzt.
Installation fertig. Jetzt holen wir eure Webseite.
2 — Webseite auf den Rechner holen

Git einrichten

Sagt Claude:

Richte Git für mich ein. Mein Name ist [EUER NAME].

Git speichert jede Änderung mit eurem Namen — so wisst ihr immer wer was geändert hat.

GitHub-Zugang einrichten

Marlin lädt euch als Collaborator auf das Repo ein. Einladung per Mail annehmen, dann:

Hilf mir mich bei GitHub anzumelden und das Repo promptheus-cloud/yapu2 zu klonen.

GitHub ist die Plattform wo euer Webseiten-Code liegt. Wie eine Cloud für Code — mit voller Versionskontrolle.

Claude Code im Projekt starten

cd yapu2 && claude

Claude liest automatisch die Projekt-Konfiguration und weiß wie eure Webseite aufgebaut ist.

Ab jetzt redet ihr mit Claude. Er kennt eure Webseite.
3 — Erste Änderung — live

Text ändern

Probiert es aus — sagt Claude z.B.:

Ändere die Headline auf der Startseite zu “Sustainable Finance for Latin America”

Claude öffnet die richtige Datei, ändert den Text und zeigt euch was er gemacht hat.

Änderung live schalten

Sagt Claude:

Pushe die Änderung.

Claude committed und pusht. Der Server zieht die Änderung automatisch — nach ~1 Minute ist sie live.

Neuer Tab ↗

Rückgängig machen

Sagt Claude:

Mach die letzte Änderung rückgängig und pushe.

Jede Änderung ist ein Commit. Volle Historie, jederzeit zurück. Ihr könnt nichts kaputt machen.

4 — Was ihr damit machen könnt

Inhalte pflegen

  • “Ändere die Telefonnummer auf +49 30 12345678”
  • “Aktualisiere die Impact-Zahlen: 500 Mio statt 400 Mio”
  • “Füge einen neuen Partner hinzu: Deutsche Bank”
  • “Übersetze die neue About-Sektion ins Spanische”

Design anpassen

  • “Mach die Hero-Section schlanker”
  • “Ändere die Schriftgröße der Überschriften”
  • “Ersetze das Hintergrundbild der Startseite”

Neue Seiten & Features

  • “Erstelle eine Team-Seite mit Fotos und Beschreibungen”
  • “Füge einen Blog-Bereich hinzu”
  • “Baue ein Kontaktformular das Mails an info@yapu.solutions schickt”

Unter der Haube

▶

Was ist Claude Code?

  • KI-Werkzeug von Anthropic — läuft im Terminal
  • Kann Dateien lesen, schreiben, Code ausführen, im Internet suchen
  • Kein Chatbot — ein Werkzeug das Dinge baut und ändert

Eure Webseite — Technik

  • Next.js 16, Tailwind CSS — moderner Standard-Code
  • Inhalte liegen in JSON-Dateien unter content/data/{sprache}/
  • 3 Sprachen: Englisch, Spanisch, Französisch
  • 9 Seiten, PageSpeed 95+ — schneller als Wix oder Squarespace
  • Kein CMS, kein WordPress — reiner Code, volle Kontrolle

Nicht an uns gebunden

  • Standard-Code — jeder Entwickler kann damit arbeiten
  • Jede KI mit Code-Zugriff kann die Seite pflegen (Claude, ChatGPT, Cursor, ...)
  • Euer Code, euer Repo, eure Entscheidung

Was kostet es?

WasPreis
Claude Pro (Einstieg) 20 $/Monat
Claude Max 5x (mehr Power) 100 $/Monat
GitHub, Git, Terminal kostenlos
VPS (euer Server) ~5–10 €/Monat
5 — Euer Reißbrett

Reißbrett — eure gemeinsame Planungstafel

Hier ist alles dokumentiert: was heute besprochen wurde, nächste Schritte, offene Entscheidungen. Ihr könnt direkt reinschreiben.

Neuer Tab ↗
Zugang: Registriert euch über diesen Einladungslink:
reissbrett.hylox.org/?invite=e2800deeb088aacf8b23943545e3a34b

Nächste Schritte

Notizen