Git & Moderní
Workflow

Co je Git a proč ho používat?

Git je distribuovaný systém správy verzí — uchovává celou historii změn projektu. Každý vývojář má kompletní kopii repozitáře lokálně. Git není GitHub — Git je nástroj, GitHub je hostingová platforma.

Základní Git příkazy

Denní workflow se skládá z několika málo příkazů. Naučte se je zpaměti — pak přijdou automaticky.

# ── INICIALIZACE ──────────────────────────
$ git init               # nový repozitář
$ git clone URL          # stažení existujícího

# ── STAV A PŘEHLED ────────────────────────
$ git status             # co je změněno
$ git log --oneline      # stručná historie
$ git diff               # nestaged rozdíly

# ── STAGING A COMMIT ──────────────────────
$ git add .              # přidat vše
$ git add -p             # interaktivní výběr
$ git commit -m "popis"  # uložit snapshot
$ git commit --amend     # opravit poslední commit

# ── VRÁCENÍ ZMĚN ──────────────────────────
$ git restore .          # zahodit neuložené
$ git revert HEAD        # bezpečně vrátit commit
$ git stash              # odložit změny stranou
$ git stash pop          # vrátit odloženéKopírovat

Dobrá commit zpráva — Conventional Commits

# ❌ Špatně
git commit -m "oprava"
git commit -m "změny"

# ✅ Správně
git commit -m "fix: oprava přepočtu DPH u zahraničních objednávek"
git commit -m "feat: přidána filtrace produktů podle kategorie"
git commit -m "docs: aktualizace README s instalačními kroky"
git commit -m "refactor: extrahování validační logiky do helpers.js"

# Předpony: feat | fix | docs | style | refactor | test | choreKopírovat

🎮 Interaktivní Git simulátor

Větve (Branches)

Větve jsou "paralelní vesmíry" vašeho projektu — experimentujte bez rizika poškození hlavní větve.

# Práce s větvemi
$ git branch                     # seznam větví
$ git checkout -b feature/login  # vytvoří + přepne
$ git switch -c feature/login    # moderní alternativa
$ git checkout main              # přepne zpět

# Merge — sloučení větví
$ git checkout main
$ git merge feature/login        # sloučí do main
$ git branch -d feature/login    # smaže větev

# Rebase — čistší historie
$ git rebase main                # přebazuje na main
$ git rebase -i HEAD~3           # squash 3 commitůKopírovat

GitHub workflow

GitHub je nejrozšířenější platforma pro hostování Git repozitářů. Přidává Pull Requesty, Issues, Actions (CI/CD) a Pages.

# Propojení s GitHubem
$ git remote add origin https://github.com/user/repo.git
$ git push -u origin main     # první push

# Denní synchronizace
$ git pull                    # stáhnout změny
$ git push                    # nahrát commity

# Řešení merge konfliktu
$ git pull                    # ← konflikt!
# Otevřete soubor, najděte značky:
<<<<<<< HEAD
  vaše verze
=======
  jejich verze
>>>>>>> origin/main
# Upravte, odstraňte značky, pak:
$ git add . && git commit -m "fix: merge conflict"Kopírovat

Pull Request workflow

1. Vytvořte feature větev: git checkout -b feat/nova-funkce
2. Implementujte, commitujte průběžně
3. Pushněte: git push origin feat/nova-funkce
4. Na GitHubu otevřete Pull Request
5. Kolega provede code review
6. Po schválení: Merge PR do main
7. Smažte větev: git branch -d feat/nova-funkce

.gitignore — co neverzovat

# Vždy přidejte do kořene projektu
node_modules/    # npm závislosti (velké, regenerovatelné)
.env             # tajné proměnné (API klíče, hesla!)
.DS_Store        # macOS systémové soubory
dist/            # build výstup
*.log            # logy
.idea/           # IDE souboryKopírovat

npm & Node.js ekosystém

npm (Node Package Manager) je největší ekosystém open-source balíčků — přes 2 miliony. Node.js přinesl JavaScript na server.

# Inicializace projektu
$ npm init -y              # vytvoří package.json

# Instalace balíčků
$ npm install axios        # přidá do dependencies
$ npm install -D vite      # přidá do devDependencies
$ npm install              # instaluje z package.json
$ npm uninstall axios      # odstraní balíček
$ npm audit fix            # opraví bezpečnostní chyby

# Spouštění skriptů
$ npm run dev              # dev server
$ npm run build            # produkční build

# Vite — moderní dev server
$ npm create vite@latest moje-app -- --template vanilla
$ cd moje-app && npm install && npm run dev
# → http://localhost:5173 (live reload)Kopírovat

VS Code — tipy pro produktivitu

Nepostradatelná rozšíření

• Prettier — automatické formátování při uložení
• ESLint — upozorní na chyby v JS
• GitLens — git blame a history v editoru
• Live Server — lokální server s live reload
• Auto Rename Tag — přejmenuje párový HTML tag
• CSS Peek — go-to-definition pro CSS třídy

Nejdůležitější klávesové zkratky

Doporučené settings.json

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.tabSize": 2,
  "editor.wordWrap": "on",
  "editor.bracketPairColorization.enabled": true,
  "files.autoSave": "onFocusChange"
}Kopírovat

Praktické cvičení — Git simulátor

Projděte kompletní workflow: inicializace → první commit → feature větev → merge. Použijte simulátor níže.

Taháček — Git cheat sheet

Denní workflow

$ git pull                          # začněte vždy stažením
$ git checkout -b feat/nova-funkce  # nová větev
# ... programujte ...
$ git add . && git commit -m "feat: popis"
$ git push origin feat/nova-funkce  # push + PRKopírovat

Zachraňovací příkazy

$ git stash                # odložit změny
$ git stash pop            # vrátit odložené
$ git revert HEAD          # bezpečně vrátit commit
$ git restore .            # zahodit neuložené
$ git log --oneline -10    # posledních 10 commitůKopírovat

Zlatá pravidla

• ✅ Vždy git pull před začátkem práce
• ✅ Malé, časté commity s popisnou zprávou
• ✅ Feature větve — nikdy přímo do main
• ✅ .gitignore hned na začátku projektu
• ✅ Nikdy .env soubory do Gitu
• ❌ git push --force na sdílené větve
• ❌ node_modules do repozitáře