# Nový Bootstrap Projekt
## 🎯 Účel projektu
Tento projekt slouží jako **prázdná šablona** pro vytváření nových Bootstrap projektů. Obsahuje základní připojení Bootstrap CSS a JS.
## 📚 Co projekt obsahuje
- **Bootstrap 5.x** - lokální soubory CSS a JS
- **Základní HTML struktura** - připravená pro vývoj
- **Viewport meta tag** - pro responzivitu
## 📂 Soubory v projektu
- `index.html` - základní HTML s připojeným Bootstrapem
- `css/bootstrap.css` - Bootstrap CSS (lokální soubor)
- `js/bootstrap.js` - Bootstrap JavaScript (lokální soubor)
## 🚀 Jak použít tento projekt
### Krok 1: Zkopírujte složku
```bash
# Zkopírujte celou složku novyprojekt_bootstrap
# Přejmenujte na název vašeho projektu, např.:
- muj_novy_projekt/
- portfolio_stranky/
- eshop_projekt/
```
### Krok 2: Upravte index.html
```html
Můj projekt
```
## 💡 Užitečné Bootstrap třídy
### Container a Grid:
```html
```
### Utility třídy:
```html
m-3 = margin všude
mt-2 = margin-top
px-4 = padding vlevo a vpravo
text-primary = modrý text
bg-danger = červené pozadí
d-flex = display: flex
d-none d-md-block = skryto na mobilu, zobrazeno na tabletu+
```
### Komponenty:
```html
Success!
...
```
## 🔗 Bootstrap dokumentace
- **Oficiální dokumentace:** https://getbootstrap.com/docs/5.3/
- **Bootstrap Icons:** https://icons.getbootstrap.com/
- **Bootstrap Examples:** https://getbootstrap.com/docs/5.3/examples/
## 📚 Související lekce
Před použitím tohoto projektu se ujistěte, že jste prošli:
- **13_bootstrap_intro** - úvod do Bootstrapu
- **14_bootstrap_layout** - Bootstrap layout
- **15_bootstrap_components** - Bootstrap komponenty
## 💡 Tip pro studenty
**Kdy použít tento projekt:**
- ✅ Nový Bootstrap projekt od nuly
- ✅ Prototypování webové stránky
- ✅ Cvičení Bootstrap komponent
- ✅ Školní projekty
**Alternativa - CDN (online Bootstrap):**
```html
```
**Výhody lokálních souborů:**
- Funguje offline
- Rychlejší (není potřeba stahovat z internetu)
**Výhody CDN:**
- Menší velikost projektu
- Možná už v cache prohlížeče
## ⚠️ Důležité poznámky
1. **Bootstrap.js vyžaduje** - carousel, modal, dropdown fungují jen s připojeným JS
2. **Viewport meta tag je povinný** - bez něj responzivita nebude fungovat
3. **jQuery není potřeba** - Bootstrap 5 už jQuery nepotřebuje
## 🎯 Další kroky
1. Prozkoumejte [Bootstrap dokumentaci](https://getbootstrap.com/)
2. Vyzkoušejte různé komponenty
3. Vytvořte vlastní projekt pomocí této šablony
4. Experimentujte s utility třídami
Hodně štěstí s vaším projektem! 🚀