DevPanicZone Logo DevPanicZone! Cheatsheets.

Terminal & Bash Basics

Die wichtigsten Kommandozeilen-Befehle für Navigation, Dateiverwaltung, Git und NPM - mit Cheatsheet.

Was ist das Terminal?

Das Terminal ist eine textbasierte Schnittstelle zu deinem Computer. Statt mit Maus und Fenstern arbeitest du hier mit Textbefehlen. Das mag am Anfang umständlich wirken, ist aber deutlich schneller und mächtiger als die grafische Oberfläche.

Wichtig

Auf Mac/Linux heißt die Shell "Bash" oder "Zsh". Auf Windows gibt es "PowerShell" oder "Git Bash". Die meisten Befehle funktionieren überall gleich.

Terminal öffnen

Mac

Cmd + Space

→ "Terminal" eingeben → Enter

Windows

Win + R

→ "cmd" oder "powershell" eingeben → Enter

VS Code

Ctrl + `

(Backtick) öffnet integriertes Terminal

VS Code vom Terminal öffnen 
# Aktuellen Ordner in VS Code öffnen
code .

# Bestimmte Datei öffnen
code index.html

# Neues Fenster
code -n .

Hinweis: Funktioniert nur, wenn VS Code im PATH ist. Bei Mac: In VS Code Cmd + Shift + P → "Shell Command: Install 'code' command in PATH"

Grundlagen: Navigation

Die wichtigsten Befehle, um dich durch Ordner zu bewegen:

pwd - Wo bin ich?

Print Working Directory - Zeigt deinen aktuellen Ordner.

bash 
pwd
# Ausgabe: /Users/name/DevPanicZone

ls - Was ist hier?

List - Zeigt alle Dateien und Ordner im aktuellen Verzeichnis.

bash 
# Einfache Liste
ls

# Detaillierte Liste mit Berechtigungen, Größe, Datum
ls -l

# Inkl. versteckter Dateien (z.B. .git, .env)
ls -la

# Nur HTML-Dateien anzeigen
ls *.html

cd - Ordner wechseln

Change Directory - Wechselt in einen anderen Ordner.

bash 
# In Unterordner wechseln
cd tutorials

# In Unterordner von Unterordner
cd tutorials/html

# Eine Ebene nach oben
cd ..

# Zwei Ebenen nach oben
cd ../..

# Direkt ins Home-Verzeichnis
cd ~

# Zurück zum vorherigen Ordner
cd -

# Zum Root deines Projekts (wenn du irgendwo tief drin bist)
cd ~/DevPanicZone

clear - Terminal leeren

Räumt das Terminal auf, wenn es zu voll wird.

bash 
# Terminal leeren
clear

# Oder Shortcut: Ctrl + L (Mac/Linux) bzw. Cmd + K (Mac Terminal)
Tipp

Mit Tab kannst du Ordner- und Dateinamen automatisch vervollständigen. Tippe cd tut und drücke Tab → wird zu cd tutorials/

Dateien & Ordner verwalten

mkdir - Ordner erstellen

Make Directory - Erstellt einen neuen Ordner.

bash 
# Einzelner Ordner
mkdir css-advanced

# Mehrere Ordner auf einmal
mkdir images fonts icons

# Ordner mit Unterordnern (Parent-Ordner werden automatisch erstellt)
mkdir -p tutorials/javascript/basics

touch - Datei erstellen

Erstellt eine leere Datei oder aktualisiert den Zeitstempel.

bash 
# Einzelne Datei
touch index.html

# Mehrere Dateien
touch style.css script.js

# Datei in Unterordner erstellen
touch tutorials/html/html-forms.html

cp - Kopieren

Copy - Kopiert Dateien oder Ordner.

bash 
# Datei kopieren
cp index.html index-backup.html

# Datei in anderen Ordner kopieren
cp style.css assets/css/

# Ganzen Ordner kopieren (mit allem Inhalt)
cp -r tutorials tutorials-backup

mv - Verschieben/Umbenennen

Move - Verschiebt oder benennt Dateien um.

bash 
# Datei umbenennen
mv old-name.html new-name.html

# Datei verschieben
mv style.css assets/css/

# Ordner umbenennen
mv old-folder new-folder

# Mehrere Dateien verschieben
mv *.html tutorials/

rm - Löschen

Remove - Löscht Dateien oder Ordner.

bash 
# Datei löschen
rm old-file.html

# Mehrere Dateien löschen
rm file1.html file2.css

# Ordner mit Inhalt löschen
rm -r old-folder

# Alle HTML-Dateien löschen
rm *.html

# Löschen ohne Nachfrage (Vorsicht!)
rm -rf folder
Achtung

rm löscht endgültig! Keine Wiederherstellung möglich. Der Papierkorb wird umgangen. Sei vorsichtig mit rm -rf!

Dateien anzeigen & bearbeiten

cat - Dateiinhalt anzeigen

Concatenate - Zeigt den kompletten Inhalt einer Datei.

bash 
# Datei anzeigen
cat index.html

# Mehrere Dateien hintereinander anzeigen
cat file1.txt file2.txt

# Mit Zeilennummern
cat -n index.html

head & tail - Erste/Letzte Zeilen

bash 
# Erste 10 Zeilen anzeigen
head index.html

# Erste 20 Zeilen
head -n 20 index.html

# Letzte 10 Zeilen
tail style.css

# Datei "live" verfolgen (z.B. Logs)
tail -f server.log

less - Datei durchblättern

Öffnet Datei zum Durchscrollen (besser als cat bei großen Dateien).

bash 
less index.html

# Navigation:
# Pfeiltasten = Scrollen
# Space = Nächste Seite
# b = Vorherige Seite
# q = Beenden
# /suchbegriff = Suchen

echo - Text ausgeben

Gibt Text aus – nützlich für Scripts und zum Testen von Variablen.

bash 
# Einfache Ausgabe
echo "Hallo Welt"

# Variable ausgeben
echo $PATH

# In Datei schreiben
echo "Neuer Inhalt" > datei.txt

# An Datei anhängen
echo "Mehr Inhalt" >> datei.txt

Suchen & Finden

find - Dateien finden

bash 
# Alle HTML-Dateien im aktuellen Ordner
find . -name "*.html"

# Alle CSS-Dateien in tutorials/
find tutorials -name "*.css"

# Dateien die vor 7 Tagen geändert wurden
find . -mtime -7

# Große Dateien finden (über 10MB)
find . -size +10M

grep - In Dateien suchen

Sucht nach Text innerhalb von Dateien.

bash 
# Nach "TODO" in allen JS-Dateien suchen
grep "TODO" *.js

# Rekursiv in allen Dateien suchen
grep -r "class=" .

# Mit Zeilennummern
grep -n "function" script.js

# Groß-/Kleinschreibung ignorieren
grep -i "error" log.txt

# Nur Dateinamen anzeigen (ohne Inhalt)
grep -l "navbar" *.html

NPM & Node.js Befehle

Unverzichtbar für moderne Webentwicklung:

Package Management

bash 
# Projekt initialisieren
npm init
npm init -y  # Mit Standard-Werten

# Packages installieren
npm install
npm install jsdom  # Einzelnes Package
npm install --save-dev eslint  # Als Dev-Dependency

# Package entfernen
npm uninstall jsdom

# Globales Package installieren
npm install -g npm  # NPM selbst aktualisieren

# Outdated Packages prüfen
npm outdated

# Packages aktualisieren
npm update

Scripts ausführen

bash 
# In deinem DevPanicZone-Projekt:

# Navigation generieren
npm run build

# Search-Index generieren  
npm run search

# Dev-Server starten (falls vorhanden)
npm start

# Tests ausführen (falls vorhanden)
npm test

Node.js Scripts ausführen

bash 
# JavaScript-Datei ausführen
node script.js

# Mit Parametern
node generate-navigation.js --debug

# Syntax prüfen ohne Ausführung
node --check script.js

Git Basics

Die wichtigsten Git-Befehle für Versionskontrolle:

Repository Setup

bash 
# Git-Repository initialisieren
git init

# Existierendes Repo klonen
git clone https://github.com/user/repo.git

# Status anzeigen (geänderte Dateien)
git status

# Kurzer Status
git status -s

Änderungen committen

bash 
# Alle Änderungen zum Commit hinzufügen
git add .

# Einzelne Datei hinzufügen
git add index.html

# Commit erstellen
git commit -m "Add navigation component"

# Add + Commit in einem (nur für bereits getrackte Dateien)
git commit -am "Update styles"

# Letzten Commit bearbeiten
git commit --amend

Gängige Type-Prefixes

  • Refactor: Code-Umstrukturierung
  • Add: neues Feature
  • Fix: Bugfix
  • Update: Änderungen
  • Remove: Löschungen

History & Logs

bash 
# Commit-History anzeigen
git log

# Kompakte History
git log --oneline

# Letzte 5 Commits
git log -5

# Mit Graph (bei Branches)
git log --graph --oneline

# Änderungen in einem Commit sehen
git show abc123

Remote & Sync

bash 
# Remote Repository hinzufügen
git remote add origin https://github.com/user/repo.git

# Remote anzeigen
git remote -v

# Änderungen hochladen
git push

# Änderungen herunterladen
git pull

# Branch pushen
git push origin main

Nützliche Kombinationen

Häufige Workflows für das DevPanicZone-Projekt:

Neue Tutorial-Kategorie erstellen

bash 
# 1. Ordner erstellen
mkdir -p tutorials/python/basics

# 2. Index-Seite erstellen
touch tutorials/python/index.html

# 3. Erste Tutorial-Datei
touch tutorials/python/basics/python-intro.html

# 4. Navigation generieren
npm run build

# 5. Git commit
git add .
git commit -m "Add Python tutorial category"
git push

Projekt aufräumen

bash 
# Alle node_modules löschen und neu installieren
rm -rf node_modules
npm install

# Cache leeren
npm cache clean --force

# Backup vor größeren Änderungen
cp -r . ../DevPanicZone-backup

Schnelle Dateisuche

bash 
# Alle Tutorials finden, die "flexbox" erwähnen
grep -r "flexbox" tutorials/

# Alle leeren HTML-Dateien finden
find . -name "*.html" -size 0

# Alle Dateien, die heute geändert wurden
find . -name "*.html" -mtime 0

Shortcuts & Tricks

Tastenkombinationen

Ctrl + C

Aktuellen Befehl abbrechen

Ctrl + L

Terminal leeren (clear)

↑ ↓

Durch Befehls-History navigieren

Tab

Auto-Vervollständigung

Ctrl + A

Zum Zeilenanfang

Ctrl + E

Zum Zeilenende

Ctrl + U

Zeile löschen

Ctrl + R

In History suchen

Nützliche Tipps

Befehl wiederholen 
# Letzten Befehl nochmal ausführen
!!

# Befehl 3 zurück ausführen
!-3

# Letzten Befehl mit "git" ausführen
!git
Mehrere Befehle kombinieren 
# Nacheinander ausführen (auch bei Fehler)
npm install; npm run build; git status

# Nur weitermachen wenn vorheriger Befehl erfolgreich
npm install && npm run build && git push

# Ausgabe umleiten
ls > dateiliste.txt  # In Datei schreiben
ls >> dateiliste.txt  # An Datei anhängen

Aliases erstellen

Erstelle Shortcuts für häufige Befehle:

bash 
# In ~/.bashrc oder ~/.zshrc eintragen:

# Git Shortcuts
alias gs="git status"
alias ga="git add"
alias gc="git commit -m"
alias gp="git push"

# Navigation
alias ..="cd .."
alias ...="cd ../.."
alias dpz="cd ~/DevPanicZone"

# NPM Shortcuts
alias build="npm run build"
alias dev="npm run dev"

# Nach dem Speichern neu laden:
source ~/.bashrc  # oder ~/.zshrc

Hilfe & Dokumentation

Wenn du nicht weiterweißt:

bash 
# Hilfe für einen Befehl anzeigen
man ls  # Manual Page
ls --help  # Schnelle Hilfe

# Befehl-Typ herausfinden
which node  # Zeigt Pfad zur Executable
type cd  # Zeigt ob Befehl, Alias oder Funktion

# Command History anzeigen
history
history | grep "git"  # Nur Git-Befehle

Cheatsheet: Die wichtigsten Befehle

Navigation

  • pwd - Aktueller Ordner
  • ls - Dateien anzeigen
  • cd folder - Ordner wechseln
  • cd .. - Eine Ebene hoch

Dateien

  • mkdir - Ordner erstellen
  • touch - Datei erstellen
  • cp - Kopieren
  • mv - Verschieben/Umbenennen
  • rm - Löschen

Anzeigen

  • cat - Datei anzeigen
  • less - Durchblättern
  • head - Erste Zeilen
  • tail - Letzte Zeilen

Suchen

  • find - Dateien finden
  • grep - In Dateien suchen

Git

  • git status - Status
  • git add . - Alle hinzufügen
  • git commit -m - Commit
  • git push - Hochladen
  • git pull - Herunterladen

NPM

  • npm install - Packages installieren
  • npm run build - Build-Script
  • node file.js - Script ausführen

Best Practices

  • Backup vor rm -rf: Lösche nie blind große Ordner
  • Tab nutzen: Auto-Vervollständigung spart Zeit und vermeidet Tippfehler
  • Git regelmäßig committen: Kleine, häufige Commits sind besser als große
  • Pfade verstehen: . = aktueller Ordner, .. = eine Ebene hoch
  • History nutzen: ↑ spart Tipparbeit
  • Aliases erstellen: Für häufig genutzte Befehle
  • Dokumentation lesen: man und --help sind deine Freunde

Zusammenfassung

Das Terminal ist ein mächtiges Werkzeug, das am Anfang einschüchternd wirken kann. Mit den Grundbefehlen aus diesem Tutorial kommst du aber schon sehr weit! Die meiste Zeit brauchst du nur:

  • cd, ls, pwd - Navigation
  • npm install, npm run build - Package Management
  • git add, git commit, git push - Versionskontrolle

Der Rest kommt mit der Zeit. Experimentiere, probiere aus - im schlimmsten Fall drückst du Ctrl + C und fängst neu an!

Mehr aus Verschiedenes

Tutorials werden geladen...