Skip to content

Kapitel 9: Praxisprojekte für Anfänger

9.1 Projekt 1: Persönliches Projekt versionieren (Einzelentwicklung)

📝 Szenario: Eine einfache Website erstellen und versionieren

Lernziele:

  • ✅ Lokales Repository erstellen
  • ✅ Dateien hinzufügen und committen
  • .gitignore konfigurieren
  • ✅ Branches für Features verwenden

Schritt 1: Projekt initialisieren

bash
# 1. Projektordner erstellen
mkdir meine-website
cd meine-website

# 2. Git-Repository initialisieren
git init

# 3. .gitignore erstellen
echo "node_modules/" > .gitignore
echo ".DS_Store" >> .gitignore
echo "*.log" >> .gitignore

# 4. Erste Dateien erstellen
echo "<!DOCTYPE html><html><head><title>Meine Website</title></head><body><h1>Willkommen</h1></body></html>" > index.html
echo "body { font-family: Arial; }" > style.css

Schritt 2: Ersten Commit erstellen

bash
# 1. Status prüfen
git status

# 2. Alle Dateien zur Staging Area hinzufügen
git add .

# 3. Ersten Commit erstellen
git commit -m "Initialer Commit: Website-Grundgerüst"

# 4. Historie anzeigen
git log --oneline

Schritt 3: Änderungen vornehmen & committen

bash
# 1. index.html erweitern
echo "<p>Dies ist ein Paragraph.</p>" >> index.html

# 2. Änderungen committen
git add index.html
git commit -m "Feature: Paragraph zur index.html hinzugefügt"

# 3. style.css erweitern
echo "h1 { color: blue; }" >> style.css

# 4. Änderungen committen
git add style.css
git commit -m "Style: h1 Farbe auf blau geändert"

Schritt 4: Versionsrückgängigmachen (Practice)

bash
# 1. Letzten Commit rückgängig machen (Änderungen bleiben erhalten)
git reset --soft HEAD~1

# 2. Status prüfen (Änderungen sind in Staging Area)
git status

# 3. Erneut committen (mit besserer Nachricht)
git commit -m "Fix: h1 Farbe korrigiert (Blau)"

# 4. Historie anzeigen
git log --oneline

Schritt 5: Branch für neues Feature erstellen

bash
# 1. Neuen Branch erstellen
git checkout -b feature-kontaktformular

# 2. Neue Datei erstellen
echo "<form><input type="text" placeholder="Name"></form>" > kontakt.html

# 3. Committen
git add kontakt.html
git commit -m "Feature: Kontaktformular hinzugefügt"

# 4. Zurück zu main wechseln
git checkout main

# 5. Feature-Branch mergen
git merge feature-kontaktformular

# 6. Branch löschen
git branch -d feature-kontaktformular

Schritt 6: Zu GitHub pushen

bash
# 1. Repository auf GitHub erstellen (siehe Kapitel 6.2)
# 2. Remote hinzufügen
git remote add origin https://github.com/ihr-username/meine-website.git

# 3. Pushen
git push -u origin main

# 4. Auf GitHub überprüfen

9.2 Projekt 2: Zwei-Personen-Team-Simulation (Teamarbeit)

📝 Szenario: Zwei Entwickler arbeiten am selben Projekt

Lernziele:

  • ✅ Repository klonen
  • ✅ Branches erstellen und mergen
  • ✅ Merge-Konflikte lösen
  • ✅ Pull Requests erstellen

Vorbereitung: Repository auf GitHub erstellen

  1. Erstellen Sie ein neues Repository auf GitHub (siehe Kapitel 6.2)
  2. Fügen Sie eine README.md und eine index.html hinzu
  3. Laden Sie einen Freund (oder ein zweites Konto) als Collaborator ein (siehe Kapitel 6.6)

Schritt 1: Entwickler A klont und arbeitet

bash
# 1. Repository klonen
git clone https://github.com/ihr-username/team-projekt.git
cd team-projekt

# 2. Neuen Branch erstellen
git checkout -b feature-header

# 3. Änderungen vornehmen
echo "<header>Meine Website</header>" > header.html

# 4. Committen und pushen
git add header.html
git commit -m "Feature: Header hinzugefügt"
git push -u origin feature-header

# 5. Pull Request auf GitHub erstellen (Merge in main)

Schritt 2: Entwickler B klont und arbeitet (parallel)

bash
# 1. Repository klonen (in einem anderen Ordner / Computer)
git clone https://github.com/ihr-username/team-projekt.git
cd team-projekt

# 2. Neuen Branch erstellen
git checkout -b feature-footer

# 3. Änderungen vornehmen
echo "<footer>Copyright 2024</footer>" > footer.html

# 4. Committen und pushen
git add footer.html
git commit -m "Feature: Footer hinzugefügt"
git push -u origin feature-footer

# 5. Pull Request auf GitHub erstellen (Merge in main)

Schritt 3: Beide PRs werden gemergt (auf GitHub)

  • Teamleiter (oder Sie selbst) mergen beide PRs auf GitHub
  • main hat jetzt header.html und footer.html

Schritt 4: Entwickler A aktualisiert seinen lokalen main

bash
# 1. Auf main wechseln
git checkout main

# 2. Neueste Änderungen pullen
git pull origin main

# 3. Überprüfen, ob footer.html da ist
ls -la

Schritt 5: Entwickler B aktualisiert seinen lokalen main

bash
# 1. Auf main wechseln
git checkout main

# 2. Neueste Änderungen pullen
git pull origin main

# 3. Überprüfen, ob header.html da ist
ls -la

Schritt 6: Merge-Konflikt simulieren und lösen

Entwickler A:

bash
# 1. Neuen Branch erstellen
git checkout -b feature-konflikt

# 2. index.html ändern (Zeile 5)
echo "Geänderter Titel von A" > index.html

# 3. Committen und pushen
git add index.html
git commit -m "Änderung von Entwickler A"
git push -u origin feature-konflikt

# 4. Pull Request erstellen (noch nicht mergen!)

Entwickler B (gleichzeitig):

bash
# 1. Neuen Branch erstellen
git checkout -b feature-konflikt-b

# 2. index.html ändern (dieselbe Zeile!)
echo "Geänderter Titel von B" > index.html

# 3. Committen und pushen
git add index.html
git commit -m "Änderung von Entwickler B"
git push -u origin feature-konflikt-b

# 4. Pull Request erstellen

Merge-Konflikt beim Mergen (auf GitHub):

  • GitHub wird anzeigen: "Can't merge - merge conflicts"
  • Lösung: Lokal mergen und Konflikt lösen
bash
# 1. main pullen
git checkout main
git pull origin main

# 2. Feature-Branch von B pullen
git checkout feature-konflikt-b
git pull origin feature-konflikt-b

# 3. main in feature-Branch mergen
git merge main

# 4. Konflikt in index.html lösen (Datei bearbeiten, Markierungen entfernen)
#    (Siehe Kapitel 5.4 für Details)

# 5. Nach Lösung: Committen
git add index.html
git commit -m "Merge: Konflikt gelöst"

# 6. Pushen
git push origin feature-konflikt-b

# 7. Pull Request auf GitHub aktualisieren und mergen

9.3 Zusammenfassung der Praxisprojekte

Projekt 1 (Einzelentwicklung):

  • Git-Repository initialisieren
  • Dateien committen
  • Branches für Features verwenden
  • Zu GitHub pushen

Projekt 2 (Teamarbeit):

  • Repository klonen
  • Paralleles Arbeiten in Feature-Branches
  • Pull Requests erstellen
  • Merge-Konflikte lösen

📝 Zusammenfassung

In diesem Kapitel haben Sie gelernt:

  • Praxisprojekt 1: Einzelentwicklung (Website versionieren)
  • Praxisprojekt 2: Teamarbeit (zwei Entwickler, Konfliktlösung)
  • Wichtige Git-Befehle in der Praxis angewendet

Nächstes Kapitel: Wir werden ein Unternehmensprojekt simulieren (komplexer Workflow).



Copyright © 2024 Git-Tutorial für Anfänger

Frei für alle Anfänger