Tech-Basics für moderne Teams

GIT FÜR
VIBE
CODER

Warum jeder der mit KI Code schreibt Git verstehen sollte — und wie es wirklich einfach ist.

Kennt ihr das?

"Ich hab was geändert und jetzt funktioniert nichts mehr."

"Welche Version war nochmal die funktionierende?"

"Ich hab die Datei überschrieben..."

Git löst genau diese Probleme. Für immer.

Was ist Git?

Eine Zeitmaschine
für deinen Code.

📸

Snapshots

Git macht Fotos von deinem Code — sogenannte Commits. Du kannst jederzeit zurück.

🌿

Branches

Experimentiere in einem separaten Zweig. Funktioniert's? Zusammenführen. Nicht? Einfach löschen.

☁️

Remote

GitHub/GitLab ist die Cloud-Kopie. Backup, Teamwork und Deployment in einem.

Warum besonders für Vibe Coder?

KI schreibt schnell. Sehr schnell.

Claude schreibt 200 Zeilen — und du weißt nicht mehr was du hattest.

Git zeigt dir genau was sich geändert hat (diff)

Ein Prompt macht alles kaputt.

Ein Commit zurück — fertig, als wäre nichts gewesen

Du willst zwei Ideen parallel ausprobieren.

Branch A und Branch B — kein Überschreiben, kein Stress

Jemand anderes soll deinen Code reviewen oder weiterarbeiten.

GitHub macht das zum Einzeiler: Link teilen, fertig

Das Minimum

4 Befehle. Das reicht.

Änderungen vorbereiten

git add .
# alle Änderungen markieren

Snapshot speichern

git commit -m "was ich gemacht hab"
# Foto mit Beschriftung schießen

In die Cloud laden

git push
# zu GitHub hochladen

Vom Server holen

git pull
# neuesten Stand runterladen

→ Alles andere (branch, merge, revert, log) lernt man wenn man es braucht.

Das Wichtigste zuerst

Git lebt auf zwei Ebenen.

💻

Lokal

dein Rechner

  • ·Deine eigene Kopie des Repos
  • ·Commits passieren hier — offline, sofort, blitzschnell
  • ·Niemand sieht deine Änderungen bis du pushst
  • ·Komplett unabhängig — du brauchst kein Internet
☁️

Remote (GitHub)

die Cloud-Kopie

  • ·Die "offizielle" Version des Codes
  • ·Backup — selbst wenn dein Laptop stirbt
  • ·Teamwork — alle sehen denselben Stand
  • ·Deployment-Trigger — push = live gehen
git push — lokal → cloud · git pull — cloud → lokal

Wie Git Daten speichert

Git überträgt keine Dateien.
Nur Änderungen.

Wie "Änderungen verfolgen" in Word — aber für Code. Jede geänderte Zeile wird einzeln erfasst.

git diff — was sich geändert hat

app.js
const name = "Goscha";
const role = "developer";
-  const greeting = "Hallo";
+  const greeting = "Moin";
-  console.log(greeting + " " + name);
+  console.log(`${greeting}, ${name}!`);
return role;

Rote Zeilen = entfernt

Was vorher da war — wird gelöscht

+

Blaue Zeilen = hinzugefügt

Was neu dazukommt

··

Graue Zeilen = unverändert

Kontext — werden nicht übertragen

→ Push überträgt also keine ganze Datei. Nur die 2 geänderten Zeilen. Schnell, effizient, und du siehst genau was passiert ist.

Merge Konflikte

Wenn zwei dieselbe
Zeile ändern.

Konflikte klingen schlimm. Sind sie nicht. Git markiert sie nur — du entscheidest.

So sieht ein Konflikt aus

app.js — CONFLICT
const name = "Goscha";
<<<<<<< HEAD (deine Version)
  const greeting = "Moin";
=======
  const greeting = "Servus";
>>>>>>> feature/anna (Annas Version)
console.log(greeting);

Wie du es löst

1

Git zeigt dir den Konflikt

Die Datei hat jetzt diese Marker drin — du siehst beide Versionen

2

Du wählst — oder kombinierst

Einfach die Zeile behalten die du willst, den Rest löschen. VS Code hat dafür Buttons: "Accept Current / Incoming / Both"

3

Committen — fertig

git add . && git commit -m "fix: merge conflict resolved"

💡 Konflikte entstehen nur wenn exakt dieselbe Zeile von zwei Personen geändert wurde. Verschiedene Zeilen → kein Konflikt, automatisches Merge.

Der Workflow

Vibe Coder Loop

1

Branch

Neuen Zweig für das Feature erstellen

git checkout -b feature-name
2

Viben

Mit KI coden, ausprobieren, anpassen

# Claude / Cursor / Copilot...
3

Commit

Funktioniert was? Snapshot!

git add .
git commit -m "feat: login"
4

Push & PR

Hochladen, Review, Merge

git push
# → GitHub PR öffnen

Best Practice #1

Gute Commit Messages
sind wie gute Notizen.

Schlecht

"fix"
"changes"
"asdfasdf"
"ich weiß nicht mehr"

Gut

"feat: Login-Formular hinzugefügt"
"fix: Fehler beim Laden der API"
"style: Navbar responsiv gemacht"
"refactor: Dashboard vereinfacht"

Tipp: Einfaches Prefix-System — feat: neues Feature · fix: Bugfix · style: nur Aussehen · docs: nur Texte

Best Practice #2

Nie direkt auf main pushen.

main
← immer stabil, immer lauffähig
feature-xyz
← hier experimentieren

Schritt 1

Branch erstellen für jede neue Idee / jedes Feature

Schritt 2

Auf dem Branch committen bis es funktioniert

Schritt 3

Pull Request → Review → Merge in main

Notfall-Toolkit

Wenn es schiefgeht —
kein Stress.

"Was hab ich eigentlich geändert?"

git diff — zeigt alle Änderungen

"Welche Commits gibt es?"

git log --oneline — kurze Übersicht

"Letzten Commit rückgängig?"

git revert HEAD — sicherer Rückgängig

"Alles wegschmeißen?"

git checkout . — alle lokalen Änderungen weg

"Zu altem Stand springen?"

git checkout [commit-hash] — Zeitreise

Für Terminal-Phobiker

Du brauchst kein Terminal.
Wirklich.

🖥️

GitHub Desktop

Grafisches Tool direkt von GitHub. Drag & Drop Commits. Perfekt zum Einstieg.

desktop.github.com

💻

VS Code

Direkt integriert. Klick auf das Branch-Icon unten links — und alles ist da.

Empfehlung für Vibe Coder

🐙

GitHub Web

Dateien direkt im Browser bearbeiten. PRs reviewen. Issues tracken.

github.com

Bonus: Claude Code, Cursor und Windsurf haben Git direkt eingebaut — einfach fragen.

Best Practice #3

Atomic Commits —
besonders mit KI.

Ein Commit = eine Sache. Claude schreibt 300 Zeilen auf einmal — commit trotzdem nur was zusammengehört.

✗  Fetter Commit — schwer zu verstehen

alles auf einmal
"feat: login, dashboard, bugfix,
        refactor api, new styles"

→ Unmöglich einzeln rückgängig zu machen

→ Review ist eine Qual

→ "Was hat sich geändert?" — unklar

✓  Atomic Commits — klar & reversibel

login
dashboard
bugfix
styles
"feat: Login-Formular"
"feat: Dashboard Grundstruktur"
"fix: API-Timeout behoben"

→ Jeden Commit einzeln rückgängig: git revert

→ Claude macht einen Schritt → du commitest

→ Perfekte History zum Debuggen

Best Practice #4

Drei Dinge die nie
ins Repo gehören.

🔑

Secrets & Keys

.env
API_KEY=sk-abc123...
DB_PASSWORD=geheim!
STRIPE_SECRET=...

Einmal auf GitHub — für immer im Internet. Bots scannen Repos in Sekunden.

Echte Konsequenz: geklaute Keys kosten Geld

🎬

Große Dateien

video.mp4    (800 MB)
design.psd   (200 MB)
dataset.csv  (500 MB)
*.zip, *.dmg

Git speichert jede Version jeder Datei. 500 MB × 10 Commits = 5 GB Repo.

Repo wird unbrauchbar langsam

📦

Generiertes

node_modules/  (100k Files)
.next/ / dist/
__pycache__/
*.log

Wird automatisch neu generiert. Ins Repo gehört nur die Anleitung (package.json), nicht das Ergebnis.

Die Lösung

Wohin damit stattdessen?

🔑

.env Dateien / API Keys

niemals committen

stattdessen

.env.example ins Repo

Vorlage mit leeren Werten — echte Keys in Vercel/Netlify/Railway als Environment Variables

🎬

Videos, Bilder, PDFs, Daten

> 1 MB gehört nicht ins Repo

stattdessen

Cloud Storage · Git LFS

S3, Cloudflare R2, Supabase Storage — oder Git LFS für versionierte Binaries

📦

node_modules / dist / build

generiert, riesig, unnötig

stattdessen

.gitignore + package.json

In .gitignore eintragen, fertig. Jeder macht bun install / npm install lokal

💡

gitignore.io — einfach Techstack eingeben und eine fertige .gitignore generieren lassen.

Best Practice #5

Das README ist die
Eingangstür deines Repos.

Jeder der dein Repo aufmacht liest zuerst das README. Wenn es fehlt oder schlecht ist — niemand versteht was das Ding macht.

README.md — Mindest-Standard

README.md
# Projektname
Einen Satz: was macht dieses Projekt?
 
## 🚀 Schnellstart
```bash
git clone ...
bun install
bun dev
```
 
## 📁 Struktur
src/ · public/ · README erklärt wozu
 
## ⚙️ Environment
Kopiere .env.example → .env
 
## 🤝 Mitmachen
Branch → PR → Review → Merge
1

Was ist es? — Ein Satz.

Kein Roman. "Tool für X das Y macht." Fertig.

2

Wie startet man es?

Copy-paste-fähige Befehle. Keine Annahmen über Vorwissen.

3

Wo ist was?

Kurze Ordner-Übersicht. Fremde (und zukünftiges Ich) orientieren sich sofort.

4

Welche Env-Variablen braucht es?

.env.example erwähnen — verhindert "warum startet das nicht?"

+

README aktuell halten

Veraltetes README ist schlimmer als keins. Bei jedem größeren Change: kurz updaten.

💡 Frag einfach Claude: "Schreib mir ein README für dieses Projekt" — und paste die Ordnerstruktur dazu.

Die 3 Dinge die du heute mitnimmst

1

Commit oft.
Push immer.

Jeder Commit ist eine Sicherheitslinie. Du kannst nie zu viele haben — aber zu wenige kostet dich Stunden.

2

Secrets
nie auf Git.

.env in .gitignore, echte Keys nur als Environment Variables — einmal gecheckt ist einmal zu viel.

3

README
zuerst.

Ein gutes README ist Respekt gegenüber anderen — und gegenüber deinem zukünftigen Ich in 3 Monaten.

Bei uns im Unternehmen

Alles landet bei
TAWO-GmbH.

Wir haben eine gemeinsame GitHub Organisation. Jedes Projekt das für TAWO gebaut wird gehört dorthin — nicht ins persönliche Profil.

👥

Gemeinsamer Besitz

Wenn jemand die Firma verlässt, bleibt der Code. Kein Repo auf privaten Accounts.

🔍

Alles an einem Ort

Jeder im Team kann alle Projekte finden, reviewen und weiterarbeiten — ohne "kannst du mir mal Zugriff geben?"

🔒

Zugriff zentral verwaltet

Neue Teammitglieder einladen — und sie haben sofort Zugriff auf alle relevanten Repos.

Nicht: github.com/dein-name/tawo-projekt

Privates Profil = privater Besitz. Das ist für Side Projects, nicht für Firmensachen.

Unsere Organisation

TAWO-GmbH

github.com/TAWO-GmbH

Organization
📁 presentations
public
📁 dein-nächstes-projekt
private
📁 noch-ein-projekt
private

Wenn du ein neues Projekt startest: Repo direkt unter github.com/TAWO-GmbH anlegen — nicht bei dir. Kurz bescheid sagen damit du eingeladen wirst.

GIT

Die Kurzfassung

Commit early.

Commit often.

Push always.

Jeder Commit ist eine Sicherheitslinie. Je mehr du machst, desto weniger kannst du verlieren.

LOS GEHT'S.

git init — und die erste Zeitmaschine läuft.

📸 commit
🌿 branch
☁️ push
1 / 21