🚀 Antigravity Guide

Interaktivní webová učebnice pro Google Antigravity IDE
Od nuly k Power Userovi ve 4 fázích

🎓 Registrace učitelů • 🌐 Live Demo • Quick Start • Funkce • Struktura • Přispívání • Licence

---

📖 O projektu

Antigravity Guide je komplexní interaktivní webová učebnice navržená pro učitele a vývojáře, kteří chtějí efektivně využívat Google Antigravity IDE - revoluční AI-powered vývojovou platformu od Google.

Projekt vznikl s cílem maximálně zjednodušit práci učitelům při zavádění moderních AI nástrojů do výuky, aby měli více času věnovat se samotným studentům.

🎓 START tady → — Připojte se ke komunitě pedagogů využívajících AI!

🎯 Pro koho je tento průvodce?

• Učitelé informatiky - Kompletní materiál pro výuku AI-assisted development
• Začínající vývojáři - Step-by-step průvodce od instalace po pokročilé funkce
• Zkušení programátoři - Rychlý přechod z Cursor/Windsurf/Copilot
• Tech leads - Pochopení potenciálu pro týmy

---

⚡ Quick Start

Online verze (doporučeno)

Nejrychlejší způsob je použít online verzi:

👉 https://emperorkundis.github.io/ProgramProUcitele/WebApp_Guide/

Lokální instalace

Požadavky

• Webový prohlížeč (Chrome, Firefox, Safari, Edge)
• Python 3.x (pro lokální server) nebo VS Code s Live Server

Spuštění

# Klonování repozitáře
git clone https://github.com/EmperorKunDis/ProgramProUcitele.git
cd ProgramProUcitele/WebApp_Guide

# Spuštění lokálního serveru
python3 -m http.server 8000

# Otevřete v prohlížeči
# http://localhost:8000

Alternativně: Otevřete index.html pomocí VS Code Live Server extension.

---

✨ Funkce

📚 4 Progresivní fáze učení

Fáze	Název	Sekcí	Popis
🟢	Základy	12	Instalace, první kroky, základní koncepty
🔵	Navigace & Data	8	Efektivní práce s editorem a daty
🟣	Pro Workflow	8	Pokročilé techniky a automatizace
🔴	God Mode	8	Multi-agent orchestrace, custom workflows

🛠️ Technické funkce

• 🔍 Fulltext vyhledávání - Rychlé hledání v celém obsahu (Cmd/Ctrl+K)
• 🌓 Dark/Light mode - Automatické ukládání preference
• 📊 Progress tracking - Sledování postupu v každé fázi
• ⌨️ Keyboard navigace - Plná podpora klávesových zkratek
• 📱 Responzivní design - Tablet a Desktop (1024px+)
• 💾 Offline podpora - Funguje po prvním načtení
• 📋 Copy-to-clipboard - Jedním klikem zkopírujte kód

⌨️ Klávesové zkratky

Zkratka	Akce
Cmd/Ctrl + K	Otevřít vyhledávání
← / →	Předchozí / Další sekce
J / K	Alternativní navigace
Escape	Zavřít modální okno

---

📁 Struktura projektu

landing/                        # 🎓 Registrace učitelů
├── 📄 index.html              # Landing page s animací
├── 📄 styles.css              # Styly (dark mode, gradienty)
└── 📄 app.js                  # Formulář a Discord redirect

WebApp_Guide/
├── 📄 index.html              # Landing page s roadmapou
├── 📄 PRD.md                  # Product Requirements Document
├── 📄 CLAUDE.md               # Instrukce pro AI asistenta
│
├── 📁 antigravity-guide/      # Fáze 1: Základy (12 sekcí)
│   ├── index.html
│   ├── config.json
│   ├── js/
│   │   ├── app.js
│   │   └── modules/
│   ├── css/
│   └── sections/
│
├── 📁 phase2-navigation/      # Fáze 2: Navigace (8 sekcí)
├── 📁 phase3-pro-workflow/    # Fáze 3: Pro Workflow (8 sekcí)
├── 📁 phase4-god-mode/        # Fáze 4: God Mode (8 sekcí)
│
├── 📁 PromptLibrary/          # Knihovna promptů
└── 📁 assets/                 # Obrázky, ikony, videa

Architektura každé fáze

{phase}/
├── index.html          # SPA shell
├── config.json         # Definice sekcí a metadata
├── js/
│   ├── app.js          # Hlavní aplikační logika
│   └── modules/
│       ├── search.js   # Fulltext vyhledávání
│       └── glossary.js # Slovník pojmů
├── css/
│   ├── main.css        # Hlavní styly
│   ├── variables.css   # CSS proměnné (PRAUT barvy)
│   └── components/     # Komponentové styly
└── sections/           # HTML fragmenty obsahu

---

🎨 Design System

Barevná paleta (PRAUT Brand)

Barva	Hex	Použití
🟣 Primary	#5B2C9D	Hlavní akcenty
🟪 Secondary	#7C4DFF	Sekundární prvky
🟢 Success	#00C853	Úspěch, tipy
🔴 Danger	#D50000	Varování, chyby
🟡 Warning	#FFAB00	Upozornění

Callout komponenty

<!-- Tip -->
<div class="callout callout-tip">
  <span class="callout-icon">💡</span>
  <div class="callout-content">
    <strong>Tip:</strong> Užitečná rada...
  </div>
</div>

<!-- Warning -->
<div class="callout callout-warning">⚠️ Pozor na...</div>

<!-- Info -->
<div class="callout callout-info">ℹ️ Informace...</div>

<!-- Danger -->
<div class="callout callout-danger">❌ Kritické varování...</div>

---

🔧 Vývoj

Přidání nové sekce

1. Vytvořte HTML fragment v {phase}/sections/:

   touch phase2-navigation/sections/09-nova-sekce.html

2. Přidejte záznam do config.json:

   {
     "id": "09-nova-sekce",
     "title": "9. Nová Sekce",
     "file": "sections/09-nova-sekce.html",
     "readingTime": "5 min"
   }

Přidání nové fáze

1. Zkopírujte existující strukturu fáze
2. Aktualizujte config.json s novým číslem fáze
3. Přidejte odkaz na root index.html
4. Aktualizujte App.updatePhaseSwitcher() v každé fázi

Testování

# Spuštění dev serveru
python3 -m http.server 8000

# Otevřete jednotlivé fáze
# http://localhost:8000/antigravity-guide/
# http://localhost:8000/phase2-navigation/
# http://localhost:8000/phase3-pro-workflow/
# http://localhost:8000/phase4-god-mode/

---

🤝 Přispívání

Příspěvky jsou vítány! Přečtěte si prosím CONTRIBUTING.md pro detaily.

Rychlý přehled

1. Forkněte repozitář
2. Vytvořte feature branch (git checkout -b feature/nova-funkce)
3. Commitněte změny (git commit -m 'Přidání nové funkce')
4. Pushněte branch (git push origin feature/nova-funkce)
5. Otevřete Pull Request

---

📋 Roadmapa

• Fáze 1: Základy (12 sekcí)
• Fáze 2: Navigace & Data (8 sekcí)
• Fáze 3: Pro Workflow (8 sekcí)
• Fáze 4: God Mode (8 sekcí)
• Landing page s vizualizacemi
• 🎓 Registrační stránka pro učitele (s intro animací)
• Video tutoriály
• Interaktivní playground
• Quiz / Knowledge check
• Lokalizace EN/DE
• PWA podpora

---

📚 Dokumentace

Dokument	Popis
PRD.md	Product Requirements Document
CLAUDE.md	Instrukce pro AI asistenty
DISCORD_SETUP.md	🎮 Návod pro nastavení Discord serveru
CONTRIBUTING.md	Návod pro přispěvatele
CHANGELOG.md	Historie změn

---

🔗 Užitečné odkazy

• 🎓 Registrace pro učitele — Připojte se ke komunitě!
• 🎮 Discord komunita — Antigravity Guide | Praut.cz
• 🌐 Live Demo
• Google Antigravity - Oficiální dokumentace
• Google Antigravity - Download
• Google Antigravity - Changelog
• Praut s.r.o. - Autor projektu

---

📄 Licence

Tento projekt je licencován pod MIT License - viz LICENSE soubor.

---

👏 Poděkování

• Google - Za vytvoření Antigravity IDE
• Praut s.r.o. - Za vývoj této učebnice
• Všichni přispěvatelé - Za pomoc s rozvojem projektu

🌐 WebGuide Po Registraci →

---

Vytvořeno s ❤️ v České republice
Made by Martin Švanda from Praut s.r.o. © 2026