msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity

chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes)

Browse Source
pull/1694/head
localizeflow[bot] 7 months ago
parent 3f34004ec0
commit 13f671d5cf
12 changed files with 1084 additions and 926 deletions
Show Stats Download Patch File Download Diff File

12
translations/cs/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2025-10-03T11:37:46+00:00", "translation_date": "2026-02-06T18:18:33+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "cs" "language_code": "cs"
}, },
@ -516,11 +516,17 @@
"language_code": "cs" "language_code": "cs"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T19:00:53+00:00", "translation_date": "2026-02-06T18:11:29+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "cs" "language_code": "cs"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T18:15:49+00:00",
"source_file": "Roadmap.md",
"language_code": "cs"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2025-08-28T03:21:59+00:00", "translation_date": "2025-08-28T03:21:59+00:00",

342
translations/cs/AGENTS.md
Unescape View File

@ -2,281 +2,281 @@
## Přehled projektu ## Přehled projektu
Toto je vzdělávací úložiště určené k výuce základů webového vývoje pro začátečníky. Kurikulum je komplexní 12týdenní kurz vyvinutý Microsoft Cloud Advocates, který obsahuje 24 praktických lekcí zaměřených na JavaScript, CSS a HTML. Toto je vzdělávací repozitář učebního plánu pro výuku základů webového vývoje pro začátečníky. Kurikulum je komplexní 12týdenní kurz vyvinutý Microsoft Cloud Advocates, obsahující 24 praktických lekcí pokrývajících JavaScript, CSS a HTML.
### Klíčové komponenty ### Klíčové komponenty
- **Vzdělávací obsah**: 24 strukturovaných lekcí organizovaných do modulů založených na projektech - **Vzdělávací obsah**: 24 strukturovaných lekcí uspořádaných do modulů založených na projektech
- **Praktické projekty**: Terárium, hra na psaní, rozšíření pro prohlížeč, vesmírná hra, bankovní aplikace, editor kódu a AI chatovací asistent - **Praktické projekty**: Terrarium, Hra na psaní, Rozšíření prohlížeče, Kosmická hra, Bankovní aplikace, Kódovací editor a AI chat asistent
- **Interaktivní kvízy**: 48 kvízů, každý s 3 otázkami (před/po lekci) - **Interaktivní kvízy**: 48 kvízů po 3 otázkách (před a po lekci)
- **Podpora více jazyků**: Automatické překlady do více než 50 jazyků pomocí GitHub Actions - **Podpora vícejazyčnosti**: Automatizované překlady do více než 50 jazyků přes GitHub Actions
- **Technologie**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (pro AI projekty) - **Technologie**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (pro AI projekty)
### Architektura ### Architektura
- Vzdělávací úložiště se strukturou založenou na lekcích - Vzdělávací repozitář s strukturou založenou na lekcích
- Každá složka lekce obsahuje README, příklady kódu a řešení - Každá složka lekce obsahuje README, ukázky kódu a řešení
- Samostatné projekty v oddělených adresářích (quiz-app, různé projekty lekcí) - Samostatné projekty v oddělených adresářích (quiz-app, různé projekty lekcí)
- Systém překladů pomocí GitHub Actions (co-op-translator) - Překladový systém využívající GitHub Actions (co-op-translator)
- Dokumentace poskytovaná přes Docsify a dostupná jako PDF - Dokumentace poskytovaná přes Docsify a dostupná jako PDF
## Příkazy pro nastavení ## Příkazy pro nastavení
Toto úložiště je primárně určeno pro konzumaci vzdělávacího obsahu. Pro práci s konkrétními projekty: Tento repozitář je určen především ke konzumaci vzdělávacího obsahu. Pro práci s konkrétními projekty:
### Nastavení hlavního úložiště ### Hlavní nastavení repozitáře
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Nastavení aplikace Quiz (Vue 3 + Vite) ### Nastavení Quiz App (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Start development server npm run dev # Spustit vývojový server
npm run build # Build for production npm run build # Sestavit pro produkci
npm run lint # Run ESLint npm run lint # Spustit ESLint
``` ```
### API bankovního projektu (Node.js + Express) ### Bankovní projekt API (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Start API server npm start # Spustit API server
npm run lint # Run ESLint npm run lint # Spustit ESLint
npm run format # Format with Prettier npm run format # Formátovat pomocí Prettier
``` ```
### Projekty rozšíření pro prohlížeč ### Projekty rozšíření prohlížeče
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Follow browser-specific extension loading instructions # Postupujte podle specifických pokynů pro načítání rozšíření v prohlížeči
``` ```
### Projekty vesmírné hry ### Projekty Kosmické hry
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# Open index.html in browser or use Live Server # Otevřete index.html v prohlížeči nebo použijte Live Server
``` ```
### Projekt chatu (Python Backend) ### Chat projekt (Python backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Set GITHUB_TOKEN environment variable # Nastavte proměnnou prostředí GITHUB_TOKEN
python api.py python api.py
``` ```
## Pracovní postup vývoje ## Vývojový workflow
### Pro přispěvatele obsahu ### Pro přispěvatele obsahu
1. **Forkněte úložiště** na svůj GitHub účet 1. **Vytvořte fork** repozitáře na svém GitHub účtu
2. **Naklonujte svůj fork** lokálně 2. **Naklonujte svůj fork** lokálně
3. **Vytvořte novou větev** pro své změny 3. **Vytvořte novou větev** pro své změny
4. Proveďte změny v obsahu lekcí nebo příkladech kódu 4. Proveďte změny v obsahu lekcí nebo ukázkách kódu
5. Otestujte změny kódu v relevantních adresářích projektů 5. Otestujte případné změny kódu v příslušných adresářích projeků
6. Odešlete pull requesty podle pokynů pro přispívání 6. Odešlete pull requesty podle pravidel přispívání
### Pro studenty ### Pro studenty
1. Forkněte nebo naklonujte úložiště 1. Vytvořte fork nebo naklonujte repozitář
2. Postupujte sekvenčně v adresářích lekcí 2. Procházejte adresáře lekcí postupně
3. Přečtěte si README soubory pro každou lekci 3. Čtěte README soubory každé lekce
4. Dokončete kvízy před lekcí na https://ff-quizzes.netlify.app/web/ 4. Vyplňte kvízy před lekcí na https://ff-quizzes.netlify.app/web/
5. Projděte příklady kódu v složkách lekcí 5. Propracujte se ukázkami kódu v adresářích lekcí
6. Dokončete úkoly a výzvy 6. Dokončete úkoly a výzvy
7. Absolvujte kvízy po lekci 7. Udělejte kvízy po lekci
### Živý vývoj ### Živý vývoj
- **Dokumentace**: Spusťte `docsify serve` v rootu (port 3000) - **Dokumentace**: Spusťte `docsify serve` v kořenovém adresáři (port 3000)
- **Aplikace Quiz**: Spusťte `npm run dev` v adresáři quiz-app - **Quiz App**: Spusťte `npm run dev` v adresáři quiz-app
- **Projekty**: Použijte rozšíření Live Server ve VS Code pro HTML projekty - **Projekty**: Používejte VS Code Live Server rozšíření pro HTML projekty
- **API projekty**: Spusťte `npm start` v příslušných adresářích API - **API projekty**: Spusťte `npm start` v odpovídajících API adresářích
## Pokyny pro testování ## Instrukce pro testování
### Testování aplikace Quiz ### Testování Quiz App
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Check for code style issues npm run lint # Zkontrolujte problémy se stylem kódu
npm run build # Verify build succeeds npm run build # Ověřte úspěšnost sestavení
``` ```
### Testování API bankovního projektu ### Testování Bank API
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Check for code style issues npm run lint # Zkontrolujte problémy se stylem kódu
node server.js # Verify server starts without errors node server.js # Ověřte, že server startuje bez chyb
``` ```
### Obecný přístup k testování ### Obecný přístup k testování
- Toto je vzdělávací úložiště bez komplexních automatizovaných testů - Jedná se o vzdělávací repozitář bez rozsáhlých automatizovaných testů
- Manuální testování se zaměřuje na: - Manuální testování se zaměřuje na:
- Příklady kódu běží bez chyb - Ukázky kódu bez chybového běhu
- Odkazy v dokumentaci fungují správně - Odkazy v dokumentaci fungují správně
- Projekty se úspěšně sestaví - Projekty se úspěšně sestaví
- Příklady dodržují nejlepší praktiky - Ukázky dodržují osvědčené postupy
### Kontroly před odesláním ### Kontroly před odevzdáním
- Spusťte `npm run lint` v adresářích s package.json - Spusťte `npm run lint` v adresářích s package.json
- Ověřte platnost odkazů v markdownu - Ověřte validitu markdown odkazů
- Otestujte příklady kódu v prohlížeči nebo Node.js - Testujte ukázky kódu v prohlížeči nebo Node.js
- Zkontrolujte, že překlady zachovávají správnou strukturu - Zkontrolujte, že překlady zachovávají správnou strukturu
## Pokyny pro styl kódu ## Pravidla stylu kódu
### JavaScript ### JavaScript
- Používejte moderní syntaxi ES6+ - Používejte moderní ES6+ syntaxi
- Dodržujte standardní konfigurace ESLint poskytované v projektech - Řiďte se standardními ESLint konfiguracemi v projektech
- Používejte smysluplné názvy proměnných a funkcí pro vzdělávací přehlednost - Používejte popisné názvy proměnných a funkcí pro snadné pochopení
- Přidávejte komentáře vysvětlující koncepty pro studenty - Přidávejte komentáře vysvětlující koncepty pro studenty
- Formátujte pomocí Prettier, kde je nakonfigurován - Formátujte pomocí Prettier tam, kde je nastaveno
### HTML/CSS ### HTML/CSS
- Semantické HTML5 prvky - Používejte sémantické HTML5 elementy
- Principy responzivního designu - Principy responzivního designu
- Jasné konvence pojmenování tříd - Jasné konvence pojmenování tříd
- Komentáře vysvětlující techniky CSS pro studenty - Komentáře vysvětlující CSS techniky pro studenty
### Python ### Python
- Pokyny pro styl PEP 8 - Dodržujte PEP 8 styl
- Jasné, vzdělávací příklady kódu - Jasné, vzdělávací ukázky kódu
- Typové anotace tam, kde jsou užitečné pro výuku - Používejte typové hinty tam, kde je to užitečné pro učení
### Dokumentace v Markdownu ### Markdown dokumentace
- Jasná hierarchie nadpisů - Jasná hierarchie nadpisů
- Bloky kódu se specifikací jazyka - Kódové bloky s označením jazyka
- Odkazy na další zdroje - Odkazy na doplňková zdroje
- Snímky obrazovky a obrázky v adresářích `images/` - Snímky obrazovek a obrázky v adresářích `images/`
- Alternativní text pro obrázky kvůli přístupnosti - Alt text pro obrázky pro přístupnost
### Organizace souborů ### Organizace souborů
- Lekce číslované sekvenčně (1-getting-started-lessons, 2-js-basics, atd.) - Lekce číslovány sekvenčně (1-getting-started-lessons, 2-js-basics atd.)
- Každý projekt má `solution/` a často `start/` nebo `your-work/` adresáře - Každý projekt obsahuje adresáře `solution/` a často `start/` nebo `your-work/`
- Obrázky uložené v lekci-specifických složkách `images/` - Obrázky ukládány do specifických `images/` složek lekcí
- Překlady ve struktuře `translations/{language-code}/` - Překlady v adresářové struktuře `translations/{language-code}/`
## Sestavení a nasazení ## Sestavení a nasazení
### Nasazení aplikace Quiz (Azure Static Web Apps) ### Nasazení Quiz App (Azure Static Web Apps)
Aplikace quiz-app je nakonfigurována pro nasazení na Azure Static Web Apps: Quiz-app je nakonfigurována pro nasazení v Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Creates dist/ folder npm run build # Vytváří složku dist/
# Deploys via GitHub Actions workflow on push to main # Nasazuje pomocí workflow GitHub Actions při push do hlavní větve
``` ```
Konfigurace Azure Static Web Apps: Konfigurace Azure Static Web Apps:
- **Umístění aplikace**: `/quiz-app` - **Umístění aplikace**: `/quiz-app`
- **Umístění výstupu**: `dist` - **Výstupní umístění**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Generování PDF dokumentace ### Generování PDF dokumentace
```bash ```bash
npm install # Install docsify-to-pdf npm install # Nainstalujte docsify-to-pdf
npm run convert # Generate PDF from docs npm run convert # Vytvořit PDF z docs
``` ```
### Dokumentace Docsify ### Dokumentace Docsify
```bash ```bash
npm install -g docsify-cli # Install Docsify globally npm install -g docsify-cli # Nainstalujte Docsify globálně
docsify serve # Serve on localhost:3000 docsify serve # Spusťte na localhost:3000
``` ```
### Sestavení specifické pro projekt ### Projektově-specifické sestavení
Každý adresář projektu může mít vlastní proces sestavení: Každý projekt může mít vlastní proces sestavení:
- Projekty Vue: `npm run build` vytvoří produkční balíčky - Vue projekty: `npm run build` vytvoří produkční balíčky
- Statické projekty: Žádný krok sestavení, soubory se servírují přímo - Statické projekty: Žádný build krok, soubory se přímo servírují
## Pokyny pro pull requesty ## Pravidla pro pull requesty
### Formát názvu ### Formát názvu
Používejte jasné, popisné názvy označující oblast změny: Používejte jasné, popisné názvy s označením oblasti změny:
- `[Quiz-app] Přidat nový kvíz pro lekci X` - `[Quiz-app] Přidat nový kvíz pro lekci X`
- `[Lesson-3] Opravit překlep v projektu terária` - `[Lesson-3] Opravit překlep v terrarium projektu`
- `[Translation] Přidat španělský překlad pro lekci 5` - `[Translation] Přidat španělský překlad pro lekci 5`
- `[Docs] Aktualizovat pokyny pro nastavení` - `[Docs] Aktualizovat instalační instrukce`
### Požadované kontroly ### Povinné kontroly
Před odesláním PR: Před odesláním PR:
1. **Kvalita kódu**: 1. **Kvalita kódu**:
- Spusťte `npm run lint` v ovlivněných adresářích projektů - Spusťte `npm run lint` v příslušných projektových složkách
- Opravte všechny chyby a varování lintingu - Opravte všechny lintovací chyby a varování
2. **Ověření sestavení**: 2. **Ověření sestavení**:
- Spusťte `npm run build`, pokud je to relevantní - Spusťte `npm run build` pokud je to relevantní
- Ujistěte se, že nejsou žádné chyby sestavení - Zajistěte, že nejsou žádné chyby sestavení
3. **Validace odkazů**: 3. **Validace odkazů**:
- Otestujte všechny odkazy v markdownu - Otestujte všechny markdown odkazy
- Ověřte, že odkazy na obrázky fungují - Ověřte fungování odkazů na obrázky
4. **Revize obsahu**: 4. **Revize obsahu**:
- Zkontrolujte pravopis a gramatiku - Korektura pravopisu a gramatiky
- Ujistěte se, že příklady kódu jsou správné a vzdělávací - Ověřte, že ukázky kódu jsou správné a vzdělávací
- Ověřte, že překlady zachovávají původní význam - Zkontrolujte, že překlady zachovávají původní význam
### Požadavky na přispívání ### Požadavky na přispívání
- Souhlas s Microsoft CLA (automatická kontrola při prvním PR) - Souhlas s Microsoft CLA (automatická kontrola při prvním PR)
- Dodržování [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Dodržování [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Viz [CONTRIBUTING.md](./CONTRIBUTING.md) pro podrobné pokyny - Podrobné instrukce v [CONTRIBUTING.md](./CONTRIBUTING.md)
- Odkazujte čísla problémů v popisu PR, pokud je to relevantní - Uvádějte čísla issues v popisu PR, pokud je to relevantní
### Proces revize ### Proces revize
- PR jsou revidovány správci a komunitou - PR kontrolují maintainers a komunita
- Prioritou je vzdělávací přehlednost - Priorita jasnost vzdělávacího obsahu
- Příklady kódu by měly dodržovat aktuální nejlepší praktiky - Ukázky kódu by měly dodržovat současné nejlepší praktiky
- Překlady jsou revidovány z hlediska přesnosti a kulturní vhodnosti - Překlady jsou kontrolovány na přesnost a kulturní vhodnost
## Systém překladů ## Překladový systém
### Automatický překlad ### Automatizovaný překlad
- Používá GitHub Actions s workflow co-op-translator - Používá GitHub Actions s workflow co-op-translator
- Automaticky překládá do více než 50 jazyků - Automaticky překládá do více než 50 jazyků
- Zdrojové soubory v hlavních adresářích - Zdrojové soubory v hlavních adresářích
- Přeložené soubory ve struktuře `translations/{language-code}/` - Přeložené soubory v adresářích `translations/{language-code}/`
### Přidání manuálních vylepšení překladu ### Přidávání ručních vylepšení překladů
1. Najděte soubor ve `translations/{language-code}/` 1. Najděte soubor v `translations/{language-code}/`
2. Proveďte vylepšení při zachování struktury 2. Proveďte úpravy při zachování struktury
3. Ujistěte se, že příklady kódu zůstávají funkční 3. Ujistěte se, že ukázky kódu zůstávají funkční
4. Otestujte jakýkoli lokalizovaný obsah kvízů 4. Otestujte lokalizovaný obsah kvízů
### Metadata překladu ### Metadata překladu
Přeložené soubory obsahují záhlaví metadat: Přeložené soubory obsahují hlavičku metadat:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -291,116 +291,118 @@ CO_OP_TRANSLATOR_METADATA:
## Ladění a řešení problémů ## Ladění a řešení problémů
### Běžné problémy ### Časté problémy
**Aplikace Quiz se nespustí**: **Quiz aplikace nenaběhne**:
- Zkontrolujte verzi Node.js (doporučeno v14+) - Zkontrolujte verzi Node.js (doporučeno v14+)
- Smažte `node_modules` a `package-lock.json`, znovu spusťte `npm install` - Odstraňte `node_modules` a `package-lock.json`, spusťte `npm install` znovu
- Zkontrolujte konflikty portů (výchozí: Vite používá port 5173) - Zkontrolujte konflikty portů (výchozí: Vite používá port 5173)
**API server se nespustí**: **API server nenaběhne**:
- Ověřte, že verze Node.js splňuje minimum (node >=10) - Ověřte verzi Node.js (minimálně node >=10)
- Zkontrolujte, zda port již není používán - Zkontrolujte, zda port není obsazený
- Ujistěte se, že všechny závislosti jsou nainstalovány pomocí `npm install` - Ujistěte se, že jsou nainstalované všechny závislosti příkazem `npm install`
**Rozšíření prohlížeče se nenačte**: **Rozšíření prohlížeče se nenačítá**:
- Ověřte, že manifest.json je správně formátován - Ověřte správné formátování manifest.json
- Zkontrolujte chyby v konzoli prohlížeče - Kontrola chyb v konzoli prohlížeče
- Postupujte podle pokynů pro instalaci rozšíření specifických pro prohlížeč - Postupujte podle instrukcí specifických pro prohlížeč
**Problémy s projektem Python chatu**: **Problémy s Python chat projektem**:
- Ujistěte se, že je nainstalován balíček OpenAI: `pip install openai` - Ujistěte se, že je nainstalován balíček OpenAI: `pip install openai`
- Ověřte, že je nastavena proměnná prostředí GITHUB_TOKEN - Ověřte, že je nastavena proměnná prostředí GITHUB_TOKEN
- Zkontrolujte oprávnění přístupu k GitHub Models - Zkontrolujte oprávnění přístupu k GitHub modelům
**Docsify neobsluhuje dokumenty**: **Docsify neservíruje dokumentaci**:
- Nainstalujte docsify-cli globálně: `npm install -g docsify-cli` - Globálně nainstalujte docsify-cli: `npm install -g docsify-cli`
- Spusťte z kořenového adresáře úložiště - Spusťte v kořenovém adresáři repozitáře
- Zkontrolujte, že existuje `docs/_sidebar.md` - Ověřte, že existuje `docs/_sidebar.md`
### Tipy pro vývojové prostředí ### Tipy pro vývojové prostředí
- Používejte VS Code s rozšířením Live Server pro HTML projekty - Používejte VS Code s rozšířením Live Server pro HTML projekty
- Nainstalujte rozšíření ESLint a Prettier pro konzistentní formátování - Nainstalujte ESLint a Prettier rozšíření pro jednotné formátování
- Používejte DevTools prohlížeče pro ladění JavaScriptu - K debugu JavaScriptu používejte DevTools v prohlížeči
- Pro projekty Vue nainstalujte rozšíření Vue DevTools prohlížeče - Pro Vue projekty nainstalujte Vue DevTools rozšíření prohlížeče
### Úvahy o výkonu ### Výkonové aspekty
- Velký počet přeložených souborů (50+ jazyků) znamená, že úplné klony jsou velké - Velké množství přeložených souborů (50+ jazyků) znamená velké klony
- Použijte mělký klon, pokud pracujete pouze na obsahu: `git clone --depth 1` - Použijte shallow clone, pokud pracujete pouze s obsahem: `git clone --depth 1`
- Vyloučte překlady z vyhledávání při práci na obsahu v angličtině - Při práci s anglickým obsahem vylučujte překlady z vyhledávání
- Procesy sestavení mohou být při prvním spuštění pomalé (npm install, Vite build) - Procesy build mohou být při prvním spuštění pomalé (npm install, build Vite)
## Úvahy o bezpečnosti ## Bezpečnostní aspekty
### Proměnné prostředí ### Proměnné prostředí
- API klíče by nikdy neměly být přidány do úložiště - API klíče nikdy neukládejte do repozitáře
- Používejte `.env` soubory (již v `.gitignore`) - Používejte `.env` soubory (jsou uvedeny v `.gitignore`)
- Dokumentujte požadované proměnné prostředí v README projektů - Dokumentujte požadované proměnné prostředí v README projektů
### Python projekty ### Python projekty
- Používejte virtuální prostředí: `python -m venv venv` - Používejte virtuální prostředí: `python -m venv venv`
- Udržujte závislosti aktuální - Udržujte závislosti aktuální
- Tokeny GitHub by měly mít minimální požadovaná oprávnění - GitHub tokeny by měly mít minimální potřebná oprávnění
### Přístup k GitHub Models ### Přístup k GitHub modelům
- Vyžadovány osobní přístupové tokeny (PAT) pro GitHub Models - Vyžadovány personal access tokens (PAT)
- Tokeny by měly být uloženy jako proměnné prostředí - Tokeny ukládejte jako proměnné prostředí
- Nikdy nepřidávejte tokeny nebo přihlašovací údaje - Nikdy neukládejte tokeny ani přihlašovací údaje do repozitáře
## Další poznámky ## Další poznámky
### Cílová skupina ### Cílová skupina
- Úplní začátečníci ve webovém vývoji - Kompletní začátečníci ve webovém vývoji
- Studenti a samouci - Studenti a samouci
- Učitelé používající kurikulum ve třídách - Učitelé využívající kurikulum ve třídě
- Obsah je navržen pro přístupnost a postupné budování dovedností - Obsah navržen pro přístupnost a postupné budování dovedností
### Vzdělávací filozofie ### Vzdělávací filozofie
- Přístup založený na projektech - Projektově orientované učení
- Časté kontroly znalostí (kvízy) - Časté ověřování znalostí (kvízy)
- Praktická cvičení v kódování - Praktická cvičení v psaní kódu
- Příklady aplikací z reálného světa - Reálné příklady použití
- Důraz na základy před frameworky - Důraz na základy před frameworky
### Údržba úložiště ### Údržba repozitáře
- Aktivní komunita studentů a přispěvatelů - Aktivní komunita studentů a přispěvatelů
- Pravidelné aktualizace závislostí a obsahu - Pravidelné aktualizace závislostí a obsahu
- Problémy a diskuse monitorovány správci - Issues a diskuse sledovány maintainery
- Aktualizace překladů automatizované pomocí GitHub Actions - Aktualizace překladů automatizované přes GitHub Actions
### Související zdroje ### Související zdroje
- [Microsoft Learn moduly](https://docs.microsoft.com/learn/) - [Microsoft Learn moduly](https://docs.microsoft.com/learn/)
- [Student Hub zdroje](https://docs.microsoft.com/learn/student-hub/) - [Student Hub zdroje](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) doporučený pro studenty - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) doporučený pro studenty
- Další kurzy: Generativní AI, Data Science, ML, IoT kurikula k dispozici - Další kurzy: Generativní AI, Data Science, ML, IoT kurikula dostupná
### Práce s konkrétními projekty ### Práce s konkrétními projekty
Pro podrobné pokyny k jednotlivým projektům viz README soubory v: Pro podrobné instrukce k jednotlivým projektům viz README soubory v:
- `quiz-app/README.md` - aplikace kvízů Vue 3 - `quiz-app/README.md` - Vue 3 kvízová aplikace
- `7-bank-project/README.md` - bankovní aplikace s autentizací - `7-bank-project/README.md` - Bankovní aplikace s autentizací
- `5-browser-extension/README.md` - vývoj rozšíření pro prohlížeč - `5-browser-extension/README.md` - Vývoj rozšíření prohlížeče
- `6-space-game/README.md` - vývoj hry založené na Canvasu - `6-space-game/README.md` - Vývoj hry založené na Canvas
- `9-chat-project/README.md` - projekt AI chatovacího asistenta - `9-chat-project/README.md` - AI chat asistent projekt
### Struktura monorepo ### Struktura Monorepo
I když nejde o tradiční monorepo, toto úložiště obsahuje několik nezávislých projektů: Ačkoliv nejde o tradiční monorepo, tento repozitář obsahuje více nezávislých projektů:
- Každá lekce je samostatná - Každá lekce je samostatná
- Projekty nesdílejí závislosti - Projekty nesdílí závislosti
- Práce na jednotlivých projektech bez ovlivnění ostatních - Pracujte na jednotlivých projektech bez ovlivnění ostatních
- Naklonujte celé úložiště pro plný zážitek z kurikula - Naklonujte celý repozitář pro plný zážitek kurikula
--- ---
**Prohlášení**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
Tento dokument byl přeložen pomocí služby AI pro překlady [Co-op Translator](https://github.com/Azure/co-op-translator). I když se snažíme o přesnost, mějte prosím na paměti, že automatizované překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho rodném jazyce by měl být považován za autoritativní zdroj. Pro důležité informace se doporučuje profesionální lidský překlad. Neodpovídáme za žádná nedorozumění nebo nesprávné interpretace vyplývající z použití tohoto překladu. **Prohlášení o vyloučení odpovědnosti**:
Tento dokument byl přeložen pomocí služby automatického překladu [Co-op Translator](https://github.com/Azure/co-op-translator). I když usilujeme o přesnost, mějte prosím na paměti, že automatické překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho mateřském jazyce by měl být považován za autoritativní zdroj. U kritických informací se doporučuje využít profesionální lidský překlad. Nejsme odpovědní za jakákoli nedorozumění nebo nesprávné výklady vyplývající z použití tohoto překladu.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

193
translations/cs/README.md
Unescape View File

@ -2,7 +2,7 @@
[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) [![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) [![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) [![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) [![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)
[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
@ -10,173 +10,172 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Vývoj webu pro začátečníky - kurikulum # Webový vývoj pro začátečníky - Kurikulum
Naučte se základy vývoje webu s naším komplexním 12týdenním kurzem od Microsoft Cloud Advocates. Každá z 24 lekcí se ponoří do JavaScriptu, CSS a HTML prostřednictvím praktických projektů jako jsou terária, rozšíření prohlížeče a vesmírné hry. Zapojte se do kvízů, diskuzí a praktických úkolů. Zlepšete své dovednosti a optimalizujte uchování znalostí s naší efektivní pedagogikou založenou na projektech. Začněte svou programátorskou cestu ještě dnes! Naučte se základy webového vývoje v našem 12týdenním komplexním kurzu od Microsoft Cloud Advocates. Každá z 24 lekcí se věnuje JavaScriptu, CSS a HTML prostřednictvím praktických projektů jako jsou terária, rozšíření prohlížeče a vesmírné hry. Zapojte se do kvízů, diskuzí a praktických úkolů. Zlepšete své dovednosti a optimalizujte si uchování znalostí s naší efektivní projektově orientovanou výukou. Začněte svou cestu s kódováním ještě dnes!
Připojte se ke komunitě Azure AI Foundry na Discordu Přidejte se do komunity Azure AI Foundry na Discordu
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Postupujte podle těchto kroků, abyste začali využívat tyto zdroje: Postupujte podle těchto kroků, abyste mohli začít používat tyto zdroje:
1. **Forkujte repozitář**: Klikněte na [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Vytvořte forknutí repozitáře**: Klikněte na [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Naklonujte repozitář**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Naklonujte repozitář**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Připojte se k Azure AI Foundry Discordu a setkejte se s odborníky a dalšími vývojáři**](https://discord.com/invite/ByRwuEEgH4) 3. [**Připojte se k Azure AI Foundry Discordu a potkejte odborníky a ostatní vývojáře**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Podpora více jazyků ### 🌐 Podpora více jazyků
#### Podporováno přes GitHub Action (automatizované a vždy aktuální) #### Podporováno skrze GitHub Action (automatizované a vždy aktuální)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](./README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](./README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Raději klonovat lokálně?** > **Dáváte přednost lokálnímu klonování?**
> Tento repozitář obsahuje více než 50 jazykových překladů, což významně zvětšuje velikost stahování. Pro klonování bez překladů použijte sparse checkout: > Tento repozitář zahrnuje více než 50 překladů jazyků, což výrazně zvětšuje velikost stažených dat. Pro klonování bez překladů použijte sparse checkout:
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> Tímto získáte vše potřebné k dokončení kurzu s mnohem rychlejším stažením. > To vám poskytne vše potřebné ke zdárnému dokončení kurzu a výrazně rychlejší stažení.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Pokud chcete mít podporu dalších jazyků, seznam podporovaných je uveden [zde](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Pokud si přejete, aby byly podporovány další překladové jazyky, jsou uvedeny [zde](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Jste student?_ #### 🧑‍🎓 _Jste student?_
Navštivte [**Student Hub stránku**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde najdete zdroje pro začátečníky, studentské balíčky a dokonce způsoby, jak získat voucher na bezplatný certifikát. Tuto stránku si uložte do záložek a pravidelně kontrolujte, protože obsah se mění měsíčně. Navštivte [**Student Hub stránku**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde najdete začátečnické zdroje, studentské balíčky a dokonce způsoby, jak získat voucher na bezplatný certifikát. Tuto stránku si doporučujeme přidat do záložek a čas od času ji navštívit, protože obsah měníme měsíčně.
### 📣 Oznámení - Nové výzvy v režimu GitHub Copilot Agent k dokončení! ### 📣 Oznámení - Nové výzvy GitHub Copilot Agent mode k dokončení!
Přidána nová výzva, hledejte „GitHub Copilot Agent Challenge 🚀“ v většině kapitol. To je nová výzva, kterou můžete splnit pomocí GitHub Copilot a Agent režimu. Pokud jste režim Agent ještě nepoužili, umožňuje nejen generovat text, ale také vytvářet a upravovat soubory, spouštět příkazy a další. Nová výzva přidána, hledejte „GitHub Copilot Agent Challenge 🚀“ ve většině kapitol. Je to nová výzva, kterou můžete dokončit pomocí GitHub Copilota a režimu Agent. Pokud jste režim Agent předtím nepoužívali, dokáže nejen generovat text, ale také vytvářet a upravovat soubory, spouštět příkazy a další.
### 📣 Oznámení - _Nový projekt ke stavbě pomocí generativní AI_ ### 📣 Oznámení - _Nový projekt k postavení pomocí Generativní AI_
Právě přidán nový projekt AI asistenta, podívejte se [projekt](./9-chat-project/README.md) Nový projekt AI asistenta právě přidán, podívejte se na [projekt](./9-chat-project/README.md)
### 📣 Oznámení - _Nové kurikulum_ o generativní AI pro JavaScript bylo právě vydáno ### 📣 Oznámení - _Nové kurikulum_ o Generativní AI pro JavaScript právě vydáno
Nezmeškejte naše nové kurikulum generativní AI! Nezapomeňte na naše nové kurikulum Generativní AI!
Navštivte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začněte! Navštivte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začněte!
![Background](../../translated_images/cs/background.148a8d43afde5730.webp) ![Background](../../translated_images/cs/background.148a8d43afde5730.webp)
- Lekce pokrývají vše od základů po RAG. - Lekce pokrývají vše od základů po RAG.
- Interakce s historickými postavami pomocí GenAI a naší doprovodné aplikace. - Komunikujte s historickými postavami pomocí GenAI a naší doprovodné aplikace.
- Zábavný a poutavý příběh, budete cestovat časem! - Zábavný a poutavý příběh, při němž budete cestovat časem!
![character](../../translated_images/cs/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/cs/character.5c0dd8e067ffd693.webp)
Každá lekce zahrnuje úkol k dokončení, kontrolu znalostí a výzvu, která vás provede tématy jako:
Každá lekce obsahuje úkol k dokončení, kontrolu znalostí a výzvu, která vás provede tématy jako: - Promptování a prompt engineering
- Vytváření promptů a inženýrství promptů - Generování textových a obrazových aplikací
- Tvorba aplikací pro text a obrázky
- Vyhledávací aplikace - Vyhledávací aplikace
Navštivte [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) a začněte! Navštivte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začněte!
## 🌱 Začínáme ## 🌱 Začínáme
> **Učitelé**, máme [několik návrhů](for-teachers.md), jak používat toto kurikulum. Budeme rádi za vaši zpětnou vazbu [v našem diskuzním fóru](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Učitelé**, zahrnuli jsme [několik návrhů](for-teachers.md) jak toto kurikulum používat. Budeme rádi za vaši zpětnou vazbu [v našem diskuzním fóru](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Studenti](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pro každou lekci začněte přednáškovým kvízem a pokračujte čtením studijního materiálu, dokončením různých aktivit a ověřením svého porozumění kvízem po přednášce. **[Studující](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, u každé lekce začněte přednáškovým kvízem a pokračujte čtením materiálu přednášky, plněním různých aktivit a ověřte si pochopení pomocí kvízu po přednášce.
Pro zlepšení vašeho vzdělávacího zážitku se spojte s vrstevníky a pracujte na projektech společně! Diskuze jsou vítány v našem [diskuzním fóru](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde náš tým moderátorů bude k dispozici odpovědět na vaše dotazy. Pro lepší studijní zážitek se spojte se svými spolužáky a pracujte na projektech společně! Diskuze jsou vítané v našem [diskuzním fóru](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde je náš tým moderátorů připraven odpovědět na vaše dotazy.
Pro další vzdělávání důrazně doporučujeme prozkoumat [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) pro doplňující studijní materiály. Pro další vzdělávání důrazně doporučujeme prozkoumat [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) pro doplňující studijní materiály.
### 📋 Nastavení vašeho prostředí ### 📋 Nastavení vašeho prostředí
Toto kurikulum má připravené vývojové prostředí! Na začátku si můžete vybrat provoz kurikula v [Codespace](https://github.com/features/codespaces/) (_prohlížečové, bez nutnosti instalace_), nebo lokálně na svém počítači s textovým editorem jako je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Toto kurikulum má připravené vývojové prostředí! Jakmile začnete, můžete si vybrat spouštět kurikulum v [Codespace](https://github.com/features/codespaces/) (_prostředí v prohlížeči bez potřeby instalace_), nebo lokálně na vašem počítači pomocí textového editoru jako je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Vytvoření vašeho repozitáře #### Vytvořte si repozitář
Pro snadnější ukládání vaší práce se doporučuje vytvořit vlastní kopii tohoto repozitáře. To můžete udělat kliknutím na tlačítko **Use this template** v horní části stránky. Vytvoří se nový repozitář ve vašem GitHub účtu s kopií kurikula. Pro snadné ukládání své práce je doporučeno vytvořit si vlastní kopii tohoto repozitáře. To můžete udělat kliknutím na tlačítko **Use this template** v horní části stránky. Tím vznikne nový repozitář ve vašem GitHub účtu s kopií kurikula.
Postupujte takto: Postupujte takto:
1. **Forkujte repozitář**: Klikněte na tlačítko "Fork" v pravém horním rohu této stránky. 1. **Vytvořte fork repozitáře**: Klikněte na tlačítko „Fork“ v pravém horním rohu této stránky.
2. **Naklonujte repozitář**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Naklonujte repozitář**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Spuštění kurikula v Codespace #### Spuštění kurikula v Codespace
Ve vaší kopii repozitáře, kterou jste vytvořili, klikněte na tlačítko **Code** a vyberte **Open with Codespaces**. Vytvoří se nový Codespace, kde budete pracovat. Ve vaší kopii repozitáře, kterou jste vytvořili, klikněte na tlačítko **Code** a vyberte **Open with Codespaces**. Tím se pro vás vytvoří nový Codespace, ve kterém můžete pracovat.
![Codespace](../../translated_images/cs/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/cs/createcodespace.0238bbf4d7a8d955.webp)
#### Spuštění kurikula lokálně na vašem počítači #### Spuštění kurikula lokálně na vašem počítači
Pro spuštění kurikula lokálně budete potřebovat textový editor, prohlížeč a příkazový řádek. Naše první lekce, [Úvod do programovacích jazyků a nástrojů](../../1-getting-started-lessons/1-intro-to-programming-languages), vás provede různými možnostmi těchto nástrojů, abyste si mohli vybrat, co vám nejlépe vyhovuje. Pro spuštění kurikula lokálně budete potřebovat textový editor, prohlížeč a nástroj příkazového řádku. Naše první lekce, [Úvod do programovacích jazyků a nástrojů oboru](../../1-getting-started-lessons/1-intro-to-programming-languages), vás provede různými možnostmi těchto nástrojů, abyste si mohli vybrat, co vám nejlépe vyhovuje.
Doporučujeme použít [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) jako editor, který má také integrovaný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code si můžete stáhnout [zde](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Doporučujeme použít [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) jako editor, který má také vestavěný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code si můžete stáhnout [zde](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Naklonujte si váš repozitář do počítače. To můžete udělat kliknutím na tlačítko **Code** a zkopírováním URL: 1. Naklonujte svůj repozitář do počítače. Můžete to udělat kliknutím na tlačítko **Code** a zkopírováním adresy URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Pak otevřete [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ve [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) a spusťte následující příkaz, přičemž `<your-repository-url>` nahraďte URL, kterou jste právě zkopírovali: Poté otevřete [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ve [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) a spusťte následující příkaz, přičemž `<your-repository-url>` nahraďte URL, kterou jste právě zkopírovali:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Otevřete složku ve Visual Studio Code. Uděláte to kliknutím na **Soubor** > **Otevřít složku** a vyberete složku, kterou jste právě klonovali. 2. Otevřete složku ve Visual Studio Code. To můžete udělat kliknutím na **Soubor** > **Otevřít složku** a vybráním složky, kterou jste právě naklonovali.
> Doporučené rozšíření Visual Studio Code: > Doporučené rozšíření Visual Studio Code:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) – pro náhled HTML stránek přímo ve Visual Studio Code > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - pro náhled HTML stránek přímo ve Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) – aby vám pomohl psát kód rychleji > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - který vám pomůže psát kód rychleji
## 📂 Každá lekce obsahuje: ## 📂 Každá lekce zahrnuje:
- volitelný sketchnote - volitelnou náčrtovou poznámku
- volitelné doplňkové video - volitelné doplňkové video
- rozehřívací kvíz před lekcí - rozcvičkový kvíz před lekcí
- psanou lekci - písemnou lekci
- u lekcí založených na projektu podrobný návod, jak projekt postavit - u lekcí založených na projektu podrobné návody, jak projekt vytvořit
- kontroly znalostí - kontrolní znalostní otázky
- výzvu - výzvu
- doplňující čtení - doplňkové čtení
- úkol - zadání
- [kvíz po lekci](https://ff-quizzes.netlify.app/web/) - [kvíz po lekci](https://ff-quizzes.netlify.app/web/)
> **Poznámka ke kvízům**: Všechny kvízy jsou umístěné ve složce Quiz-app, celkem 48 kvízů, každý se třemi otázkami. Jsou dostupné [zde](https://ff-quizzes.netlify.app/web/), kvízovou aplikaci lze spustit lokálně nebo nasadit na Azure; postup najdete ve složce `quiz-app`. > **Poznámka ke kvízům**: Všechny kvízy jsou uloženy ve složce Quiz-app, celkem je 48 kvízů po třech otázkách. Jsou dostupné [zde](https://ff-quizzes.netlify.app/web/), kvízovou aplikaci lze spustit lokálně nebo nasadit na Azure; řiďte se pokyny ve složce `quiz-app`.
## 🗃️ Lekce ## 🗃️ Lekce
| | Název projektu | Probírané koncepty | Výukové cíle | Odkaz na lekci | Autor | | | Název projektu | Naučené koncepty | Výukové cíle | Odkaz na lekci | Autor |
| :-: | :--------------------------------------------------------: | :------------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------: | :--------------------: | | :-: | :--------------------------------------------------------: | :--------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Začínáme | Úvod do programování a nástroje profese | Naučit se základní principy většiny programovacích jazyků a software, který pomáhá profesionálním vývojářům v jejich práci | [Úvod do programovacích jazyků a nástrojů](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Začínáme | Úvod do programování a nástroje řemeslníka | Naučte se základy většiny programovacích jazyků a o softwaru, který pomáhá profesionálním vývojářům vykonávat jejich práci | [Úvod do programovacích jazyků a nástrojů](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Začínáme | Základy GitHubu, práce v týmu | Jak používat GitHub ve vašem projektu, jak spolupracovat s ostatními na kódu | [Úvod do GitHubu](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Začínáme | Základy GitHubu, včetně práce v týmu | Jak používat GitHub ve vašem projektu, jak spolupracovat s ostatními na kódu | [Úvod do GitHubu](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Začínáme | Přístupnost | Naučit se základy přístupnosti webu | [Základy přístupnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Začínáme | Přístupnost | Naučte se základy webové přístupnosti | [Základy přístupnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Základy JS | Datové typy v JavaScriptu | Základy datových typů v JavaScriptu | [Datové typy](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | Základy JS | Datové typy JavaScriptu | Základy datových typů v JavaScriptu | [Datové typy](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Základy JS | Funkce a metody | Naučit se o funkcích a metodách pro řízení toku logiky aplikace | [Funkce a metody](./2-js-basics/2-functions-methods/README.md) | Jasmine a Christopher | | 05 | Základy JS | Funkce a metody | Naučte se o funkcích a metodách pro správu logiky aplikace | [Funkce a metody](./2-js-basics/2-functions-methods/README.md) | Jasmine a Christopher |
| 06 | Základy JS | Rozhodování v JS | Naučit se vytvářet podmínky ve vašem kódu za pomoci rozhodovacích konstrukcí | [Rozhodování](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | Základy JS | Tvorba podmínek v JS | Naučte se vytvářet podmínky ve vašem kódu pomocí rozhodovacích metod | [Tvorba rozhodnutí](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Základy JS | Pole a smyčky | Práce s daty pomocí polí a smyček v JavaScriptu | [Pole a smyčky](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | Základy JS | Pole a smyčky | Pracujte s daty pomocí polí a smyček v JavaScriptu | [Pole a smyčky](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML v praxi | Postavit HTML pro vytvoření online terária se zaměřením na vytváření rozvržení | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML v praxi | Vytvořte HTML pro online terárium se zaměřením na vytvoření rozvržení | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS v praxi | Postavit CSS pro stylování online terária, se zaměřením na základy CSS včetně responzivního designu | [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS v praxi | Vytvořte CSS pro stylování online terária, se zaměřením na základy CSS včetně responzivního designu stránky | [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScriptové uzávěry, manipulace s DOM | Postavit JavaScript pro funkčnost terária jako rozhraní drag & drop, se zaměřením na uzávěry a manipulaci s DOM | [JavaScript uzávěry a manipulace s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScriptové uzávěry, manipulace s DOM | Vytvořte JavaScript pro funkčnost terária jako drag/drop rozhraní, zaměřeno na uzávěry a manipulaci s DOM | [JavaScript uzávěry a manipulace s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Hra na psaní](./4-typing-game/solution/README.md) | Stavba hry na psaní | Naučit se používat události klávesnice k řízení logiky vaší JavaScriptové aplikace | [Event-driven programování](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Hra psaní na klávesnici](./4-typing-game/solution/README.md) | Vytvoření hry psaní na klávesnici | Naučte se používat klávesové události k řízení logiky vaší JavaScriptové aplikace | [Programování událostmi](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Rozšíření pro prohlížeč Green](./5-browser-extension/solution/README.md) | Práce s prohlížeči | Naučit se, jak prohlížeče fungují, jejich historii a jak vytvořit kostru prvních prvků rozšíření pro prohlížeč | [O prohlížečích](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Zelené rozšíření prohlížeče](./5-browser-extension/solution/README.md) | Práce s prohlížeči | Naučte se, jak prohlížeče fungují, jejich historický vývoj a jak vytvořit první prvky rozšíření prohlížeče | [O prohlížečích](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Rozšíření pro prohlížeč Green](./5-browser-extension/solution/README.md) | Vytváření formuláře, volání API a ukládání proměnných v lokálním úložišti | Postavit JavaScriptové prvky rozšíření prohlížeče pro volání API s použitím proměnných uložených v lokálním úložišti | [API, formuláře a lokální úložiště](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Zelené rozšíření prohlížeče](./5-browser-extension/solution/README.md) | Vytváření formuláře, volání API a ukládání proměnných do místního úložiště | Vytvořte JavaScriptové prvky rozšíření prohlížeče, které volají API a používají proměnné uložené v místním úložišti | [API, formuláře a místní úložiště](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Rozšíření pro prohlížeč Green](./5-browser-extension/solution/README.md) | Pozadí procesů v prohlížeči, výkon webu | Využít pozadí prohlížeče k řízení ikony rozšíření; naučit se o výkonu webu a některých optimalizacích pro lepší běh | [Pozadí, úkoly a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Zelené rozšíření prohlížeče](./5-browser-extension/solution/README.md) | Pozadí procesy v prohlížeči, webový výkon | Použijte pozadí procesy pro zvládání ikony rozšíření, naučte se o webovém výkonu a optimalizacích | [Pozadí a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Pokročilejší vývoj her v JavaScriptu | Naučit se o dědičnosti pomocí tříd i kompozice a o vzoru Pub/Sub, jako příprava ke stavbě hry | [Úvod do pokročilého vývoje her](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Pokročilejší vývoj hry v JavaScriptu | Naučte se o dědičnosti pomocí tříd a kompozice, stejně jako o vzoru Pub/Sub, jako přípravu na tvorbu hry | [Úvod do pokročilého vývoje her](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Kreslení na plátno | Naučit se o Canvas API používaném pro kreslení prvků na obrazovku | [Kreslení na plátno](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Kreslení na plátno | Naučte se o Canvas API používaném pro kreslení prvků na obrazovku | [Kreslení na plátno](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Pohyb prvků po obrazovce | Objevit, jak prvky získávají pohyb pomocí kartézských souřadnic a Canvas API | [Pohyb prvků](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Pohyb prvků po obrazovce | Objevte, jak mohou prvky získat pohyb pomocí kartézských souřadnic a Canvas API | [Pohyb prvků](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Detekce kolizí | Nechat prvky kolidovat a reagovat na sebe pomocí stisků kláves a poskytnout cooldown funkci pro zajištění výkonu hry | [Detekce kolizí](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Detekce kolizí | Umožněte prvkům kolidovat a reagovat na sebe pomocí stisknutí kláves a přidejte cooldown funkci pro zajištění výkonu hry | [Detekce kolizí](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Udržování skóre | Provádět matematické výpočty podle stavu a výkonu hry | [Udržování skóre](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Udržování skóre | Provádějte matematické výpočty založené na stavu a výkonu hry | [Udržování skóre](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Ukončení a restartování hry | Naučit se o ukončení a restartu hry, včetně úklidu zdrojů a resetování hodnot proměnných | [Podmínka ukončení](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Hra ve vesmíru](./6-space-game/solution/README.md) | Ukončování a restartování hry | Naučte se o ukončení a restartování hry, včetně čištění zdrojů a resetování proměnných hodnot | [Podmínka ukončení](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Bankovní aplikace](./7-bank-project/solution/README.md) | HTML šablony a směrování ve webové aplikaci | Naučit se vytvářet kostru více stránkové webové architektury s využitím směrování a HTML šablon | [HTML šablony a směrování](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Bankovní aplikace](./7-bank-project/solution/README.md) | HTML šablony a směrování v webové aplikaci | Naučte se vytvořit strukturu více stránkové webové aplikace použitím směrování a HTML šablon | [HTML šablony a směrování](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Stavba přihlašovacího a registračního formuláře | Naučit se o tvorbě formulářů a ověřovacích rutinách | [Formuláře](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Vytvoření přihlašovacího a registračního formuláře | Naučte se vytvářet formuláře a zpracovávat validační rutiny | [Formuláře](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Metody získávání a používání dat | Jak data proudí dovnitř a ven z vaší aplikace, jak je načíst, uložit a zbavit se jich | [Data](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Metody získávání a použití dat | Jak data proudí do vaší aplikace a ven, jak je načítat, ukládat a likvidovat | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Koncepty správy stavu | Naučit se, jak vaše aplikace udržuje stav a jak ho programově spravovat | [Správa stavu](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Koncepty správy stavu | Naučte se, jak vaše aplikace uchovává stav a jak s ním programově pracovat | [Správa stavu](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Editor kódu v prohlížeči/VScode](../../8-code-editor) | Práce s VScode | Naučit se používat editor kódu | [Použití editoru VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Editor kódu pro prohlížeč/VScode](../../8-code-editor) | Práce s VScodem | Naučte se používat editor kódu | [Použití editoru VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI asistenti](./9-chat-project/README.md) | Práce s AI | Naučit se vybudovat vlastního asistenta umělé inteligence | [Projekt AI asistenta](./9-chat-project/README.md) | Chris | | 26 | [AI asistenti](./9-chat-project/README.md) | Práce s AI | Naučte se vytvořit vlastního AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogika ## 🏫 Pedagogika
@ -184,36 +183,36 @@ Náš učební plán je navržen se dvěma klíčovými pedagogickými principy:
* učení založené na projektech * učení založené na projektech
* časté kvízy * časté kvízy
Program vyučuje základy JavaScriptu, HTML a CSS, stejně jako nejnovější nástroje a techniky používané dnešními webovými vývojáři. Studenti budou mít možnost získat praktické zkušenosti tvorbou hry na psaní, virtuálního terária, ekologického rozšíření prohlížeče, hry ve stylu vesmírných vetřelců a bankovní aplikace pro firmy. Na konci série budou mít studenti pevné základy webového vývoje. Program učí základy JavaScriptu, HTML a CSS, stejně jako nejnovější nástroje a techniky používané dnešními webovými vývojáři. Studenti získají příležitost získat praktické zkušenosti tvorbou hry na psaní na klávesnici, virtuálního terária, ekologicky šetrného rozšíření prohlížeče, hry ve stylu vesmírných vetřelců a bankovní aplikace pro firmy. Po dokončení série budou studenti mít pevné základy webového vývoje.
> 🎓 První lekce tohoto kurzu můžete absolvovat jako [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn! > 🎓 První lekce tohoto učebního plánu můžete absolvovat také jako [Výukovou cestu](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
Zajištěním shody obsahu s projekty se proces pro studenty stává zajímavějším a zlepšuje se zapamatování konceptů. Také jsme napsali několik úvodních lekcí na základy JavaScriptu, abychom představili koncepty, doplněné videem z kolekce tutoriálů „[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)“, jejichž někteří autoři přispěli do tohoto kurikula. Zajištěním, že obsah odpovídá projektům, se proces pro studenty stává zajímavějším a dochází k lepšímu zapamatování konceptů. Napsali jsme také několik úvodních lekcí základů JavaScriptu, které představují koncepty, doplněné videem ze série "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", jejíchž autoři se na plánu podíleli.
Navíc nízkorizikový kvíz před vyučováním nastavuje záměr studenta učit se dané téma, zatímco druhý kvíz po výuce zajišťuje další upevnění znalostí. Tento učební plán byl navržen jako flexibilní a zábavný a lze jej absolvovat celý nebo částečně. Projekty začínají malé a postupně se během 12 týdnů stávají složitějšími. Navíc nízkorizikový kvíz před hodinou nastaví studentovi záměr naučit se téma, zatímco druhý kvíz po hodině zajistí další upevnění znalostí. Tento učební plán je navržen tak, aby byl flexibilní a zábavný, lze jej absolvovat celý nebo částečně. Projekty začínají jednoduché a ke konci 12týdenního cyklu se postupně stávají složitějšími.
I když jsme záměrně vynechali zavádění JavaScriptových frameworků, abychom se soustředili na základní dovednosti potřebné jako webový vývojář před přechodem na framework, dalším dobrým krokem po dokončení tohoto kurzu je naučit se Node.js prostřednictvím další kolekce videí: „[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)“. Ačkoliv jsme záměrně vynechali zavádění JavaScriptových frameworků, abychom se zaměřili na základní dovednosti webového vývojáře před adopcí frameworku, vhodným dalším krokem po absolvování tohoto kurzu je naučit se Node.js prostřednictvím další kolekce videí: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Navštivte naše pokyny [Kodex chování](CODE_OF_CONDUCT.md) a [Přispívání](CONTRIBUTING.md). Těšíme se na vaši konstruktivní zpětnou vazbu! > Navštivte naše [chování](CODE_OF_CONDUCT.md) a [příspěvky](CONTRIBUTING.md) pravidla. Vítáme vaše konstruktivní návrhy!
## 🧭 Offline přístup ## 🧭 Offline přístup
Tuto dokumentaci můžete používat offline pomocí [Docsify](https://docsify.js.org/#/). Forkujte tento repozitář, [nainstalujte Docsify](https://docsify.js.org/#/quickstart) na vašem počítači a pak v kořenové složce tohoto repozitáře zadejte `docsify serve`. Web bude naservírován na portu 3000 na vašem localhostu: `localhost:3000`. Tuto dokumentaci můžete spustit offline pomocí [Docsify](https://docsify.js.org/#/). Vytvořte fork tohoto repozitáře, [nainstalujte Docsify](https://docsify.js.org/#/quickstart) na svém počítači a poté ve výchozím adresáři repozitáře spusťte příkaz `docsify serve`. Webová stránka poběží na portu 3000 na vašem localhostu: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF všech lekcí lze najít [zde](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). PDF se všemi lekcemi naleznete [zde](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Další kurzy ## 🎒 Další kurzy
Náš tým vytváří i další kurzy! Podívejte se na: Náš tým vytváří i další kurzy! Podívejte se:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![LangChain4j pro začátečníky](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j pro začátečníky](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js pro začátečníky](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js pro začátečníky](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain pro začátečníky](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Agenti ### Azure / Edge / MCP / Agenti
@ -232,30 +231,30 @@ Náš tým vytváří i další kurzy! Podívejte se na:
--- ---
### Základní vzdělávání ### Základní učení
[![ML pro začátečníky](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Strojové učení pro začátečníky](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Data Science pro začátečníky](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science pro začátečníky](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI pro začátečníky](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI pro začátečníky](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Kyberbezpečnost pro začátečníky](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Kybernetická bezpečnost pro začátečníky](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Webový vývoj pro začátečníky](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Webový vývoj pro začátečníky](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT pro začátečníky](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT pro začátečníky](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![Vývoj XR pro začátečníky](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR Vývoj pro začátečníky](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Série Copilot ### Série Copilot
[![Copilot pro AI párové programování](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot pro AI párové programování](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot pro C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot pro C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot dobrodružství](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Získání pomoci ## Získání pomoci
Pokud se zaseknete nebo máte jakékoli dotazy týkající se tvorby AI aplikací, připojte se ke komunitě spolužáků a zkušených vývojářů na diskuse o MCP. Je to podporující komunita, kde jsou otázky vítány a znalosti se volně sdílejí. Pokud se zaseknete nebo máte jakékoli otázky ohledně vývoje AI aplikací, připojte se k ostatním učenlivým a zkušeným vývojářům v diskuzích o MCP. Je to podpůrná komunita, kde jsou otázky vítány a znalosti se sdílejí svobodně.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Pokud máte zpětnou vazbu k produktu nebo se při tvorbě setkáte s chybami, navštivte: Pokud máte zpětnou vazbu k produktu nebo chcete hlásit chyby při tvorbě, navštivte:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
@ -266,6 +265,6 @@ Tento repozitář je licencován pod licencí MIT. Více informací naleznete v
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Prohlášení o vyloučení odpovědnosti**: **Prohlášení o vyloučení odpovědnosti**:
Tento dokument byl přeložen pomocí služby automatického překladu AI [Co-op Translator](https://github.com/Azure/co-op-translator). Přestože usilujeme o přesnost, mějte prosím na paměti, že automatizované překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho mateřském jazyce by měl být považován za závazný zdroj. Pro kritické informace se doporučuje využít profesionálního lidského překladu. Nejsme odpovědni za jakékoliv nedorozumění nebo chybné výklady vyplývající z použití tohoto překladu. Tento dokument byl přeložen pomocí AI překladatelské služby [Co-op Translator](https://github.com/Azure/co-op-translator). Přestože se snažíme o přesnost, mějte prosím na paměti, že automatizované překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho mateřském jazyce by měl být považován za autoritativní zdroj. Pro zásadní informace je doporučován profesionální lidský překlad. Nejsme odpovědní za jakékoli nedorozumění nebo nesprávné výklady vzniklé použitím tohoto překladu.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

53
translations/cs/Roadmap.md
Unescape View File

@ -0,0 +1,53 @@
# Plán cesty repozitáře Microsoft Web-Dev-For-Beginners
**Tento repozitář poskytuje plán cesty pro učení základů webového vývoje se zaměřením na JavaScript, HTML a CSS. Kurz je flexibilní a může být absolvován celý nebo částečně, obsahuje 24 lekcí rozložených do 12 týdnů.**
## Klíčové milníky
* **Týdny 1-3:**
* Úvod do programovacích jazyků a nástrojů řemesla
* Základy GitHubu
* Přístupnost
* Základy JS: datové typy, funkce a metody
* Rozhodování s JS
* **Týdny 4-6:**
* Pole a cykly
* Terárium: HTML v praxi
* CSS v praxi
* Uzávěry v JavaScriptu
* Manipulace s DOM
* **Týdny 7-9:**
* Hra psaní: Událostmi řízené programování
* Zelené rozšíření prohlížeče: Práce s prohlížeči
* Vytvoření formuláře, volání API a ukládání proměnných do lokálního úložiště
* Pozadí běžících procesů v prohlížeči
* Výkon webu
* **Týdny 10-12:**
* Hra ve vesmíru: Pokročilejší vývoj hry v JavaScriptu
* Kreslení na plátno
* Pohyb prvků po obrazovce
* Detekce kolizí
* Zaznamenávání skóre, ukončení a restartování hry
* Bankovní aplikace: HTML šablony a trasy ve webové aplikaci
* Vytvoření přihlašovacího a registračního formuláře
* Metody získávání a používání dat
* Koncepty správy stavu
## Výsledky učení
**Absolvováním tohoto plánu získají studenti praktické zkušenosti s tvorbou hry na psaní, virtuálního terária, ekologického rozšíření prohlížeče, hry ve stylu Space Invaders a bankovní aplikace pro podniky. Také si vybudují pevné základy ve webovém vývoji.**
## Další zdroje
* Tento repozitář poskytuje množství zdrojů pro další učení, včetně tutoriálů, příkladů kódu a výzev.
* Platforma Microsoft Learn nabízí různé kurzy a vzdělávací cesty zaměřené na webový vývoj.
* Online komunity jako Stack Overflow a MDN Web Docs poskytují cennou podporu a zdroje pro webové vývojáře.
**Doufám, že vám tento plán cesty pomůže na vaší cestě webovým vývojem!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Prohlášení o vyloučení odpovědnosti**:
Tento dokument byl přeložen pomocí AI překladatelské služby [Co-op Translator](https://github.com/Azure/co-op-translator). I když usilujeme o přesnost, mějte prosím na paměti, že automatické překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho rodném jazyce by měl být považován za autoritativní zdroj. Pro kritické informace se doporučuje profesionální lidský překlad. Nejsme odpovědní za jakékoli nedorozumění nebo mylné výklady vzniklé z použití tohoto překladu.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

12
translations/hu/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2025-10-03T11:37:01+00:00", "translation_date": "2026-02-06T18:17:22+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "hu" "language_code": "hu"
}, },
@ -516,11 +516,17 @@
"language_code": "hu" "language_code": "hu"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T18:58:51+00:00", "translation_date": "2026-02-06T18:09:19+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "hu" "language_code": "hu"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T18:15:35+00:00",
"source_file": "Roadmap.md",
"language_code": "hu"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2025-08-28T03:21:44+00:00", "translation_date": "2025-08-28T03:21:44+00:00",

421
translations/hu/AGENTS.md
Unescape View File

@ -1,282 +1,282 @@
# AGENTS.md # AGENTS.md
## Projekt Áttekintés ## Projekt áttekintése
Ez egy oktatási tananyag-repozitórium, amely a webfejlesztés alapjainak tanítására készült kezdők számára. A tananyag egy átfogó, 12 hetes kurzus, amelyet a Microsoft Cloud Advocates fejlesztett ki, és 24 gyakorlati leckét tartalmaz JavaScript, CSS és HTML témakörökben. Ez egy oktatási tanterv adattára, amely kezdőknek tanítja a webfejlesztés alapjait. A tanterv egy átfogó, 12 hetes kurzus, amelyet a Microsoft Cloud Advocates fejlesztett ki, 24 gyakorlati leckével, amelyek lefedik a JavaScript, CSS és HTML témaköröket.
### Főbb Elemei ### Főbb összetevők
- **Oktatási Tartalom**: 24 strukturált lecke, projektalapú modulokba szervezve - **Oktatási tartalom**: 24 strukturált lecke projekt alapú modulokba rendezve
- **Gyakorlati Projektek**: Terrárium, Gépelési Játék, Böngészőbővítmény, Űrjáték, Banki Alkalmazás, Kódszerkesztő és AI Chat Asszisztens - **Gyakorlati projektek**: Terrárium, gépelős játék, böngészőbővítmény, űrjáték, banki alkalmazás, kódszerkesztő és AI chat asszisztens
- **Interaktív Kvízek**: 48 kvíz, mindegyik 3 kérdéssel (lecke előtti/utáni értékelések) - **Interaktív kvízek**: 48 kvíz 3 kérdéssel mindegyikben (óra előtti/utáni felmérések)
- **Többnyelvű Támogatás**: Automatikus fordítások 50+ nyelvre GitHub Actions segítségével - **Többnyelvű támogatás**: automatikus fordítások több mint 50 nyelvre GitHub Actions segítségével
- **Technológiák**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI projektekhez) - **Technológiák**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI projektekhez)
### Architektúra ### Architektúra
- Oktatási repozitórium leckealapú struktúrával - Oktatási adattár lecke-alapú szerkezettel
- Minden lecke mappa tartalmaz README-t, kódpéldákat és megoldásokat - Minden lecke könyvtára tartalmaz README-t, kódpéldákat és megoldásokat
- Önálló projektek külön könyvtárakban (quiz-app, különböző leckeprojektek) - Önálló projektek külön könyvtárakban (quiz-app, egyes lecke projektek)
- Fordítási rendszer GitHub Actions segítségével (co-op-translator) - Fordítási rendszer GitHub Actions használatával (co-op-translator)
- Dokumentáció Docsify segítségével elérhető, valamint PDF formátumban - Dokumentáció Docsify-val szolgáltatva, PDF-ként is elérhető
## Telepítési Parancsok ## Telepítési parancsok
Ez a repozitórium elsősorban oktatási tartalom fogyasztására készült. Az egyes projektek használatához: Ez az adattár elsősorban oktatási tartalom fogyasztására szolgál. Egyes projektekhez való munkához:
### Fő Repozitórium Telepítése ### Fő adattár beállítása
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Kvíz Alkalmazás Telepítése (Vue 3 + Vite) ### Quiz App beállítása (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Start development server npm run dev # Fejlesztői szerver indítása
npm run build # Build for production npm run build # Build létrehozása éles környezethez
npm run lint # Run ESLint npm run lint # ESLint futtatása
``` ```
### Bank Projekt API (Node.js + Express) ### Bank projekt API (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Start API server npm start # Indítsd el az API szervert
npm run lint # Run ESLint npm run lint # Futtasd az ESLintet
npm run format # Format with Prettier npm run format # Formázd Prettier-rel
``` ```
### Böngészőbővítmény Projektek ### Böngészőbővítmény projektek
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Follow browser-specific extension loading instructions # Kövesd a böngészőspecifikus bővítmény betöltési utasításait
``` ```
### Űrjáték Projektek ### Űrjáték projektek
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# Open index.html in browser or use Live Server # Nyisd meg az index.html fájlt a böngészőben, vagy használd a Live Server-t
``` ```
### Chat Projekt (Python Backend) ### Chat projekt (Python backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Set GITHUB_TOKEN environment variable # Állítsa be a GITHUB_TOKEN környezeti változót
python api.py python api.py
``` ```
## Fejlesztési Munkafolyamat ## Fejlesztési munkafolyamat
### Tartalomhozzájárulók Számára ### Tartalomközreműködőknek
1. **Forkold a repozitóriumot** GitHub fiókodba 1. **Forkold az adattárat** a GitHub fiókodba
2. **Klónozd a forkot** helyben 2. **Klónozd a forkot** helyileg
3. **Hozz létre egy új ágat** a módosításokhoz 3. **Hozz létre egy új ágat** a változtatásaidhoz
4. Végezzen módosításokat a lecke tartalmában vagy kódpéldákban 4. Módosítsd a lecke tartalmát vagy kód példákat
5. Teszteld a kódváltoztatásokat a releváns projektkönyvtárakban 5. Teszteld a kódváltoztatásokat a releváns projekt könyvtárakban
6. Nyújts be pull requesteket a hozzájárulási irányelvek szerint 6. Küldd be a pull requesteket a hozzájárulási irányelvek szerint
### Tanulók Számára ### Tanulóknak
1. Forkold vagy klónozd a repozitóriumot 1. Forkold vagy klónozd az adattárat
2. Haladj sorban a lecke könyvtárakban 2. Haladj sorban a lecke könyvtárakba
3. Olvasd el az egyes leckék README fájljait 3. Olvasd el a README fájlokat minden leckéhez
4. Töltsd ki a lecke előtti kvízeket a https://ff-quizzes.netlify.app/web/ oldalon 4. Töltsd ki az előtti kvízeket a https://ff-quizzes.netlify.app/web/ oldalon
5. Dolgozd át a kódpéldákat a lecke mappákban 5. Dolgozz át a lecke könyvtárak kód példáin
6. Teljesítsd a feladatokat és kihívásokat 6. Végezd el a feladatokat és kihívásokat
7. Töltsd ki a lecke utáni kvízeket 7. Töltsd ki a tanóra utáni kvízeket
### Élő Fejlesztés ### Élő fejlesztés
- **Dokumentáció**: Futtasd a `docsify serve` parancsot a gyökérkönyvtárban (port 3000) - **Dokumentáció**: Futtasd a `docsify serve` parancsot a gyökérkönyvtárban (port 3000)
- **Kvíz Alkalmazás**: Futtasd a `npm run dev` parancsot a quiz-app könyvtárban - **Quiz App**: Futtasd az `npm run dev` parancsot a quiz-app könyvtárban
- **Projektek**: Használd a VS Code Live Server bővítményt HTML projektekhez - **Projektek**: Használd a VS Code Live Server bővítményt HTML projektekhez
- **API Projektek**: Futtasd a `npm start` parancsot a megfelelő API könyvtárakban - **API projektek**: Futtasd az `npm start` parancsot a megfelelő API könyvtárakban
## Tesztelési Útmutató ## Tesztelési utasítások
### Kvíz Alkalmazás Tesztelése ### Quiz App tesztelés
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Check for code style issues npm run lint # Ellenőrizze a kód stílusának problémáit
npm run build # Verify build succeeds npm run build # Ellenőrizze, hogy a build sikeres-e
``` ```
### Bank API Tesztelése ### Bank API tesztelés
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Check for code style issues npm run lint # Ellenőrizze a kódstílus problémákat
node server.js # Verify server starts without errors node server.js # Ellenőrizze, hogy a szerver hiba nélkül indul-e
``` ```
### Általános Tesztelési Megközelítés ### Általános tesztelési megközelítés
- Ez egy oktatási repozitórium, amely nem tartalmaz átfogó automatizált teszteket - Ez egy oktatási adattár, nem tartalmaz átfogó automatizált teszteket
- Kézi tesztelésre összpontosít: - Kézi tesztelés fókuszpontjai:
- A kódpéldák hibamentesen futnak - Kód példák hibamentes futtatása
- A dokumentációban található linkek helyesen működnek - Dokumentációban lévő linkek helyes működése
- A projektépítések sikeresen befejeződnek - Projektek sikeres buildelése
- A példák követik a legjobb gyakorlatokat - Példák követik a bevált gyakorlatokat
### Benyújtás Előtti Ellenőrzések ### Beküldés előtti ellenőrzések
- Futtasd a `npm run lint` parancsot a package.json fájlt tartalmazó könyvtárakban - Futtasd az `npm run lint` parancsot a package.json fájlt tartalmazó könyvtárakban
- Ellenőrizd a markdown linkek érvényességét - Ellenőrizd a markdown linkek érvényességét
- Teszteld a kódpéldákat böngészőben vagy Node.js-ben - Teszteld a kód példákat böngészőben vagy Node.js-ben
- Győződj meg arról, hogy a fordítások megfelelő struktúrát tartanak fenn - Ellenőrizd, hogy a fordítások megőrzik a megfelelő szerkezetet
## Kódstílus Irányelvek ## Kódstílus irányelvek
### JavaScript ### JavaScript
- Használj modern ES6+ szintaxist - Használj modern ES6+ szintaxist
- Kövesd a projektekben megadott standard ESLint konfigurációkat - Kövesd a projektben található standard ESLint konfigurációkat
- Használj érthető változó- és függvényneveket az oktatási cél érdekében - Használj érthető változó- és függvényneveket az oktatási átláthatóság érdekében
- Adj hozzá kommenteket, amelyek magyarázzák a fogalmakat a tanulók számára - Adj kommenteket a fogalmak magyarázatára a tanulók számára
- Formázd a kódot Prettier segítségével, ahol konfigurálva van - Használj Prettier-t, ahol konfigurálva van
### HTML/CSS ### HTML/CSS
- Szemantikus HTML5 elemek - Szemantikus HTML5 elemek használata
- Reszponzív tervezési elvek - Reszponzív tervezési alapelvek alkalmazása
- Egyértelmű osztályelnevezési konvenciók - Egyértelmű osztálynév konvenciók
- Kommentek, amelyek magyarázzák a CSS technikákat a tanulók számára - Kommentek a CSS technikák magyarázatára tanulóknak
### Python ### Python
- PEP 8 stílusirányelvek - PEP 8 stílusirányelvek követése
- Érthető, oktatási célú kódpéldák - Világos, oktatási célú kód példák
- Típusjelölések, ahol hasznosak a tanulás szempontjából - Típusannotációk, ahol hasznos a tanulásban
### Markdown Dokumentáció ### Markdown dokumentáció
- Egyértelmű címsor hierarchia - Tiszta fejezet hierarchia
- Kódblokkok nyelvi specifikációval - Kódblokkok nyelvi megjelöléssel
- Linkek további forrásokhoz - Hivatkozások további forrásokra
- Képernyőképek és képek az `images/` könyvtárakban - Képernyőfotók és képek az `images/` könyvtárakban
- Alt szöveg a képekhez az akadálymentesség érdekében - Képekhez alt szöveg az akadálymentesség érdekében
### Fájlok Szervezése ### Fájl szervezés
- A leckék számozása sorrendben (1-getting-started-lessons, 2-js-basics, stb.) - A leckék számozása folytonos (1-getting-started-lessons, 2-js-basics stb.)
- Minden projektnek van `solution/` és gyakran `start/` vagy `your-work/` könyvtára - Minden projektnek van `solution/` és gyakran `start/` vagy `your-work/` könyvtára
- Képek a lecke-specifikus `images/` mappákban tárolva - Képek a leckékhez tartozó `images/` mappákban tárolva
- Fordítások a `translations/{language-code}/` struktúrában - Fordítások a `translations/{nyelvkód}/` struktúrában
## Építés és Telepítés ## Build és telepítés
### Kvíz Alkalmazás Telepítése (Azure Static Web Apps) ### Quiz App telepítés (Azure Static Web Apps)
A quiz-app az Azure Static Web Apps telepítésére van konfigurálva: A quiz-app konfigurálva van Azure Static Web Apps telepítéshez:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Creates dist/ folder npm run build # Létrehozza a dist/ mappát
# Deploys via GitHub Actions workflow on push to main # GitHub Actions munkafolyamat segítségével telepít a main ágra történő push esetén
``` ```
Azure Static Web Apps konfiguráció: Azure Static Web Apps konfiguráció:
- **App helye**: `/quiz-app` - **App elérési út**: `/quiz-app`
- **Kimeneti hely**: `dist` - **Kimeneti könyvtár**: `dist`
- **Munkafolyamat**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Munkafolyamat**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Dokumentáció PDF Generálása ### Dokumentáció PDF generálás
```bash ```bash
npm install # Install docsify-to-pdf npm install # Telepítse a docsify-to-pdf-t
npm run convert # Generate PDF from docs npm run convert # PDF generálása a docs-ból
``` ```
### Docsify Dokumentáció ### Docsify dokumentáció
```bash ```bash
npm install -g docsify-cli # Install Docsify globally npm install -g docsify-cli # Telepítse a Docsify-t globálisan
docsify serve # Serve on localhost:3000 docsify serve # Szolgáltatás localhost:3000 címen
``` ```
### Projekt-specifikus Építések ### Projekt-specifikus build
Minden projektkönyvtárnak lehet saját építési folyamata: Minden projekt könyvtárnak lehet saját build folyamata:
- Vue projektek: `npm run build` létrehozza a produkciós csomagokat - Vue projektek: `npm run build` létrehozza a produkciós csomagokat
- Statikus projektek: Nincs építési lépés, közvetlenül szolgáltasd a fájlokat - Statikus projektek: nincs build lépés, a fájlokat közvetlenül szolgálja ki
## Pull Request Irányelvek ## Pull request irányelvek
### Címformátum ### Cím formátum
Használj egyértelmű, leíró címeket, amelyek jelzik a változtatás területét: Használj egyértelmű, leíró címeket, amelyek jelzik a változtatás területét:
- `[Quiz-app] Új kvíz hozzáadása az X leckéhez` - `[Quiz-app] Új kvíz hozzáadása a X. leckéhez`
- `[Lesson-3] Tippelési hiba javítása a terrárium projektben` - `[Lesson-3] Elírás javítása a terrárium projektnél`
- `[Translation] Spanyol fordítás hozzáadása az 5. leckéhez` - `[Translation] Spanyol fordítás hozzáadása az 5. leckéhez`
- `[Docs] Telepítési útmutató frissítése` - `[Docs] Telepítési utasítások frissítése`
### Szükséges Ellenőrzések ### Szükséges ellenőrzések
Pull request benyújtása előtt: PR beküldése előtt:
1. **Kódminőség**: 1. **Kódminőség**:
- Futtasd a `npm run lint` parancsot az érintett projektkönyvtárakban - Futtasd az `npm run lint` parancsot az érintett projekt könyvtárakban
- Javítsd ki az összes linting hibát és figyelmeztetést - Javítsd az összes lint hibát és figyelmeztetést
2. **Építés Ellenőrzése**: 2. **Build ellenőrzés**:
- Futtasd a `npm run build` parancsot, ha alkalmazható - Futtasd az `npm run build` parancsot, ha van
- Győződj meg arról, hogy nincs építési hiba - Győződj meg róla, hogy nincs build hiba
3. **Link Ellenőrzés**: 3. **Linkek ellenőrzése**:
- Teszteld az összes markdown linket - Teszteld az összes markdown linket
- Ellenőrizd, hogy a képhivatkozások működnek - Ellenőrizd a képek működését
4. **Tartalom Ellenőrzés**: 4. **Tartalom ellenőrzése**:
- Ellenőrizd a helyesírást és nyelvtant - Ellenőrizd helyesírást és nyelvtant
- Győződj meg arról, hogy a kódpéldák helyesek és oktatási célúak - Győződj meg róla, hogy a kód példák helyesek és oktató jellegűek
- Ellenőrizd, hogy a fordítások megőrzik az eredeti jelentést - Ellenőrizd, hogy a fordítások megőrzik az eredeti jelentést
### Hozzájárulási Követelmények ### Hozzájárulási feltételek
- Fogadd el a Microsoft CLA-t (automatikus ellenőrzés az első PR-nél) - Fogadd el a Microsoft CLA-t (automatikus ellenőrzés az első PR-nél)
- Kövesd a [Microsoft Nyílt Forráskódú Magatartási Kódexet](https://opensource.microsoft.com/codeofconduct/) - Kövesd a [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) szabályzatot
- Lásd a [CONTRIBUTING.md](./CONTRIBUTING.md) fájlt részletes irányelvekért - Lásd a [CONTRIBUTING.md](./CONTRIBUTING.md) fájlt részletes útmutatásért
- Hivatkozz az issue számokra a PR leírásában, ha alkalmazható - Hivatkozz hibaszámokra a PR leírásban, ha releváns
### Felülvizsgálati Folyamat ### Felülvizsgálati folyamat
- A PR-eket a karbantartók és a közösség felülvizsgálja - A PR-eket karbantartók és a közösség felülvizsgálja
- Az oktatási érthetőség prioritást élvez - Előnyben részesül az oktatási tisztaság
- A kódpéldáknak követniük kell a jelenlegi legjobb gyakorlatokat - A kód példák kövessék a legjobb gyakorlatokat
- A fordításokat pontosság és kulturális megfelelőség szempontjából vizsgálják - A fordításokat pontosság és kulturális megfelelőség alapján értékelik
## Fordítási Rendszer ## Fordítási rendszer
### Automatikus Fordítás ### Automatikus fordítás
- GitHub Actions és co-op-translator munkafolyamatot használ - GitHub Actions használata a co-op-translator munkafolyamattal
- Automatikusan fordít 50+ nyelvre - Több mint 50 nyelvre fordít automatikusan
- Forrásfájlok a fő könyvtárakban - Forrásfájlok a főkönyvtárban
- Fordított fájlok a `translations/{language-code}/` könyvtárakban - Fordított fájlok a `translations/{nyelvkód}/` könyvtárakban
### Manuális Fordítási Javítások Hozzáadása ### Manuális fordítási fejlesztések hozzáadása
1. Keresd meg a fájlt a `translations/{language-code}/` könyvtárban 1. Keresd meg a fájlt a `translations/{nyelvkód}/` könyvtárban
2. Végezzen javításokat, miközben megőrzi a struktúrát 2. Végezz javításokat úgy, hogy megőrzöd a szerkezetet
3. Győződj meg arról, hogy a kódpéldák továbbra is működnek 3. Biztosítsd, hogy a kódpéldák működőképesek maradjanak
4. Teszteld a lokalizált kvíztartalmat 4. Teszteld a lokalizált kvíz tartalmat
### Fordítási Metaadatok ### Fordítási metaadatok
A fordított fájlok metaadat fejlécet tartalmaznak: A fordított fájlok tartalmaznak egy metaadat fejlécet:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -289,117 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Hibakeresés és Hibaelhárítás ## Hibakeresés és problémamegoldás
### Gyakori Problémák ### Gyakori problémák
**A kvíz alkalmazás nem indul el**: **A quiz app nem indul el**:
- Ellenőrizd a Node.js verziót (ajánlott: v14+) - Ellenőrizd a Node.js verziót (ajánlott v14+)
- Töröld a `node_modules` és `package-lock.json` fájlokat, majd futtasd újra az `npm install` parancsot - Töröld a `node_modules` és `package-lock.json` fájlokat, majd futtasd az `npm install`-t újra
- Ellenőrizd a portütközéseket (alapértelmezett: Vite 5173-as portot használ) - Ellenőrizd a portütközéseket (alapértelmezett: Vite a 5173-as portot használja)
**Az API szerver nem indul el**: **Az API szerver nem indul**:
- Győződj meg arról, hogy a Node.js verzió megfelel a minimum követelményeknek (node >=10) - Győződj meg, hogy a Node.js verzió eléri a minimumot (node >=10)
- Ellenőrizd, hogy a port már használatban van-e - Ellenőrizd, hogy a port nem foglalt
- Győződj meg arról, hogy minden függőség telepítve van az `npm install` parancs segítségével - Biztosítsd, hogy minden függőség telepítve van az `npm install`-lal
**A böngészőbővítmény nem töltődik be**: **A böngészőbővítmény nem töltődik be**:
- Ellenőrizd, hogy a manifest.json megfelelően van-e formázva - Ellenőrizd, hogy a manifest.json helyesen van formázva
- Ellenőrizd a böngésző konzolt hibákért - Nézd meg a böngésző konzolját hibák után
- Kövesd a böngésző-specifikus bővítmény telepítési útmutatókat - Kövesd a böngésző specifikus bővítmény telepítési utasításokat
**Python chat projekt problémák**: **Python chat projekt problémái**:
- Győződj meg arról, hogy az OpenAI csomag telepítve van: `pip install openai` - Győződj meg, hogy az OpenAI csomag telepítve van: `pip install openai`
- Ellenőrizd, hogy a GITHUB_TOKEN környezeti változó be van állítva - Ellenőrizd, hogy be van állítva a GITHUB_TOKEN környezeti változó
- Ellenőrizd a GitHub Models hozzáférési engedélyeket - Nézd meg a GitHub Models hozzáférési engedélyeket
**Docsify nem szolgáltatja a dokumentációt**: **Docsify nem szolgáltat dokumentációt**:
- Telepítsd a docsify-cli-t globálisan: `npm install -g docsify-cli` - Telepítsd a docsify-cli-t globálisan: `npm install -g docsify-cli`
- Futtasd a repozitórium gyökérkönyvtárából - Futtasd az adattár gyökérkönyvtárából
- Ellenőrizd, hogy létezik-e a `docs/_sidebar.md` - Ellenőrizd, hogy létezik a `docs/_sidebar.md`
### Fejlesztési Környezet Tippek ### Fejlesztői környezeti tippek
- Használj VS Code-ot Live Server bővítménnyel HTML projektekhez - Használd a VS Code Live Server bővítményt HTML projektekhez
- Telepítsd az ESLint és Prettier bővítményeket a konzisztens formázás érdekében - Telepítsd az ESLint és Prettier bővítményeket a konzisztens formázáshoz
- Használj böngészőfejlesztő eszközöket JavaScript hibakereséshez - Használd a böngésző fejlesztői eszközeit JavaScript hibakereséshez
- Vue projektekhez telepítsd a Vue DevTools böngészőbővítményt - Vue projektekhez telepítsd a Vue DevTools böngésző bővítményt
### Teljesítmény Szempontok ### Teljesítmény szempontok
- Nagy számú fordított fájl (50+ nyelv) miatt a teljes klónok mérete nagy - A sok fordított fájl (50+ nyelv) miatt a teljes klón nagy
- Használj sekély klónt, ha csak angol tartalommal dolgozol: `git clone --depth 1` - Használj sekély klónt, ha csak tartalommal dolgozol: `git clone --depth 1`
- Zárd ki a fordításokat a keresésekből, ha angol tartalommal dolgozol - Bontsd ki a fordításokat a keresésekből, ha angol tartalommal dolgozol
- Az építési folyamatok lassúak lehetnek az első futtatáskor (npm install, Vite build) - A build folyamatok lassúak lehetnek az első futtatáskor (npm install, Vite build)
## Biztonsági Szempontok ## Biztonsági szempontok
### Környezeti Változók ### Környezeti változók
- API kulcsokat soha ne kötelezz a repozitóriumba - API kulcsokat soha ne tölts be az adattárba
- Használj `.env` fájlokat (már szerepel a `.gitignore`-ban) - Használj `.env` fájlokat (már szerepelnek a `.gitignore`-ban)
- Dokumentáld a szükséges környezeti változókat a projekt README fájlokban - Dokumentáld a szükséges környezeti változókat a projekt README-jeiben
### Python Projektek ### Python projektek
- Használj virtuális környezeteket: `python -m venv venv` - Használj virtuális környezeteket: `python -m venv venv`
- Tartsd naprakészen a függőségeket - Tartsd naprakészen a függőségeket
- A GitHub tokeneknek minimális szükséges engedélyekkel kell rendelkezniük - A GitHub tokeneknek minimális szükséges jogosultságokkal kell rendelkezniük
### GitHub Models Hozzáférés ### GitHub Models hozzáférés
- Személyes Hozzáférési Tokenek (PAT) szükségesek a GitHub Models-hez - Személyes hozzáférési tokenek (PAT) szükségesek a GitHub Models-hez
- A tokeneket környezeti változóként kell tárolni - A tokeneket környezeti változóként tárold
- Soha ne kötelezz tokeneket vagy hitelesítő adatokat - Soha ne töltsd fel a tokeneket vagy hitelesítő adatokat az adattárba
## További Megjegyzések ## Egyéb megjegyzések
### Célközönség ### Célközönség
- Teljesen kezdők a webfejlesztésben - Teljes webfejlesztő kezdők
- Diákok és önálló tanulók - Diákok és önálló tanulók
- Tanárok, akik az osztályteremben használják a tananyagot - Tanárok, akik az órán használják a tananyagot
- A tartalom akadálymentességre és fokozatos készségfejlesztésre van tervezve - A tartalom akadálymentes és fokozatos képességfejlesztésre tervezett
### Oktatási Filozófia ### Oktatási filozófia
- Projektalapú tanulási megközelítés - Projekt alapú tanulási megközelítés
- Gyakori tudásellenőrzések (kvízek) - Gyakori tudásellenőrzések (kvízek)
- Gyakorlati kódolási gyakorlatok - Gyakorlati kódolási feladatok
- Valós alkalmazási példák - Valós alkalmazási példák
- A keretrendszerek előtt az alapokra helyezett fókusz - Az alapokra helyezi a hangsúlyt a keretrendszerek előtt
### Repozitórium Karbantartás ### Adattár karbantartás
- Aktív tanulói és hozzájárulói közösség - Aktív közösség tanulókból és hozzájárulókból
- Rendszeres frissítések a függőségekben és tartalomban - Rendszeres frissítések a függőségekben és tartalmakban
- A karbantartók figyelemmel kísérik az issue-kat és a vitákat - Hibák és beszélgetések karbantartók által felügyelve
- Fordítási frissítések automatizálva GitHub Actions segítségével - Fordítási frissítések automatizáltak GitHub Actions segítségével
### Kapcsolódó Források ### Kapcsolódó források
- [Microsoft Learn modulok](https://docs.microsoft.com/learn/) - [Microsoft Learn modulok](https://docs.microsoft.com/learn/)
- [Student Hub források](https://docs.microsoft.com/learn/student-hub/) - [Student Hub erőforrások](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) ajánlott tanulók számára - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) ajánlott tanulóknak
- További kurzusok: Generatív AI, Adattudomány, ML, IoT tananyagok elérhetők - További kurzusok: Generatív AI, Adattudomány, ML, IoT tananyagok elérhetők
### Egyes Projektek Használata ### Egyes projektek kezelése
Az egyes projektek részletes útmutatójáért lásd a README fájlokat: Az egyes projektek részletes utasításai a README fájlokban találhatók:
- `quiz-app/README.md` - Vue 3 kvíz alkalmazás - `quiz-app/README.md` - Vue 3 kvíz alkalmazás
- `7-bank-project/README.md` - Banki alkalmazás hitelesítéssel - `7-bank-project/README.md` - Banki alkalmazás hitelesítéssel
- `5-browser-extension/README.md` - Böngészőbővítmény fejlesztés - `5-browser-extension/README.md` - Böngészőbővítmény fejlesztés
- `6-space-game/README.md` - Vászon alapú játékfejlesztés - `6-space-game/README.md` - Canvas alapú játékfejlesztés
- `9-chat-project/README.md` - AI chat asszisztens projekt - `9-chat-project/README.md` - AI chat asszisztens projekt
### Monorepo Struktúra ### Monorepo szerkezet
Bár nem hagyományos monorepo, ez a repozitórium több független projektet tartalmaz: Bár nem hagyományos monorepo, ez az adattár több független projektet tartalmaz:
- Minden lecke önálló - Minden lecke önállóan működik
- A projektek nem osztanak meg függőségeket - A projektek nem osztanak meg függőségeket
- Egyes projektek fejlesztése nem befolyásolja a többit
- A teljes tananyag élményhez klónozd az egész adattárat
--- ---
**Felelősségi nyilatkozat**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
Ez a dokumentum az [Co-op Translator](https://github.com/Azure/co-op-translator) AI fordítási szolgáltatás segítségével került lefordításra. Bár törekszünk a pontosságra, kérjük, vegye figyelembe, hogy az automatikus fordítások hibákat vagy pontatlanságokat tartalmazhatnak. Az eredeti dokumentum az eredeti nyelvén tekintendő hiteles forrásnak. Fontos információk esetén javasolt professzionális emberi fordítást igénybe venni. Nem vállalunk felelősséget semmilyen félreértésért vagy téves értelmezésért, amely a fordítás használatából eredhet. **Jogi nyilatkozat**:
Ezt a dokumentumot az AI fordító szolgáltatás [Co-op Translator](https://github.com/Azure/co-op-translator) segítségével fordítottuk le. Bár a pontosságra törekszünk, kérjük, vegye figyelembe, hogy az automatikus fordítások tartalmazhatnak hibákat vagy pontatlanságokat. Az eredeti dokumentum a saját nyelvén tekintendő hiteles forrásnak. Kritikus információk esetén szakmai emberi fordítást javaslunk. Nem vállalunk felelősséget az ebből eredő félreértésekért vagy téves értelmezésekért.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

258
translations/hu/README.md
Unescape View File

@ -2,7 +2,7 @@
[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) [![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) [![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) [![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) [![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)
[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
@ -10,263 +10,259 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Webfejlesztés kezdőknek - Tanmenet # Webfejlesztés kezdőknek – Tananyag
Tanuld meg a webfejlesztés alapjait a Microsoft Cloud Advocates által tartott átfogó 12 hetes tanfolyamunkkal. A 24 lecke mindegyike a JavaScript, CSS és HTML témakörét dolgozza fel gyakorlati projektek segítségével, mint például terráriumok, böngészőbővítmények és űrjátékok. Vegyél részt kvízekben, vitákban és gyakorlati feladatokban. Fejleszd készségeidet, és optimalizáld tudásod megőrzését hatékony, projektalapú oktatásunkkal. Kezdd el kódolási utadat még ma! Ismerd meg a webfejlesztés alapjait a Microsoft Cloud Advocates átfogó, 12 hetes tanfolyamán. A 24 leckéből álló anyag minden egyes részében gyakorlati projektek – teráriumok, böngészőbővítmények és űrjátékok – segítségével mélyedhetsz el a JavaScript, CSS és HTML világában. Vegyél részt kvízekben, beszélgetésekben és gyakorlati feladatokban. Fejleszd készségeidet, és optimalizáld tudásod megtartását hatékony, projektalapú oktatásunkkal. Kezdd el a kódolási utadat még ma!
Csatlakozz az Azure AI Foundry Discord közösséghez Csatlakozz az Azure AI Foundry Discord közösséghez!
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Kövesd ezeket a lépéseket, hogy elkezdd használni ezeket az erőforrásokat: Kezd el az alábbi lépések követésével használni ezeket az erőforrásokat:
1. **Forkold a tárolót**: Kattints a [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) gombra 1. **Forkold az adattárat**: Kattints ide [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Klónozd a tárolót**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klónozd az adattárat**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Csatlakozz az Azure AI Foundry Discord szerveréhez, találkozz szakértőkkel és fejlesztőtársaiddal**](https://discord.com/invite/ByRwuEEgH4) 3. [**Csatlakozz az Azure AI Foundry Discordhoz, és ismerkedj szakértőkkel és más fejlesztőkkel**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Többnyelvű támogatás ### 🌐 Többnyelvű támogatás
#### GitHub Action segítségével támogatott (Automatikus és mindig naprakész) #### GitHub Action által támogatott (Automatizált és mindig naprakész)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](./README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](./README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Szeretnéd helyben klónozni?** > **Inkább helyben klónoznád?**
> Ez a tároló 50+ nyelvre fordításokat tartalmaz, amelyek jelentősen megnövelik a letöltési méretet. Ha fordítások nélkül szeretnéd letölteni, használj sparse checkoutot: > Ez az adattár több mint 50 nyelvű fordítást tartalmaz, ami jelentősen megnöveli a letöltési méretet. Ha fordítások nélkül szeretnéd klónozni, használhatod a sparse checkoutot:
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> Ez mindent megad, ami a tanfolyam teljesítéséhez szükséges, sokkal gyorsabb letöltéssel. > Ezzel minden szükséges anyagot megkapsz a tanfolyam elvégzéséhez, sokkal gyorsabb letöltéssel.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ha további nyelvi támogatást szeretnél, az elérhető nyelvek listája [itt található](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Ha további nyelvi támogatást szeretnél, jelenleg támogatott fordítások listája [itt található](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Megnyitás a Visual Studio Code-ban](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Diák vagy?_ #### 🧑‍🎓 _Diák vagy?_
Látogass el a [**Student Hub oldalára**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), ahol találsz kezdő erőforrásokat, diákcsomagokat, sőt az ingyenes bizonyítvány beváltó módját is. Ezt az oldalt érdemes könyvjelzőzni és időnként megnézni, mert havonta frissül a tartalom. Látogass el a [**Student Hub oldalra**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), ahol kezdőknek szóló forrásokat, diák csomagokat és akár ingyenes tanúsítványutalványt is találsz. Ezt az oldalt érdemes könyvjelzővel ellátni és időnként felkeresni, hiszen havonta frissítjük a tartalmat.
### 📣 Bejelentés - Új GitHub Copilot Agent mód kihívások várnak rád! ### 📣 Bejelentés – Új GitHub Copilot Agent mód kihívások!
Új kihívás érhető el, keresd a "GitHub Copilot Agent Challenge 🚀" címkéjű részeket a legtöbb fejezetben. Ez egy új kihívás, amit GitHub Copilot és Agent mód használatával teljesíthetsz. Ha még nem használtad az Agent módot, tud szöveget generálni, de fájlokat létrehozni, szerkeszteni, parancsokat futtatni is képes. Új kihívás került hozzáadásra, keress rá a "GitHub Copilot Agent Challenge 🚀" kifejezésre a legtöbb fejezetben. Ez egy új kihívás, amelyhez a GitHub Copilot és az Agent mód segítségével dolgozhatsz. Ha még nem használtad az Agent módot, ez nem csak szöveg generálására képes, hanem fájlokat is létre tud hozni és szerkeszteni, parancsokat futtat és egyebeket.
### 📣 Bejelentés - _Új projekt generatív MI használatával_ ### 📣 Bejelentés – _Új projekt generatív MI segítségével_
Új AI-asszisztens projekt került hozzáadásra, nézd meg [projektt](./9-chat-project/README.md) Új MI asszisztens projekt került be, nézd meg [projekt](./9-chat-project/README.md)
### 📣 Bejelentés - _Új tanmenet_ generatív MI-ről JavaScripthez jelent meg ### 📣 Bejelentés – _Új tananyag_ Generatív MI JavaScript számára most jelent meg
Ne hagyd ki új generatív MI tanmenetünket! Ne hagyd ki új Generatív MI tananyagunkat!
Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra és kezdj neki! Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra, hogy elkezdd!
![Hátter](../../translated_images/hu/background.148a8d43afde5730.webp) ![Background](../../translated_images/hu/background.148a8d43afde5730.webp)
- Tanórák az alapoktól a RAG-ig. - Leckék az alapoktól a RAG-ig.
- Történelmi személyekkel is kommunikálhatsz GenAI és kísérő alkalmazásunk segítségével. - Interaktív történelmi szereplőkkel GenAI és kísérő alkalmazásunk segítségével.
- Szórakoztató, lebilincselő történet, időutazás! - Szórakoztató, lebilincselő narratíva, időutazással!
![karakter](../../translated_images/hu/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/hu/character.5c0dd8e067ffd693.webp)
Minden leckéhez tartozik egy teljesítendő feladat, egy tudásellenőrző és egy kihívás, melyek segítenek az alábbi témák elsajátításában: Minden lecke tartalmaz egy feladatot, tudásellenőrzést és kihívást, amelyek segítségével megismerheted:
- Promptok és prompttervezés - Promptolás és prompt mérnökség
- Szöveg- és képgeneráló alkalmazások - Szöveges és képes alkalmazás generálás
- Keresőalkalmazások - Keresőalkalmazások
Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra és kezdj neki! Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra, hogy elkezdd!
## 🌱 Kezdés ## 🌱 Kezdés
> **Tanárok**, [tartalmazunk javaslatokat](for-teachers.md) a tanmenet használatához. Nagyon örülnénk a visszajelzéseteknek [a vitafórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Tanári megjegyzésként**, tartalmazunk néhány javaslatot [itt](for-teachers.md) a tananyag használatához. Várjuk visszajelzésedet [a vitafórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Tanulók](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, minden leckét kezdjetek egy előadó előtti kvízzel, majd olvassátok el a lecke anyagát, végezzétek el a különféle tevékenységeket, és a lecke végén értékeljétek tudásotokat az utókvízzel.
A tanulási élmény fokozásához érdemes társakkal együtt dolgozni a projekteken! A vitákra bátorítunk a [vitafórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), ahol moderátor csapatunk válaszol a kérdéseitekre. **[Tanulók](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, minden leckét egy előzetes kvízzel kezdjetek, majd olvassátok el az anyagot, végezzétek el a feladatokat, és ellenőrizzétek megértéseteket az utólagos kvízzel.
Tanulmányaitok elmélyítése érdekében javasoljuk a [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) további tananyag-kínálatának feltérképezését. Tanulási élményetek javítása érdekében dolgozzatok együtt társaiddal a projekteken! A beszélgetéseket biztatjuk [a vitafórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), ahol moderátoraink válaszolnak kérdéseitekre.
### 📋 Fejlesztőkörnyezet beállítása Tanulmányaitok elősegítésére erősen ajánljuk a [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) oldal további anyagainak megismerését.
Ehhez a tanmenethez kész fejlesztőkörnyezet jár! A tanfolyam kezdetekor választhatsz, hogy böngészőben futtatható [Codespace](https://github.com/features/codespaces/) környezetben (telepítés nélkül), vagy helyben a saját gépeden, egy szövegszerkesztővel, például [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) segítségével szeretnéd-e futtatni. ### 📋 Környezeted beállítása
#### Tároló létrehozása A tananyag fejlesztői környezete készen áll! Kezdéskor választhatsz, hogy egy [Codespace](https://github.com/features/codespaces/) (_böngésző alapú, telepítés nélküli környezet_) futtatásával, vagy helyben, a számítógépeden egy szövegszerkesztő, például a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) használatával dolgozol.
A munkád egyszerű mentése érdekében ajánlott saját példányt készítened ebből a tárolóból. Ezt a lap tetején található **Use this template** gombra kattintva teheted meg. Ezzel a saját GitHub fiókodban kapsz egy új tárolót, amely a tanmenet másolatát tartalmazza. #### Hozd létre saját adattáradat
Annak érdekében, hogy könnyen menthesd munkád, ajánlott létrehozni saját példányodat ebből az adattárból. Ezt a felül található **Use this template** gombbal teheted meg. Ez létrehoz egy új adattárat a GitHub-fiókodban a tananyag másolatával.
Kövesd az alábbi lépéseket: Kövesd az alábbi lépéseket:
1. **Forkold a tárolót**: Kattints a lap jobb felső sarkában a „Fork” gombra. 1. **Forkold az adattárat**: Kattints a "Fork" gombra a felső jobb sarokban ezen az oldalon.
2. **Klónozd a tárolót**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klónozd az adattárat**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Tanmenet futtatása Codespace környezetben #### Tananyag futtatása Codespace-ben
A saját tárolódban, amit létrehoztál, kattints a **Code** gombra, majd válaszd az **Open with Codespaces** opciót. Ez létrehoz egy új Codespace környezetet a munka számára. A létrehozott adattáradban kattints a **Code** gombra, majd válaszd az **Open with Codespaces** opciót. Ez létrehoz neked egy új Codespace környezetet.
![Codespace](../../translated_images/hu/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/hu/createcodespace.0238bbf4d7a8d955.webp)
#### Tanmenet futtatása helyben a gépeden #### Tananyag futtatása helyben a számítógépeden
A tanmenet helyi futtatásához szükséged lesz egy szövegszerkesztőre, egy böngészőre és egy parancssori eszközre. Az első leckénk, a [Bevezetés a programozási nyelvekbe és a fejlesztői eszközökbe](../../1-getting-started-lessons/1-intro-to-programming-languages) bemutat különféle opciókat ezekre az eszközökre, hogy kiválaszthasd, melyik felel meg legjobban neked. A tananyag helyi futtatásához szövegszerkesztőre, böngészőre és parancssori eszközre lesz szükséged. Az első leckénk, [Bevezetés a programozási nyelvekbe és eszközeibe](../../1-getting-started-lessons/1-intro-to-programming-languages), bemutat különféle lehetőségeket ezekre az eszközökre, hogy kiválaszthasd a számodra legmegfelelőbbet.
Ajánlásunk a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) használata szerkesztőként, mely beépített [Terminált](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) is tartalmaz. A Visual Studio Code letölthető [innen](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Ajánlásunk a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) használata, amely beépített [terminállal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) rendelkezik. A Visual Studio Code-ot innen töltheted le: [link](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Klónozd a saját adattáradat a számítógépedre. Ezt megteheted a **Code** gombra kattintva és az URL másolásával:
1. Klónozd a tárolót a gépedre. Ezt megteheted a **Code** gombra kattintva és a URL másolásával:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Ezután nyiss meg egy [Terminalt](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) alkalmazáson belül, és futtasd a következő parancsot, az `<your-repository-url>` helyére a most másolt URL-t beillesztve: Ezután nyisd meg a [Terminált](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) alkalmazáson belül, és futtasd a következő parancsot, a `<your-repository-url>` helyére illeszd be az imént másolt URL-t:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Nyisd meg a mappát a Visual Studio Code-ban. Ezt a **File** > **Open Folder** menüre kattintva teheted meg, majd válaszd ki a klónozott mappát. 2. Nyisd meg a mappát a Visual Studio Code-ban. Ezt úgy teheted meg, hogy a **Fájl** > **Mappa megnyitása** menüpontra kattintasz, majd kiválasztod az imént klónozott mappát.
> Ajánlott Visual Studio Code kiterjesztések: > Ajánlott Visual Studio Code kiterjesztések:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML oldalak előnézete a Visual Studio Code-on belül > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML oldalak előnézete a Visual Studio Code-on belül
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - hogy gyorsabban írj kódot > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - segít gyorsabban írni a kódot
## 📂 Minden leckéhez tartozik: ## 📂 Minden leckében megtalálható:
- opcionális vázlatrajz - opcionális skiccjegyzet
- opcionális kiegészítő videó - opcionális kiegészítő videó
- előre a leckéhez tartozó ráhangoló kvíz - óra előtti bemelegítő kvíz
- írásos lecke - írásos lecke
- projekt-alapú leckék esetén lépésről lépésre vezetett útmutató a projekt elkészítéséhez - projekt alapú leckék esetén lépésről lépésre útmutatók a projekt elkészítéséhez
- tudásellenőrzések - tudásellenőrző kérdések
- kihívás - kihívás
- kiegészítő olvasnivaló - kiegészítő olvasmányok
- feladat - feladat
- [utóleckés kvíz](https://ff-quizzes.netlify.app/web/) - [óra utáni kvíz](https://ff-quizzes.netlify.app/web/)
> **Megjegyzés a kvízekről**: Minden kvíz a Quiz-app mappában található, összesen 48 kvíz, mindegyik három kérdésből áll. Elérhetőek [itt](https://ff-quizzes.netlify.app/web/), a kvíz alkalmazás helyileg futtatható vagy Telepíthető Azure-ra; kövesd a `quiz-app` mappában található utasításokat. > **Jegyzet a kvízekről**: Minden kvíz a Quiz-app mappában található, összesen 48 darab, mindegyik három kérdéssel. Elérhetők [itt](https://ff-quizzes.netlify.app/web/), a kvízalkalmazás helyben futtatható vagy telepíthető az Azure-ra; az instrukciókat a `quiz-app` mappában találod.
## 🗃️ Leckék ## 🗃️ Leckék
| | Projekt neve | Tanított fogalmak | Tanulási célok | Kapcsolódó lecke | Szerző | | | Projekt neve | Tanult fogalmak | Tanulási célok | Kapcsolódó lecke | Szerző |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :------------------------------------------------------: | :-------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Kezdés | Programozás alapjai és munkához használt eszközök | Megérteni a legtöbb programozási nyelv alapjait és a szoftvereket, amikkel a profi fejlesztők dolgoznak | [Programozási nyelvek és eszközök bevezetése](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Kezdés | Bevezetés a programozásba és a fejlesztői eszközökbe | Megtanulni a legtöbb programozási nyelv alapjait és a szoftvereket, amelyek segítik a szakmai fejlesztőket munkájuk során | [Bevezetés a programozási nyelvekbe és eszközökbe](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Kezdés | GitHub alapjai, csapatmunka | Hogyan használd a GitHub-ot a projektjeidhez, hogyan működj együtt másokkal egy kódalapon | [GitHub bevezető](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Kezdés | GitHub alapok, köztük csapatmunkával kapcsolatos ismeretek | Megtanulni, hogyan kell használni a GitHub-ot a projektben és hogyan működj együtt másokkal a kódon | [Bevezetés a GitHub-ba](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Kezdés | Akadálymentesség | Alapok megismerése a webes akadálymentességből | [Akadálymentesség alapjai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Kezdés | Akadálymentesség | Megtanulni a web akadálymentesség alapjait | [Az akadálymentesség alapjai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS alapok | JavaScript adattípusok | JavaScript adattípusok alapjai | [Adattípusok](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | JS alapok | JavaScript adattípusok | A JavaScript adattípusok alapjai | [Adattípusok](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS alapok | Függvények és metódusok | Megtanulni a függvényekről és metódusokról, amik egy alkalmazás logikáját kezelik | [Függvények és metódusok](./2-js-basics/2-functions-methods/README.md) | Jasmine és Christopher | | 05 | JS alapok | Függvények és metódusok | Függvényekről és metódusokról tanulni az alkalmazás logikájának kezeléséhez | [Függvények és metódusok](./2-js-basics/2-functions-methods/README.md) | Jasmine és Christopher |
| 06 | JS alapok | Döntéshozatal JS-ben | Megtanulni, hogyan hozz döntéseket a kódodban döntéshozatali metódusok segítségével | [Döntéshozatal](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | JS alapok | Döntéshozatal JavaScripttel | Tanulj meg feltételeket létrehozni a kódodban döntéshozatali módszerek segítségével | [Döntéshozatal](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS alapok | Tömbök és ciklusok | Adatkezelés tömbökkel és ciklusokkal JavaScriptben | [Tömbök és ciklusok](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | JS alapok | Tömbök és ciklusok | Adatok kezelése tömbök és ciklusok segítségével JavaScript-ben | [Tömbök és ciklusok](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML gyakorlatban | HTML felépítése egy online terráriumhoz, különös tekintettel az elrendezésre | [HTML bevezető](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML a gyakorlatban | HTML felépítése egy online terrárium számára, a felépítésre fókuszálva | [Bevezetés a HTML-be](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrárium](./3-terrarium/solution/README.md) | CSS gyakorlatban | CSS készítése az online terrárium megjelenítéséhez, az alapoktól kezdve, beleértve az oldal reszponzívvá tételét | [CSS bevezető](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrárium](./3-terrarium/solution/README.md) | CSS a gyakorlatban | CSS készítése az online terrárium stílusához, a CSS alapjaira fókuszálva, beleértve a reszponzív oldal készítését | [Bevezetés a CSS-be](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScript zárványok, DOM kezelése | JavaScript írása a terrárium drag/drop működéséhez, fókuszálva a zárványokra és a DOM kezelésére | [JavaScript zárványok, DOM kezelés](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScript closure-ök, DOM manipuláció | JavaScript írása a terrárium húzás- és ejtéses működéséhez, a closure-ök és a DOM manipuláció fókuszával | [JavaScript closure-ök, DOM manipuláció](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Gépelős játék](./4-typing-game/solution/README.md) | Gépelős játék készítés | Megtanulni, hogyan használj billentyűeseményeket a JavaScript alkalmazás logikájához | [Eseményvezérelt programozás](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Gépelős játék](./4-typing-game/solution/README.md) | Gépelős játék készítése | Tanuld meg, hogyan használhatóak a billentyűesemények a JavaScript alkalmazás logikájában | [Eseményvezérelt programozás](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zöld böngésző kiterjesztés](./5-browser-extension/solution/README.md) | Böngészőkkel való munka | Megismerni, hogyan működnek a böngészők, történetüket, és hogyan kezdj neki egy böngésző kiterjesztés első elemeinek megalkotásához | [Böngészőkről](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Böngészőkkel való munka | Tanuld meg, hogyan működnek a böngészők, történetüket és hogyan lehet elkészíteni az első elemeket egy böngészőbővítményhez | [A böngészőkről](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Zöld böngésző kiterjesztés](./5-browser-extension/solution/README.md) | Űrlap készítése, API hívás és változók helyi tárolása | JavaScript elemek elkészítése a böngésző kiterjesztéshez API hívásához helyi tárban tárolt változókkal | [API-k, űrlapok és helyi tárolás](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Űrlap készítése, API hívása és változók tárolása helyi tárolóban | JavaScript elemek írása a böngészőbővítményedhez API hívásához, helyi tárolóban tárolt változók használatával | [API-k, űrlapok és helyi tároló](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zöld böngésző kiterjesztés](./5-browser-extension/solution/README.md) | Háttérfolyamatok a böngészőben, webes teljesítmény | Használd a böngésző háttérfolyamatait a kiterjesztés ikon kezeléséhez; ismerkedj meg a web teljesítménnyel és néhány optimalizációval | [Háttérfeladatok és teljesítmény](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Háttérfolyamatok a böngészőben, web teljesítmény | Használd a böngésző háttérfolyamatait a bővítmény ikon kezelésére; ismerkedj meg a web teljesítménnyel és optimalizációkkal | [Háttérfeladatok és teljesítmény](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Űrjáték](./6-space-game/solution/README.md) | Fejlettebb játékfejlesztés JavaScript-tel | Megtanulni az öröklődést osztályokkal és kompozícióval, illetve a pub/sub mintát, felkészülve egy játék készítésére | [Bevezetés a fejlettebb játékfejlesztésbe](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Űrjáték](./6-space-game/solution/README.md) | Haladóbb játékkészítés JavaScript-tel | Tanulj az öröklésről osztályokkal és kompozícióval, valamint a Pub/Sub mintáról játék készítéshez | [Bevezetés a haladó játékkészítésbe](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Űrjáték](./6-space-game/solution/README.md) | Rajzolás canvas-ra | Megismerni a Canvas API-t, amivel elemeket lehet megrajzolni a képernyőre | [Rajzolás canvas-ra](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Űrjáték](./6-space-game/solution/README.md) | Rajzolás a canvas-re | Ismerd meg a Canvas API-t, amellyel elemek rajzolhatók a képernyőre | [Rajzolás a canvas-re](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Űrjáték](./6-space-game/solution/README.md) | Elem mozgatás a képernyőn | Felfedezni, hogyan kapnak mozgást az elemek kartézián koordináták és a Canvas API használatával | [Elemek mozgatása](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Űrjáték](./6-space-game/solution/README.md) | Mozgatás a képernyőn elemekkel | Fedezd fel, hogyan lehet mozgást adni elemeknek a kartézián koordinátákkal és a Canvas API-val | [Elemek mozgatása](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Űrjáték](./6-space-game/solution/README.md) | Ütközés érzékelés | Elem-ütközések kezelése és reagálás egymásra billentyűleütések alapján, cooldown funkció biztosítása a játék teljesítményéhez | [Ütközés érzékelés](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Űrjáték](./6-space-game/solution/README.md) | Ütközés érzékelés | Készítsd el az ütközések kezelését elemek között, billentyűnyomások segítségével, valamint adj egy várakozási funkciót a játék teljesítményéhez | [Ütközés érzékelés](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Űrjáték](./6-space-game/solution/README.md) | Pontszámlálás | Matematikai műveletek elvégzése a játék állapota és teljesítménye alapján | [Pontszámlálás](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Űrjáték](./6-space-game/solution/README.md) | Pontszámkészítés | Végezz matematikai számításokat a játék státusza és teljesítménye alapján | [Pontszámkészítés](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Űrjáték](./6-space-game/solution/README.md) | Játék befejezése és újraindítása | Megtanulni a játék befejezését és újraindítását, beleértve az erőforrások tisztítását és a változók visszaállítását | [A befejezési feltétel](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Űrjáték](./6-space-game/solution/README.md) | A játék befejezése és újraindítása | Ismerkedj meg a játék befejezésével és újraindításával, beleértve az erőforrások törlését és változók alaphelyzetbe állítását | [A befejező feltétel](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banki app](./7-bank-project/solution/README.md) | HTML sablonok és útvonalak egy webalkalmazásban | Megtanulni többoldalas webhely architektúrájának felépítését routing és HTML sablonok használatával | [HTML sablonok és útvonalak](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Banki alkalmazás](./7-bank-project/solution/README.md) | HTML sablonok és útvonalak webalkalmazásban | Tanuld meg, hogyan készíthetsz többszörös oldalt tartalmazó weboldal architektúrát routinggal és HTML sablonokkal | [HTML sablonok és útvonalak](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banki app](./7-bank-project/solution/README.md) | Bejelentkezési és regisztrációs űrlap készítése | Megtanulni az űrlapok építését és a validációs eljárásokat | [Űrlapok](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Bejelentkezési és regisztrációs űrlap készítése | Tanulj az űrlapkészítésről és az érvényesítési folyamatokról | [Űrlapok](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banki app](./7-bank-project/solution/README.md) | Adatok lekérése és használata | Hogyan áramlanak az adatok az app-ba és ki, hogyan lehet lekérni, tárolni és eltávolítani | [Adatok](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Adatok lekérése és használata | Hogyan áramlanak az adatok az alkalmazásodba és onnan ki, hogyan kérd le, tárold és töröld őket | [Adatok](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banki app](./7-bank-project/solution/README.md) | Állapotkezelés fogalmai | Megtanulni, hogyan tartja az app az állapotot és hogyan lehet programozottan kezelni | [Állapotkezelés](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Állapotkezelés fogalmai | Tanuld meg, hogyan kezeli az alkalmazásod az állapotot és hogyan kezeld azt programozottan | [Állapotkezelés](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Böngésző / VScode kód](../../8-code-editor) | VScode használata | Megtanulni egy kódszerkesztő használatát | [VScode kódszerkesztő használata](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Böngésző/VScode kód](../../8-code-editor) | VScode használata | Tanuld meg, hogyan használj kódszerkesztőt | [VScode kódszerkesztő használata](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI asszisztensek](./9-chat-project/README.md) | Mesterséges intelligenciával való munka | Megtanulni saját AI asszisztenst készíteni | [AI Asszisztens projekt](./9-chat-project/README.md) | Chris | | 26 | [AI asszisztensek](./9-chat-project/README.md) | Mesterséges intelligenciával való munka | Tanulj meg saját mesterséges intelligencia asszisztenst építeni | [AI asszisztens projekt](./9-chat-project/README.md) | Chris |
## 🏫 Pedagógia ## 🏫 Pedagógia
Tananyagaink két kulcsfontosságú pedagógiai elv alapján készültek: A tananyagunk két fő pedagógiai elv mentén készült:
* projekt-alapú tanulás * projektalapú tanulás
* gyakori kvízek * gyakori kvízek
A program JavaScript, HTML és CSS alapjait tanítja meg, valamint a legújabb eszközöket és technikákat, amelyeket a mai webfejlesztők használnak. A diákoknak lehetőségük lesz gyakorlati tapasztalatot szerezni gépelős játék, virtuális terrárium, környezetbarát böngésző-kiterjesztés, űrtámadó stílusú játék és egy vállalati banki alkalmazás elkészítésével. A sorozat végére a diákok alapos webfejlesztési tudásra tesznek szert. A program a JavaScript, HTML és CSS alapjait, valamint a mai webfejlesztők által használt legújabb eszközöket és technikákat tanítja. A hallgatóknak lehetőségük lesz gyakorlati tapasztalatot szerezni egy gépelős játék, virtuális terrárium, környezetbarát böngészőbővítmény, űrinváziós stílusú játék és egy üzleti banki alkalmazás fejlesztésével. A sorozat végére a résztvevők szilárd ismereteket szereznek a webfejlesztés területén.
> 🎓 Az első néhány leckét ebben a tananyagban egy [Tanulási útvonal](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) formájában is elvégezheted a Microsoft Learn-en! > 🎓 Az első néhány leckét ezen tananyagból elvégezheted a [Tanulási útvonal](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) keretében a Microsoft Learn-en!
A tartalom projektalapúsága révén a tanulási folyamat vonzóbbá válik, és az ismeretek mélyebb elsajátítását segíti elő. Írtunk néhány kezdeti leckét a JavaScript alapjairól, amelyek bevezetik az alapfogalmakat, egy videósorozattal kiegészítve a "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videó-tutorial gyűjteményből, amelynek néhány szerzője hozzájárult ehhez a tananyaghoz. Azáltal, hogy az anyagok a projektekhez igazodnak, a tanulás élvezetesebb és a fogalmak jobb megtartása válik lehetővé. Továbbá több JavaScript alapokat bemutató kezdő leckét írtunk, melyek fogalmakat vezetnek be, kiegészítve a "[Kezdők sorozata: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videós oktatóanyagokkal, melyek egyes szerzői közreműködtek ebben a tananyagban.
Ezen túlmenően, egy alacsony tétű kvíz az óra előtt beállítja a diák tanulási szándékát egy témára, míg a második kvíz az óra után elősegíti a mélyebb rögzítést. Ez a tananyag rugalmas és szórakoztató, teljes egészében vagy részleteiben is elvégezhető. A projektek kicsiben kezdődnek, és a 12 hetes ciklus végére egyre összetettebbek lesznek. Ezen felül egy alacsony tétű kvíz az óra előtt beállítja a diák motivációját a téma tanulására, míg egy második kvíz az óra után biztosítja a tudás további megtartását. Ez a tananyag rugalmas és szórakoztató módon lett kialakítva, teljes egészében vagy részben is elvégezhető. A projektek kicsiben kezdődnek, és a 12 hetes ciklus végére egyre összetettebbek lesznek.
Noha szándékosan elkerültük a JavaScript keretrendszerek bevezetését, hogy a webfejlesztői alapkompetenciákra koncentráljunk mielőtt egy keretrendszer megismerésére térnénk, a tananyag befejezése után jó következő lépés lehet Node.js megtanulása egy másik videó-sorozaton keresztül: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". Bár szándékosan kerültük a JavaScript keretrendszerek bevezetését, hogy a webfejlesztői alapok megtanítása után lehessen csak áttérni azok használatára, jó következő lépés lehet a tananyag után a Node.js elsajátítása a "[Kezdők sorozata: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" videósorozat által.
> Látogasd meg alapelveinket a [Viselkedési kódexünk](CODE_OF_CONDUCT.md) és [Közreműködési irányelveink](CONTRIBUTING.md) oldalakon. Várjuk építő jellegű visszajelzéseidet! > Látogasd meg a [Viselkedési Kódexünket](CODE_OF_CONDUCT.md) és a [Hozzájárulás](CONTRIBUTING.md) útmutatókat. Várjuk építő jellegű visszajelzéseidet!
## 🧭 Offline hozzáférés ## 🧭 Offline hozzáférés
A dokumentációt offline is futtathatod a [Docsify](https://docsify.js.org/#/) segítségével. Forkold ezt a repót, [telepítsd a Docsify-t](https://docsify.js.org/#/quickstart) a helyi gépedre, majd ennek a repónak a gyökérmappájában írd be: `docsify serve`. A weboldal a 3000-es porton lesz elérhető a localhostodon: `localhost:3000`. Ezt a dokumentációt offline is futtathatod a [Docsify](https://docsify.js.org/#/) használatával. Forkold le ezt a repót, [telepítsd a Docsify-t](https://docsify.js.org/#/quickstart) a helyi gépeden, majd a repo gyökérmappájában írd be: `docsify serve`. A weboldal a localhost 3000-es portján lesz elérhető: `localhost:3000`.
## 📘 PDF ## 📘 PDF
Az összes lecke PDF formátumban megtalálható [itt](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). Az összes leckéről készült PDF [itt található](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Egyéb tanfolyamok ## 🎒 Egyéb kurzusok
Csapatunk más kurzusokat is készít! Nézd meg: Csapatunk más tanfolyamokat is készít! Nézd meg:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j kezdőknek](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js kezdőknek](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain kezdőknek](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Ügynökök ### Azure / Edge / MCP / Ügynökök
[![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![AZD kezdőknek](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI kezdőknek](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP kezdőknek](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI Agents for Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) [![AI ügynökök kezdőknek](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Generatív AI sorozat ### Generatív AI sorozat
[![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generatív AI kezdőknek](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generatív AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) [![Generatív AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[![Generative AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) [![Generatív AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
--- ---
### Alap tanulás ### Alapvető tanulás
[![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![ML kezdőknek](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Adattudomány kezdőknek](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI kezdőknek](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Cybersecurity for Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Kiberbiztonság kezdőknek](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Web Dev for Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Webfejlesztés kezdőknek](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT for Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT kezdőknek](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![XR Development for Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR fejlesztés kezdőknek](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Copilot sorozat ### Copilot sorozat
[![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot AI páros programozáshoz](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot C#/.NET-hez](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot kaland](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Segítség kérése ## Segítségkérés
Ha elakadsz vagy bármilyen kérdésed van az AI alkalmazások fejlesztésével kapcsolatban, csatlakozz tanulótársaidhoz és tapasztalt fejlesztőkhöz az MCP-ről szóló beszélgetésekben. Ez egy támogató közösség, ahol a kérdések szívesen látottak, és a tudás szabadon megosztott. Ha elakadsz vagy kérdésed van az AI alkalmazások fejlesztésével kapcsolatban, csatlakozz a többi tanulóhoz és tapasztalt fejlesztőkhöz az MCP-vel kapcsolatos beszélgetésekben. Ez egy támogató közösség, ahol a kérdések szívesen fogadottak és a tudás szabadon megosztott.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Ha termék visszajelzésed vagy hibák során, látogass el ide: Ha termékvisszajelzésed vagy hibáid vannak, látogass el ide:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry fejlesztői fórum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
## Licenc ## Licenc
Ez a tároló az MIT licenc alatt áll. További információkért lásd a [LICENSE](../../LICENSE) fájlt. Ez a tárhely az MIT licenc alatt áll. További információkért lásd a [LICENSE](../../LICENSE) fájlt.
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Jogi nyilatkozat**: **Nyilatkozat**:
Ez a dokumentum az AI fordító szolgáltatás, a [Co-op Translator](https://github.com/Azure/co-op-translator) használatával készült. Bár igyekszünk pontos fordítást nyújtani, kérjük, vegye figyelembe, hogy az automatikus fordítások tartalmazhatnak hibákat vagy pontatlanságokat. Az eredeti, anyanyelvi dokumentum tekintendő hiteles forrásnak. Fontos információk esetén szakmai, emberi fordítást javaslunk. Nem vállalunk felelősséget az ebből eredő félreértésekért vagy hibás értelmezésekért. Ezt a dokumentumot a [Co-op Translator](https://github.com/Azure/co-op-translator) AI fordító szolgáltatás segítségével fordítottuk. Bár a pontosságra törekszünk, kérjük, vegye figyelembe, hogy az automatikus fordítások hibákat vagy pontatlanságokat tartalmazhatnak. Az eredeti dokumentum a saját nyelvén tekintendő hivatalos forrásnak. Fontos információk esetén ajánlott szakmai, emberi fordítást igénybe venni. Nem vállalunk felelősséget a fordítás használatából eredő félreértésekért vagy félreértelmezésekért.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

53
translations/hu/Roadmap.md
Unescape View File

@ -0,0 +1,53 @@
# A Microsoft Web-Dev-For-Beginners adattárának ütemterve
**Ez az adattár egy ütemtervet kínál a webfejlesztés alapjainak elsajátításához, különös tekintettel a JavaScriptre, HTML-re és CSS-re. A tananyag rugalmas, egészében vagy részben is elvégezhető, 24 leckével, amelyek 12 hétre vannak elosztva.**
## Fő mérföldkövek
* **1–3. hét:**
* Bevezetés a programozási nyelvekbe és az eszközökbe
* A GitHub alapjai
* Akadálymentesítés
* JS alapok: adattípusok, függvények és metódusok
* Döntéshozatal JS-sel
* **4–6. hét:**
* Tömbök és ciklusok
* Terrárium: HTML a gyakorlatban
* CSS a gyakorlatban
* JavaScript lezárások
* DOM manipuláció
* **7–9. hét:**
* Gépelős játék: eseményvezérelt programozás
* Zöld böngészőbővítmény: munkavégzés a böngészőkkel
* Űrlap készítése, API hívása és változók tárolása a helyi tárolóban
* Háttérfolyamatok a böngészőben
* Webteljesítmény
* **10–12. hét:**
* Űrjáték: fejlettebb játékfejlesztés JavaScripttel
* Rajzolás a vászonra
* Elemmozgatás a képernyőn
* Ütközésérzékelés
* Pontozás, játék befejezése és újraindítása
* Banki alkalmazás: HTML sablonok és útvonalak webalkalmazásban
* Bejelentkezési és regisztrációs űrlap készítése
* Adatlekérés és felhasználás módszerei
* Állapotkezelési koncepciók
## Tanulási eredmények
**Az ütemterv teljesítésével a tanulók gyakorlati tapasztalatot szereznek gépelős játék, virtuális terrárium, környezetbarát böngészőbővítmény, űr inváziós stílusú játék és üzleti banki alkalmazás fejlesztésében. Emellett szilárd alapot kapnak a webfejlesztés alapelveinek megértésében.**
## További források
* Ez az adattár bőséges forrásokat kínál a további tanuláshoz, beleértve oktatóanyagokat, kódpéldákat és kihívásokat.
* A Microsoft Learn platform számos webfejlesztési kurzust és tanulási útvonalat kínál.
* Az olyan online közösségek, mint a Stack Overflow és az MDN Web Docs értékes támogatást és forrásokat nyújtanak a webfejlesztőknek.
**Remélem, ez az ütemterv segít a webfejlesztői utadon!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Jogi nyilatkozat**:
Ezt a dokumentumot az AI fordító szolgáltatás [Co-op Translator](https://github.com/Azure/co-op-translator) segítségével fordítottuk. Bár a pontosságra törekszünk, kérjük, vegye figyelembe, hogy az automatikus fordítások tartalmazhatnak hibákat vagy pontatlanságokat. Az eredeti dokumentum az anyanyelvén tekintendő hivatalos forrásnak. Fontos információk esetén szakmai, emberi fordítás igénylése javasolt. Nem vállalunk felelősséget az ebből a fordításból eredő félreértésekért vagy téves értelmezésekért.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

12
translations/sk/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2025-10-03T11:38:26+00:00", "translation_date": "2026-02-06T18:19:51+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "sk" "language_code": "sk"
}, },
@ -516,11 +516,17 @@
"language_code": "sk" "language_code": "sk"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T19:03:22+00:00", "translation_date": "2026-02-06T18:15:16+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "sk" "language_code": "sk"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T18:16:04+00:00",
"source_file": "Roadmap.md",
"language_code": "sk"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2025-08-27T21:58:32+00:00", "translation_date": "2025-08-27T21:58:32+00:00",

350
translations/sk/AGENTS.md
Unescape View File

@ -2,281 +2,281 @@
## Prehľad projektu ## Prehľad projektu
Toto je vzdelávací repozitár určený na výučbu základov webového vývoja pre začiatočníkov. Kurikulum je komplexný 12-týždňový kurz vyvinutý tímom Microsoft Cloud Advocates, ktorý obsahuje 24 praktických lekcií zameraných na JavaScript, CSS a HTML. Toto je vzdelávacia učebná osnova na výučbu základov webového vývoja pre začiatočníkov. Učebná osnova je komplexný 12-týždňový kurz vyvinutý Microsoft Cloud Advocates, obsahujúci 24 praktických lekcií pokrývajúcich JavaScript, CSS a HTML.
### Kľúčové komponenty ### Kľúčové komponenty
- **Vzdelávací obsah**: 24 štruktúrovaných lekcií organizovaných do modulov založených na projektoch - **Vzdelávací obsah**: 24 štruktúrovaných lekcií organizovaných do projektovo orientovaných modulov
- **Praktické projekty**: Terárium, Hra na písanie, Rozšírenie prehliadača, Hra vo vesmíre, Banková aplikácia, Editor kódu a AI chatovací asistent - **Praktické projekty**: Terrárium, Hra na písanie, Rozšírenie prehliadača, Hra v priestore, Banková aplikácia, Kódovací editor a AI Chat asistent
- **Interaktívne kvízy**: 48 kvízov, každý s 3 otázkami (pred/po lekcii) - **Interaktívne kvízy**: 48 kvízov s 3 otázkami v každom (pred a po lekcii)
- **Podpora viacerých jazykov**: Automatizované preklady do viac ako 50 jazykov pomocou GitHub Actions - **Podpora viacerých jazykov**: Automatizované preklady do viac než 50 jazykov prostredníctvom GitHub Actions
- **Technológie**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (pre AI projekty) - **Technológie**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (pre AI projekty)
### Architektúra ### Architektúra
- Vzdelávací repozitár so štruktúrou založenou na lekciách - Vzdelávacie úložisko so štruktúrou založenou na lekciách
- Každý priečinok lekcie obsahuje README, príklady kódu a riešenia - Každá zložka lekcie obsahuje README, príklady kódu a riešenia
- Samostatné projekty v oddelených adresároch (quiz-app, rôzne projekty lekcií) - Samostatné projekty v samostatných adresároch (quiz-app, rôzne lekčné projekty)
- Systém prekladov pomocou GitHub Actions (co-op-translator) - Prekladový systém využívajúci GitHub Actions (co-op-translator)
- Dokumentácia dostupná cez Docsify a vo formáte PDF - Dokumentácia poskytovaná cez Docsify a dostupná ako PDF
## Príkazy na nastavenie ## Príkazy na nastavenie
Tento repozitár je primárne určený na konzumáciu vzdelávacieho obsahu. Pre prácu s konkrétnymi projektmi: Toto úložisko je primárne na konzumáciu vzdelávacieho obsahu. Pre prácu s konkrétnymi projektmi:
### Nastavenie hlavného repozitára ### Nastavenie hlavného úložiska
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Nastavenie aplikácie Quiz App (Vue 3 + Vite) ### Nastavenie quiz aplikácie (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Start development server npm run dev # Spustiť vývojový server
npm run build # Build for production npm run build # Vytvoriť zostavu pre produkciu
npm run lint # Run ESLint npm run lint # Spustiť ESLint
``` ```
### API pre bankový projekt (Node.js + Express) ### API banka projekt (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Start API server npm start # Spustiť API server
npm run lint # Run ESLint npm run lint # Spustiť ESLint
npm run format # Format with Prettier npm run format # Formátovať pomocou Prettier
``` ```
### Projekty rozšírenia prehliadača ### Projekty rozšírení prehliadača
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Follow browser-specific extension loading instructions # Postupujte podľa pokynov na načítanie rozšírení špecifických pre prehliadač
``` ```
### Projekty hry vo vesmíre ### Projekty hry v priestore
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# Open index.html in browser or use Live Server # Otvorte index.html v prehliadači alebo použite Live Server
``` ```
### Projekt chatu (Python Backend) ### Chat projekt (Python Backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Set GITHUB_TOKEN environment variable # Nastavte premennú prostredia GITHUB_TOKEN
python api.py python api.py
``` ```
## Pracovný postup vývoja ## Vývojový workflow
### Pre prispievateľov obsahu ### Pre prispievateľov obsahu
1. **Forknite repozitár** do svojho GitHub účtu 1. **Forknite úložisko** do svojho GitHub účtu
2. **Naklonujte svoj fork** lokálne 2. **Naklonujte svoj fork** lokálne
3. **Vytvorte novú vetvu** pre svoje zmeny 3. **Vytvorte nový branch** pre svoje zmeny
4. Upravte obsah lekcií alebo príklady kódu 4. Upravujte obsah lekcií alebo príklady kódu
5. Otestujte zmeny kódu v relevantných adresároch projektov 5. Testujte akékoľvek kódové zmeny v príslušných projektových adresároch
6. Podajte pull request podľa pokynov na prispievanie 6. Podajte pull requesty podľa smerníc pre prispievanie
### Pre študentov ### Pre študentov
1. Forknite alebo naklonujte repozitár 1. Forknite alebo naklonujte úložisko
2. Postupne prechádzajte adresármi lekcií 2. Postupujte sekvenčne do adresárov lekcií
3. Prečítajte si README súbory každej lekcie 3. Čítajte README súbory ku každej lekcii
4. Dokončite kvízy pred lekciou na https://ff-quizzes.netlify.app/web/ 4. Vyplňte predlekčné kvízy na https://ff-quizzes.netlify.app/web/
5. Prejdite si príklady kódu v priečinkoch lekcií 5. Pracujte na príkladoch v adresároch lekcií
6. Splňte úlohy a výzvy 6. Dokončite úlohy a výzvy
7. Dokončite kvízy po lekcii 7. Vyplňte post-lekčné kvízy
### Živý vývoj ### Živý vývoj
- **Dokumentácia**: Spustite `docsify serve` v root adresári (port 3000) - **Dokumentácia**: Spustite `docsify serve` v koreňovom adresári (port 3000)
- **Quiz App**: Spustite `npm run dev` v adresári quiz-app - **Quiz aplikácia**: Spustite `npm run dev` v adresári quiz-app
- **Projekty**: Použite rozšírenie Live Server vo VS Code pre HTML projekty - **Projekty**: Použite VS Code Live Server rozšírenie pre HTML projekty
- **API projekty**: Spustite `npm start` v príslušných adresároch API - **API projekty**: Spustite `npm start` v príslušných API adresároch
## Pokyny na testovanie ## Testovacie pokyny
### Testovanie aplikácie Quiz App ### Testovanie quiz aplikácie
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Check for code style issues npm run lint # Skontrolujte problémy so štýlom kódu
npm run build # Verify build succeeds npm run build # Overte úspešnosť zostavenia
``` ```
### Testovanie Bank API ### Testovanie bankového API
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Check for code style issues npm run lint # Skontrolujte problémy so štýlom kódu
node server.js # Verify server starts without errors node server.js # Overte, či server štartuje bez chýb
``` ```
### Všeobecný prístup k testovaniu ### Všeobecný prístup k testovaniu
- Toto je vzdelávací repozitár bez komplexných automatizovaných testov - Toto je vzdelávacie úložisko bez komplexných automatizovaných testov
- Manuálne testovanie sa zameriava na: - Manuálne testovanie sa zameriava na:
- Spustenie príkladov kódu bez chýb - Spustenie príkladov kódu bez chýb
- Funkčnosť odkazov v dokumentácii - Funkčnosť odkazov v dokumentácii
- Úspešné zostavenie projektov - Úspešné zostavenie projektov
- Dodržiavanie najlepších praktík v príkladoch - Dodržiavanie najlepších praktík v príkladoch
### Kontroly pred odoslaním ### Kontroly pred zaslaním PR
- Spustite `npm run lint` v adresároch s package.json - Spustite `npm run lint` v adresároch s package.json
- Overte platnosť odkazov v markdown súboroch - Overte platnosť markdown odkazov
- Otestujte príklady kódu v prehliadači alebo Node.js - Otestujte príklady kódu v prehliadači alebo Node.js
- Skontrolujte, či preklady zachovávajú správnu štruktúru - Skontrolujte, či preklady zachovávajú správnu štruktúru
## Pokyny pre štýl kódu ## Návody na štýl kódu
### JavaScript ### JavaScript
- Používajte modernú syntax ES6+ - Používajte modernú ES6+ syntax
- Dodržiavajte štandardné konfigurácie ESLint uvedené v projektoch - Dodržiavajte štandardné ESLint konfigurácie poskytnuté v projektoch
- Používajte zrozumiteľné názvy premenných a funkcií pre vzdelávaciu jasnosť - Používajte významné mená premenných a funkcií pre vzdelávaciu jasnosť
- Pridávajte komentáre vysvetľujúce koncepty pre študentov - Pridávajte komentáre vysvetľujúce koncepty pre študentov
- Formátujte pomocou Prettier, kde je nakonfigurovaný - Formátujte pomocou Prettier tam, kde je nastavený
### HTML/CSS ### HTML/CSS
- Semantické HTML5 elementy - Sémantické HTML5 elementy
- Princípy responzívneho dizajnu - Zásady responzívneho dizajnu
- Jasné konvencie pomenovania tried - Jasné pomenovanie tried
- Komentáre vysvetľujúce techniky CSS pre študentov - Komentáre vysvetľujúce CSS techniky pre študentov
### Python ### Python
- Štýlové pokyny PEP 8 - Štýlové smernice PEP 8
- Jasné, vzdelávacie príklady kódu - Jasné, vzdelávacie príklady kódu
- Typové anotácie tam, kde sú užitočné pre učenie - Používanie typových anotácií tam, kde pomáhajú výučbe
### Dokumentácia v Markdown ### Markdown dokumentácia
- Jasná hierarchia nadpisov - Jasná hierarchia nadpisov
- Bloky kódu so špecifikáciou jazyka - Kódové bloky so špecifikáciou jazyka
- Odkazy na ďalšie zdroje - Odkazy na ďalšie zdroje
- Screenshoty a obrázky v adresároch `images/` - Snímky obrazovky a obrázky v `images/` adresároch
- Alt text pre obrázky kvôli prístupnosti - Alternatívny text pre obrázky na prístupnosť
### Organizácia súborov ### Organizácia súborov
- Lekcie číslované postupne (1-getting-started-lessons, 2-js-basics, atď.) - Lekcie číslované sekvenčne (1-getting-started-lessons, 2-js-basics a pod.)
- Každý projekt má adresáre `solution/` a často aj `start/` alebo `your-work/` - Každý projekt má `solution/` a často `start/` alebo `your-work/` adresáre
- Obrázky uložené v špecifických adresároch lekcií `images/` - Obrázky uložené v špecifických `images/` priečinkoch lekcií
- Preklady v štruktúre `translations/{language-code}/` - Preklady v štruktúre `translations/{language-code}/`
## Zostavenie a nasadenie ## Zostavenie a nasadenie
### Nasadenie aplikácie Quiz App (Azure Static Web Apps) ### Nasadenie quiz aplikácie (Azure Static Web Apps)
Aplikácia quiz-app je nakonfigurovaná na nasadenie cez Azure Static Web Apps: Quiz-app je nakonfigurovaný pre nasadenie na Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Creates dist/ folder npm run build # Vytvára priečinok dist/
# Deploys via GitHub Actions workflow on push to main # Nasadzuje pomocou workflow GitHub Actions pri pushnutí do main
``` ```
Konfigurácia Azure Static Web Apps: Konfigurácia Azure Static Web Apps:
- **Umiestnenie aplikácie**: `/quiz-app` - **Umiestnenie aplikácie**: `/quiz-app`
- **Umiestnenie výstupu**: `dist` - **Výstupné umiestnenie**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Generovanie PDF dokumentácie ### Generovanie PDF dokumentácie
```bash ```bash
npm install # Install docsify-to-pdf npm install # Nainštalujte docsify-to-pdf
npm run convert # Generate PDF from docs npm run convert # Vygenerujte PDF z docs
``` ```
### Dokumentácia Docsify ### Docsify dokumentácia
```bash ```bash
npm install -g docsify-cli # Install Docsify globally npm install -g docsify-cli # Nainštalujte Docsify globálne
docsify serve # Serve on localhost:3000 docsify serve # Spustiť na localhost:3000
``` ```
### Zostavenie špecifické pre projekty ### Zostavenie špecifické pre projekt
Každý adresár projektu môže mať vlastný proces zostavenia: Každý projektový adresár môže mať vlastný proces zostavenia:
- Projekty Vue: `npm run build` vytvára produkčné balíky - Vue projekty: `npm run build` vytvára produkčné balíčky
- Statické projekty: Žiadny krok zostavenia, súbory sa servírujú priamo - Statické projekty: Žiadny build krok, súbory sa poskytujú priamo
## Pokyny pre pull requesty ## Smernice pre pull requesty
### Formát názvu ### Formát názvu
Používajte jasné, popisné názvy indikujúce oblasť zmeny: Používajte jasné, popisné názvy označujúce oblasť zmeny:
- `[Quiz-app] Pridať nový kvíz pre lekciu X` - `[Quiz-app] Pridanie nového kvízu pre lekciu X`
- `[Lesson-3] Opraviť preklep v projekte terária` - `[Lesson-3] Oprava preklepu v projekte terrarium`
- `[Translation] Pridať španielsky preklad pre lekciu 5` - `[Translation] Pridanie španielskeho prekladu pre lekciu 5`
- `[Docs] Aktualizovať pokyny na nastavenie` - `[Docs] Aktualizácia inštrukcií na nastavenie`
### Požadované kontroly ### Povinné kontroly
Pred odoslaním PR: Pred odoslaním PR:
1. **Kvalita kódu**: 1. **Kvalita kódu**:
- Spustite `npm run lint` v dotknutých adresároch projektov - Spustite `npm run lint` v ovplyvnených projektových adresároch
- Opravte všetky chyby a varovania lintingu - Opravte všetky chyby a varovania lintera
2. **Overenie zostavenia**: 2. **Overenie build-u**:
- Spustite `npm run build`, ak je to relevantné - Spustite `npm run build`, ak je to relevantné
- Uistite sa, že nie sú žiadne chyby zostavenia - Uistite sa, že nie sú žiadne chyby zostavenia
3. **Validácia odkazov**: 3. **Validácia odkazov**:
- Otestujte všetky odkazy v markdown súboroch - Otestujte všetky markdown odkazy
- Overte funkčnosť referencií na obrázky - Overte fungovanie referencií na obrázky
4. **Kontrola obsahu**: 4. **Kontrola obsahu**:
- Skontrolujte pravopis a gramatiku - Korektúra pravopisu a gramatiky
- Uistite sa, že príklady kódu sú správne a vzdelávacie - Overenie správnosti a vzdelávacieho aspektu príkladov kódu
- Overte, že preklady zachovávajú pôvodný význam - Kontrola, či preklady zachovávajú pôvodný význam
### Požiadavky na prispievanie ### Požiadavky na príspevok
- Súhlas s Microsoft CLA (automatická kontrola pri prvom PR) - Súhlas so zmluvou Microsoft CLA (automatická kontrola pri prvom PR)
- Dodržiavanie [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Dodržiavanie [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Pozrite si [CONTRIBUTING.md](./CONTRIBUTING.md) pre podrobné pokyny - Viac detailov v [CONTRIBUTING.md](./CONTRIBUTING.md)
- Referencujte čísla problémov v popise PR, ak je to relevantné - Referencia na čísla issue v popise PR, ak je to relevantné
### Proces kontroly ### Proces preskúmania
- PR sú kontrolované správcami a komunitou - PR prehliadajú správci a komunita
- Prioritou je vzdelávacia jasnosť - Prioritou je vzdelávacia zrozumiteľnosť
- Príklady kódu by mali dodržiavať aktuálne najlepšie praktiky - Príklady kódu by mali dodržiavať súčasné najlepšie praktiky
- Preklady sú kontrolované na presnosť a kultúrnu vhodnosť - Preklady sú preskúmavané na presnosť a kultúrnu vhodnosť
## Systém prekladov ## Prekladový systém
### Automatizovaný preklad ### Automatizovaný preklad
- Používa GitHub Actions s workflowom co-op-translator - Používa GitHub Actions so workflow co-op-translator
- Automaticky prekladá do viac ako 50 jazykov - Prekladá do viac než 50 jazykov automaticky
- Zdrojové súbory v hlavných adresároch - Zdrojové súbory sú v hlavných adresároch
- Preložené súbory v adresároch `translations/{language-code}/` - Preložené súbory sú v `translations/{language-code}/` adresároch
### Pridávanie manuálnych vylepšení prekladu ### Pridávanie manuálnych zlepšení prekladu
1. Nájdite súbor v `translations/{language-code}/` 1. Nájdite súbor v `translations/{language-code}/`
2. Urobte vylepšenia pri zachovaní štruktúry 2. Zlepšite obsah pri zachovaní štruktúry
3. Uistite sa, že príklady kódu zostávajú funkčné 3. Zabezpečte, že príklady kódu zostanú funkčné
4. Otestujte lokalizovaný obsah kvízov 4. Otestujte lokalizovaný obsah kvízov
### Metaúdaje prekladu ### Metadata prekladu
Preložené súbory obsahujú hlavičku metaúdajov: Preložené súbory obsahujú hlavičku s metadátami:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -293,114 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### Bežné problémy ### Bežné problémy
**Aplikácia Quiz App sa nespustí**: **Quiz aplikácia sa nespustí**:
- Skontrolujte verziu Node.js (odporúčaná v14+) - Skontrolujte verziu Node.js (odporúča sa v14+)
- Odstráňte `node_modules` a `package-lock.json`, znova spustite `npm install` - Vymažte `node_modules` a `package-lock.json`, znovu spustite `npm install`
- Skontrolujte konflikty portov (predvolené: Vite používa port 5173) - Overte konflikty portov (predvolené: Vite používa port 5173)
**API server sa nespustí**: **API server sa nespustí**:
- Overte, že verzia Node.js spĺňa minimum (node >=10) - Skontrolujte, či verzia Node.js spĺňa minimálne požiadavky (node >=10)
- Skontrolujte, či port už nie je obsadený - Overte, či port nie je už obsadený
- Uistite sa, že všetky závislosti sú nainštalované pomocou `npm install` - Uistite sa, že všetky závislosti sú nainštalované cez `npm install`
**Rozšírenie prehliadača sa nenačíta**: **Rozšírenie prehliadača sa nenačíta**:
- Overte, že manifest.json je správne formátovaný - Overte správne formátovanie manifest.json
- Skontrolujte chyby v konzole prehliadača - Skontrolujte konzolu prehliadača na chyby
- Postupujte podľa pokynov na inštaláciu rozšírenia pre konkrétny prehliadač - Postupujte podľa inštrukcií pre inštaláciu rozšírení špecifických pre prehliadač
**Problémy s projektom Python chatu**: **Problémy s Python chat projektom**:
- Uistite sa, že balík OpenAI je nainštalovaný: `pip install openai` - Overte, či je nainštalovaný balík OpenAI: `pip install openai`
- Overte, že premenná prostredia GITHUB_TOKEN je nastavená - Skontrolujte nastavenie environmentálnej premennej GITHUB_TOKEN
- Skontrolujte prístupové povolenia pre GitHub Models - Skontrolujte prístupové práva k GitHub Models
**Docsify neservíruje dokumentáciu**: **Docsify neposkytuje dokumentáciu**:
- Nainštalujte docsify-cli globálne: `npm install -g docsify-cli` - Nainštalujte docsify-cli globálne: `npm install -g docsify-cli`
- Spustite z root adresára repozitára - Spustite z koreňového adresára úložiska
- Skontrolujte, že existuje `docs/_sidebar.md` - Overte, že existuje `docs/_sidebar.md`
### Tipy pre vývojové prostredie ### Tipy pre vývojové prostredie
- Používajte VS Code s rozšírením Live Server pre HTML projekty - Používajte VS Code s rozšírením Live Server pre HTML projekty
- Nainštalujte rozšírenia ESLint a Prettier pre konzistentné formátovanie - Nainštalujte rozšírenia ESLint a Prettier pre konzistentné formátovanie
- Používajte DevTools prehliadača na ladenie JavaScriptu - Používajte DevTools prehliadača na ladenie JavaScriptu
- Pre projekty Vue nainštalujte rozšírenie Vue DevTools prehliadača - Pre Vue projekty nainštalujte rozšírenie Vue DevTools do prehliadača
### Úvahy o výkone ### Výkonnostné úvahy
- Veľký počet preložených súborov (50+ jazykov) znamená, že úplné klony sú veľké - Veľké množstvo preložených súborov (50+ jazykov) znamená, že úplné klony sú veľké
- Použite plytký klon, ak pracujete iba na obsahu: `git clone --depth 1` - Používajte shallow clone, ak pracujete iba s obsahom: `git clone --depth 1`
- Vylúčte preklady z vyhľadávania pri práci na anglickom obsahu - Pri práci s anglickým obsahom vylúčte preklady z vyhľadávania
- Procesy zostavenia môžu byť pomalé pri prvom spustení (npm install, Vite build) - Build procesy môžu byť pri prvom spustení pomalé (npm install, Vite build)
## Úvahy o bezpečnosti ## Bezpečnostné upozornenia
### Premenné prostredia ### Environmentálne premenne
- API kľúče by nikdy nemali byť commitované do repozitára - API kľúče by nikdy nemali byť commitnuté do repozitára
- Používajte `.env` súbory (už v `.gitignore`) - Používajte `.env` súbory (už v `.gitignore`)
- Dokumentujte požadované premenné prostredia v README projektov - Dokumentujte potrebné environmentálne premenne v README projektov
### Python projekty ### Python projekty
- Používajte virtuálne prostredia: `python -m venv venv` - Používajte virtuálne prostredia: `python -m venv venv`
- Udržujte závislosti aktuálne - Udržiavajte závislosti aktualizované
- Tokeny GitHub by mali mať minimálne požadované povolenia - GitHub tokeny by mali mať minimálne potrebné povolenia
### Prístup k GitHub Models ### Prístup k GitHub Models
- Vyžadujú sa osobné prístupové tokeny (PAT) pre GitHub Models - Osobné prístupové tokeny (PAT) sú vyžadované pre GitHub Models
- Tokeny by mali byť uložené ako premenné prostredia - Tokeny by mali byť uložené ako environmentálne premenne
- Nikdy necommitujte tokeny alebo prihlasovacie údaje - Nikdy necommitujte tokeny alebo prihlasovacie údaje
## Ďalšie poznámky ## Dodatočné poznámky
### Cieľová skupina ### Cieľové publikum
- Úplní začiatočníci vo webovom vývoji - Úplní začiatočníci vo webovom vývoji
- Študenti a samouci - Študenti a samoukovia
- Učitelia používajúci kurikulum v triedach - Učitelia používajúci osnovu vo vyučovaní
- Obsah je navrhnutý pre prístupnosť a postupné budovanie zručností - Obsah navrhnutý pre prístupnosť a postupné budovanie zručností
### Vzdelávacia filozofia ### Vzdelávacia filozofia
- Prístup založený na projektoch - Projektovo orientované učenie
- Časté kontroly vedomostí (kvízy) - Časté kontroly poznatkov (kvízy)
- Praktické cvičenia kódovania - Praktické kódovacie cvičenia
- Príklady aplikácií z reálneho sveta - Príklady aplikácií z reálneho sveta
- Zameranie na základy pred frameworkami - Dôraz na základy pred frameworkmi
### Údržba repozitára ### Údržba úložiska
- Aktívna komunita študentov a prispievateľov - Aktívna komunita študentov a prispievateľov
- Pravidelné aktualizácie závislostí a obsahu - Pravidelné aktualizácie závislostí a obsahu
- Problémy a diskusie monitorované správcami - Issue a diskusie monitorované správcom
- Aktualizácie prekladov automatizované cez GitHub Actions - Aktualizácie prekladov automatizované cez GitHub Actions
### Súvisiace zdroje ### Súvisiace zdroje
- [Microsoft Learn moduly](https://docs.microsoft.com/learn/) - [Microsoft Learn moduly](https://docs.microsoft.com/learn/)
- [Študentské zdroje Hub](https://docs.microsoft.com/learn/student-hub/) - [Student Hub zdroje](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) odporúčaný pre študentov - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) odporúčaný pre študentov
- Ďalšie kurzy: Generatívna AI, Data Science, ML, IoT kurikulum dostupné - Ďalšie kurzy: Generatívna AI, Data Science, ML, IoT učebné osnovy dostupné
### Práca s konkrétnymi projektmi ### Práca s konkrétnymi projektmi
Pre podrobné pokyny k jednotlivým projektom si pozrite README súbory v: Pre podrobné inštrukcie k jednotlivým projektom si pozrite README súbory v:
- `quiz-app/README.md` - Aplikácia kvízov Vue 3 - `quiz-app/README.md` - Vue 3 quiz aplikácia
- `7-bank-project/README.md` - Banková aplikácia s autentifikáciou - `7-bank-project/README.md` - Banková aplikácia s autentifikáciou
- `5-browser-extension/README.md` - Vývoj rozšírenia prehliadača - `5-browser-extension/README.md` - Vývoj rozšírení prehliadača
- `6-space-game/README.md` - Vývoj hry na plátne - `6-space-game/README.md` - Vývoj hry založenej na Canvas
- `9-chat-project/README.md` - Projekt AI chatovacieho asistenta - `9-chat-project/README.md` - AI chat asistent projekt
### Štruktúra monorepo ### Štruktúra monorepa
Aj keď nejde o tradičné monorepo, tento repozitár obsahuje viacero nezávislých projektov: Aj keď nejde o tradičné monorepo, toto úložisko obsahuje niekoľko nezávislých projektov:
- Každá lekcia je samostatná - Každá lekcia je samostatná
- Projekty nezdieľajú závislosti - Projekty nezdieľajú závislosti
- Práca na jednotlivých projektoch bez ovplyvnenia ostatných - Pracujte na jednotlivých projektoch bez vplyvu na ostatné
- Naklonujte celý repozitár pre kompletný zážitok z kurikula - Naklonujte celé repozitárum pre kompletný zážitok z osnovy
--- ---
**Upozornenie**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
Tento dokument bol preložený pomocou služby AI prekladu [Co-op Translator](https://github.com/Azure/co-op-translator). Hoci sa snažíme o presnosť, prosím, berte na vedomie, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Pôvodný dokument v jeho rodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Nenesieme zodpovednosť za akékoľvek nedorozumenia alebo nesprávne interpretácie vyplývajúce z použitia tohto prekladu. **Vymedzenie zodpovednosti**:
Tento dokument bol preložený pomocou AI prekladateľskej služby [Co-op Translator](https://github.com/Azure/co-op-translator). Hoci sa snažíme zabezpečiť presnosť, majte prosím na pamäti, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Originálny dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Za akékoľvek nedorozumenia alebo nesprávne interpretácie vyplývajúce z použitia tohto prekladu nenesieme zodpovednosť.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

251
translations/sk/README.md
Unescape View File

@ -1,121 +1,100 @@
[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) # Webový vývoj pre začiatočníkov - učebný plán
[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) Naučte sa základy webového vývoja s naším komplexným 12-týždňovým kurzom od Microsoft Cloud Advocates. Každá z 24 lekcií sa zameriava na JavaScript, CSS a HTML prostredníctvom praktických projektov ako teráriá, rozšírenia pre prehliadače a vesmírne hry. Zapojte sa do kvízov, diskusií a praktických úloh. Zlepšite svoje zručnosti a optimalizujte si zapamätanie vedomostí pomocou našej efektívnej projektovo orientovanej pedagogiky. Začnite svoju cestu kódovania už dnes!
[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) Pridajte sa do komunity Azure AI Foundry na Discorde
# Webový vývoj pre začiatočníkov - kurikulum
Naučte sa základy webového vývoja s naším 12-týždňovým komplexným kurzom od Microsoft Cloud Advocates. Každá z 24 lekcií sa venuje JavaScriptu, CSS a HTML prostredníctvom praktických projektov, ako sú teráriá, rozšírenia prehliadača a vesmírne hry. Zapojte sa do kvízov, diskusií a praktických úloh. Zlepšite svoje zručnosti a optimalizujte si uchovávanie informácií pomocou našej efektívnej projektovej metodiky. Začnite svoju cestu kódovania ešte dnes!
Pripojte sa ku komunite Azure AI Foundry na Discorde
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Postupujte podľa týchto krokov, aby ste mohli začať využívať tieto zdroje: Nasledujte tieto kroky, aby ste mohli začať používať tieto zdroje:
1. **Vytvorte si fork repozitára**: Kliknite na [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Vytvorte fork repozitára**: Kliknite na [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Naklonujte repozitár**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Naklonujte repozitár**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Pripojte sa ku komunite Azure AI Foundry na Discorde a spoznajte expertov a ďalších vývojárov**](https://discord.com/invite/ByRwuEEgH4) 3. [**Pridajte sa do Azure AI Foundry Discordu a stretnite expertov a ďalších vývojárov**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Podpora viacerých jazykov ### 🌐 Podpora viacerých jazykov
#### Podporované cez GitHub Action (automatické a vždy aktuálne) #### Podporované cez GitHub Action (automatizované a vždy aktuálne)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabčina](../ar/README.md) | [Bengálčina](../bn/README.md) | [Bulharčina](../bg/README.md) | [Barmský (Myanmar)](../my/README.md) | [Čínština (zjednodušená)](../zh-CN/README.md) | [Čínština (tradičná, Hong Kong)](../zh-HK/README.md) | [Čínština (tradičná, Macao)](../zh-MO/README.md) | [Čínština (tradičná, Taiwan)](../zh-TW/README.md) | [Chorvátčina](../hr/README.md) | [Čeština](../cs/README.md) | [Dánčina](../da/README.md) | [Holandčina](../nl/README.md) | [Estónčina](../et/README.md) | [Fínčina](../fi/README.md) | [Francúzština](../fr/README.md) | [Nemčina](../de/README.md) | [Gréčtina](../el/README.md) | [Hebrejčina](../he/README.md) | [Hindčina](../hi/README.md) | [Maďarčina](../hu/README.md) | [Indonézština](../id/README.md) | [Taliančina](../it/README.md) | [Japončina](../ja/README.md) | [Kannadčina](../kn/README.md) | [Kórejčina](../ko/README.md) | [Litovčina](../lt/README.md) | [Malajčina](../ms/README.md) | [Malayalam](../ml/README.md) | [Maráthčina](../mr/README.md) | [Nepálčina](../ne/README.md) | [Nigérijská pidžinčina](../pcm/README.md) | [Nórčina](../no/README.md) | [Perzština (Farsi)](../fa/README.md) | [Poľština](../pl/README.md) | [Portugalčina (Brazília)](../pt-BR/README.md) | [Portugalčina (Portugalsko)](../pt-PT/README.md) | [Pandžábčina (Gurmukhi)](../pa/README.md) | [Rumunčina](../ro/README.md) | [Ruština](../ru/README.md) | [Srbčina (cyrilika)](../sr/README.md) | [Slovenčina](./README.md) | [Slovinčina](../sl/README.md) | [Španielčina](../es/README.md) | [Svahilčina](../sw/README.md) | [Švédčina](../sv/README.md) | [Tagalog (Filipínčina)](../tl/README.md) | [Tamilčina](../ta/README.md) | [Telugčina](../te/README.md) | [Tajčina](../th/README.md) | [Turečtina](../tr/README.md) | [Ukrajinčina](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamčina](../vi/README.md)
> **Uprednostňujete lokálne klonovanie?** > **Uprednostňujete lokálne klonovanie?**
> Tento repozitár obsahuje viac ako 50 jazykových prekladov, čo výrazne zvyšuje veľkosť stiahnutia. Ak chcete klonovať bez prekladov, použite sparse checkout: > Tento repozitár obsahuje viac ako 50 jazykových prekladov, čo výrazne zvyšuje veľkosť sťahovania. Ak chcete klonovať bez prekladov, použite sparse checkout:
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> Toto vám poskytne všetko potrebné na dokončenie kurzu s rýchlejším sťahovaním. > Tým získate všetko, čo potrebujete na absolvovanie kurzu s oveľa rýchlejším sťahovaním.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ak si prajete podporu ďalších jazykov, podporované jazyky sú uvedené [tu](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Otvoriť vo Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Otvoriť%20vo%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) **Ak chcete, aby boli podporované ďalšie jazyky prekladov, nájdete ich [tu](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
#### 🧑‍🎓 _Ste študent?_ #### 🧑‍🎓 _Ste študent?_
Navštívte [**stránku Študentské centrum**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde nájdete zdroje pre začiatočníkov, študentské balíčky a dokonca aj spôsoby, ako získať voucher na bezplatný certifikát. Toto je stránka, ktorú chcete uložiť medzi záložky a občas ju skontrolovať, pretože obsah sa mesačne aktualizuje. Navštívte [**študentskú stránku**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde nájdete zdroje pre začiatočníkov, študentské balíčky a dokonca spôsoby, ako získať bezplatný certifikát. Toto je stránka, ktorú si chcete uložiť do záložiek a občas si ju pozrieť, pretože obsah sa mení každý mesiac.
### 📣 Oznámenie – Nové výzvy režimu GitHub Copilot Agent na dokončenie! ### 📣 Oznámenie - nové výzvy režimu GitHub Copilot Agent na dokončenie!
Pridaná nová výzva, hľadajte "GitHub Copilot Agent Challenge 🚀" v väčšine kapitol. Je to nová výzva na dokončenie pomocou GitHub Copilot a Agent režimu. Ak ste režim Agent ešte nepoužili, umožňuje nielen generovať text, ale tiež vytvárať a upravovať súbory, spúšťať príkazy a viac. Pridaná nová výzva, hľadajte "GitHub Copilot Agent Challenge 🚀" v najväčšine kapitol. To je nová výzva na dokončenie pomocou GitHub Copilot a režimu Agent. Ak ste režim Agent ešte nepoužili, dokáže nielen generovať text, ale aj vytvárať a upravovať súbory, spúšťať príkazy a ďalšie.
### 📣 Oznámenie – _Nový projekt na vývoj pomocou Generatívnej AI_ ### 📣 Oznámenie - _nový projekt na vybudovanie pomocou generatívnej AI_
Práve pridaný nový projekt AI asistenta, pozrite si [projekt](./9-chat-project/README.md) Práve bol pridaný nový projekt AI asistenta, pozrite si [projekt](./9-chat-project/README.md)
### 📣 Oznámenie – _Nové kurikulum_ o Generatívnej AI pre JavaScript bolo práve vydané ### 📣 Oznámenie - _nový učebný plán_ o generatívnej AI pre JavaScript práve vydaný
Nezmeškajte naše nové kurikulum o Generatívnej AI! Nezmeškajte náš nový učebný plán o generatívnej AI!
Navštívte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začnite! Navštívte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), aby ste mohli začať!
![Pozadie](../../translated_images/sk/background.148a8d43afde5730.webp) ![Background](../../translated_images/sk/background.148a8d43afde5730.webp)
- Lekcie pokrývajú všetko od základov po RAG. - Lekcie pokrývajú všetko od základov po RAG.
- Komunikujte s historickými postavami pomocou GenAI a našej doplnkovej aplikácie. - Interagujte s historickými postavami pomocou GenAI a našej doplnkovej aplikácie.
- Zábavné a pútavé rozprávanie, cestovanie v čase! - Zábavný a pútavý príbeh, budete cestovať časom!
![postava](../../translated_images/sk/character.5c0dd8e067ffd693.webp)
![character](../../translated_images/sk/character.5c0dd8e067ffd693.webp)
Každá lekcia obsahuje úlohu na dokončenie, kontrolu vedomostí a výzvu, ktoré vás prevedú témami ako: Každá lekcia obsahuje úlohu na dokončenie, kontrolu vedomostí a výzvu, ktoré vás prevedú témami ako:
- Zadávanie požiadaviek a návrh promptov (prompt engineering) - Promptovanie a prompt engineering
- Generovanie textových a obrazových aplikácií - Generovanie textových a obrazových aplikácií
- Aplikácie na vyhľadávanie - Vyhľadávacie aplikácie
Navštívte [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) a začnite! Navštívte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), aby ste mohli začať!
## 🌱 Začíname ## 🌱 Začíname
> **Učitelia**, poskytli sme [niekoľko návrhov](for-teachers.md), ako používať toto kurikulum. Radi vám poskytneme spätnú väzbu [v našom diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Učitelia**, pridali sme [niekoľko návrhov](for-teachers.md), ako používať tento učebný plán. Radi uvítame vaše pripomienky [v našom diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Študenti](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pri každej lekcii začnite prednáškovým kvízom a pokračujte čítaním prednáškového materiálu, dokončovaním rôznych aktivít a overte si pochopenie pomocou kvízu po prednáške. **[Študenti](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pre každú lekciu začnite kvízom pred prednáškou, pokračujte čítaním prednáškového materiálu, dokončite rôzne aktivity a overte si svoje porozumenie pomocou kvízu po prednáške.
Pre lepší zážitok z učenia sa spojte so svojimi rovesníkmi a pracujte na projektoch spoločne! Diskusie povzbudzujeme v našom [diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde vám náš tím moderátorov bude k dispozícii na zodpovedanie otázok. Pre zlepšenie vášho učenia sa spojte so svojimi rovesníkmi a pracujte spoločne na projektoch! Diskusie sú vítané v našom [diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde vám bude k dispozícii náš tím moderátorov na zodpovedanie otázok.
Na ďalšie vzdelávanie dôrazne odporúčame preskúmať [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) pre doplnkové študijné materiály. Pre rozšírenie vašich vedomostí dôrazne odporúčame preskúmať [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) pre ďalšie študijné materiály.
### 📋 Nastavenie vášho prostredia ### 📋 Nastavenie vášho prostredia
Toto kurikulum má pripravené vývojové prostredie! Keď začnete, môžete si vybrať spustenie kurikula v [Codespace](https://github.com/features/codespaces/) (_prostredie v prehliadači bez nutnosti inštalácie_) alebo lokálne na vašom počítači pomocou textového editora ako je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Tento učebný plán má pripravené vývojové prostredie! Keď začnete, môžete si vybrať spustenie kurzu v [Codespace](https://github.com/features/codespaces/) (_prostredie v prehliadači, ktoré nevyžaduje inštaláciu_), alebo lokálne na vašom počítači pomocou textového editora ako [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Vytvorte si svoj repozitár #### Vytvorte si svoj repozitár
Aby ste si mohli jednoducho ukladať svoju prácu, odporúča sa vytvoriť si vlastnú kópiu tohto repozitára. Môžete to urobiť kliknutím na tlačidlo **Use this template** v hornej časti stránky. Týmto sa vytvorí nový repozitár vo vašom GitHub účte s kópiou kurikula. Pre jednoduché uloženie vašej práce sa odporúča vytvoriť si vlastnú kópiu tohto repozitára. Môžete to urobiť kliknutím na tlačidlo **Použiť túto šablónu** v hornej časti stránky. Tým sa vytvorí nový repozitár vo vašom GitHub účte s kópiou učebného plánu.
Postupujte podľa týchto krokov: Postupujte podľa týchto krokov:
1. **Vytvorte fork repozitára**: Kliknite na tlačidlo „Fork“ v pravom hornom rohu tejto stránky. 1. **Vytvorte fork repozitára**: Kliknite na tlačidlo "Fork" v pravom hornom rohu tejto stránky.
2. **Naklonujte repozitár**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Naklonujte repozitár**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Spustenie kurikula v Codespace #### Spustenie kurzu v Codespace
Vo vašej kópii repozitára, ktorú ste vytvorili, kliknite na tlačidlo **Code** a vyberte **Open with Codespaces**. Týmto sa vytvorí nový Codespace, v ktorom môžete pracovať. Vo vašej kópii repozitára, ktorú ste vytvorili, kliknite na tlačidlo **Code** a vyberte **Open with Codespaces**. Tým sa pre vás vytvorí nový Codespace na prácu.
![Codespace](../../translated_images/sk/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/sk/createcodespace.0238bbf4d7a8d955.webp)
#### Spustenie kurikula lokálne na vašom počítači #### Spustenie kurzu lokálne na vašom počítači
Na lokálne spustenie kurikula budete potrebovať textový editor, prehliadač a príkazový riadok. Naša prvá lekcia, [Úvod do programovacích jazykov a nástrojov](../../1-getting-started-lessons/1-intro-to-programming-languages), vás prevedie rôznymi možnosťami pre každý z týchto nástrojov, aby ste si mohli vybrať to, čo vám najviac vyhovuje. Na spustenie tohto kurzu lokálne potrebujete textový editor, prehliadač a nástroj príkazového riadka. Naša prvá lekcia, [Úvod do programovacích jazykov a nástrojov remesla](../../1-getting-started-lessons/1-intro-to-programming-languages), vás prevedie rôznymi možnosťami pre každý z týchto nástrojov, aby ste si vybrali, čo vám najviac vyhovuje.
Odporúčame použiť [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ako editor, ktorý má aj zabudovaný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code môžete stiahnuť [tu](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Odporúčame použiť [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ako editor, ktorý má tiež zabudovaný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code si môžete stiahnuť [tu](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Naklonujte si repozitár do vášho počítača. Môžete to urobiť kliknutím na tlačidlo **Code** a skopírovaním URL: 1. Naklonujte svoj repozitár do počítača. Môžete to urobiť kliknutím na tlačidlo **Code** a skopírovaním URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Potom otvorte [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) vo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) a spustite nasledujúci príkaz, pričom `<your-repository-url>` nahraďte URL, ktorú ste práve skopírovali: Potom otvorte [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) vo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) a spustite nasledujúci príkaz, pričom `<your-repository-url>` nahraďte URL, ktorú ste práve skopírovali:
@ -124,148 +103,148 @@ Potom otvorte [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Otvorte priečinok vo Visual Studio Code. Urobíte to kliknutím na **Súbor** > **Otvoriť priečinok** a výberom priečinka, ktorý ste práve sklonovali. 2. Otvorte priečinok vo Visual Studio Code. Môžete to urobiť kliknutím na **Súbor** > **Otvoriť priečinok** a vybratím priečinka, ktorý ste práve naklonovali.
> Odporúčané rozšírenia Visual Studio Code: > Odporúčané rozšírenia Visual Studio Code:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - pre náhľad HTML stránok priamo vo Visual Studio Code > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - na náhľad HTML stránok priamo vo Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - pre pomoc pri rýchlejšom písaní kódu > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - na pomoc pri rýchlejšom písaní kódu
## 📂 Každá lekcia obsahuje: ## 📂 Každá lekcia obsahuje:
- voliteľnú sketchnotu - voliteľnú sketchnotku
- voliteľné doplnkové video - voliteľné doplnkové video
- kvíz pred lekciou na rozcvičenie - rozcvičku pred lekciou formou kvízu
- písanú lekciu - napísanú lekciu
- pri lekciách založených na projektoch, krok za krokom návody ako projekt vytvoriť - pre projektové lekcie krok za krokom návody, ako projekt vybudovať
- overenie vedomostí - kontroly vedomostí
- výzvu - výzvu
- doplnkové čítanie - doplnkové čítanie
- zadanie úlohy - zadanie
- [kvíz po lekcii](https://ff-quizzes.netlify.app/web/) - [kvíz po lekcii](https://ff-quizzes.netlify.app/web/)
> **Poznámka k kvízom**: Všetky kvízy sú uložené v priečinku Quiz-app, celkovo 48 kvízov s tromi otázkami v každom. Sú dostupné [tu](https://ff-quizzes.netlify.app/web/), aplikáciu kvízov môžete spustiť lokálne alebo nasadiť do Azure; postupujte podľa pokynov v priečinku `quiz-app`. > **Poznámka o kvízoch**: Všetky kvízy sú obsiahnuté v priečinku Quiz-app, celkovo 48 kvízov po troch otázkach. Nájdete ich [tu](https://ff-quizzes.netlify.app/web/). Kvízová aplikácia môže byť spustená lokálne alebo nasadená na Azure; postupujte podľa inštrukcií v priečinku `quiz-app`.
## 🗃️ Lekcie ## 🗃️ Lekcie
| | Názov projektu | Výučbové koncepty | Výučbové ciele | Prepojená lekcia | Autor | | | Názov projektu | Prebrané koncepty | Ciele učenia | Prepojená lekcia | Autor |
| :-: | :-------------------------------------------------------: | :---------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :---------------------------------------------------------: | :-----------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Začíname | Úvod do programovania a nástroje remesla | Naučiť sa základné princípy väčšiny programovacích jazykov a o softvéri, ktorý pomáha profesionálnym vývojárom v ich práci | [Úvod do programovacích jazykov a nástrojov remesla](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Začíname | Úvod do programovania a nástroje remesla | Naučte sa základné princípy väčšiny programovacích jazykov a o softvéri pomáhajúcom profesionálnym vývojárom | [Úvod do programovacích jazykov a nástrojov remesla](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Začíname | Základy GitHub, vrátane práce v tíme | Ako používať GitHub vo svojom projekte, ako spolupracovať s ostatnými na zdrojovom kóde | [Úvod do GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Začíname | Základy GitHub, vrátane práce v tíme | Ako používať GitHub vo vašom projekte, ako spolupracovať s ostatnými na kóde | [Úvod do GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Začíname | Prístupnosť | Naučiť sa základy webovej prístupnosti | [Základy prístupnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Začíname | Prístupnosť | Naučte sa základy prístupnosti na webe | [Základy prístupnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Základy JS | Dátové typy JavaScriptu | Základy dátových typov v JavaScripte | [Dátové typy](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | Základy JS | Dátové typy JavaScriptu | Základy dátových typov v JavaScripte | [Dátové typy](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Základy JS | Funkcie a metódy | Naučiť sa o funkciách a metódach na riadenie logiky aplikácie | [Funkcie a metódy](./2-js-basics/2-functions-methods/README.md) | Jasmine a Christopher | | 05 | Základy JS | Funkcie a metódy | Naučte sa o funkciách a metódach na riadenie logiky aplikácie | [Funkcie a metódy](./2-js-basics/2-functions-methods/README.md) | Jasmine a Christopher |
| 06 | Základy JS | Rozhodovanie v JS | Naučiť sa vytvárať podmienky v kóde pomocou rozhodovacích metód | [Rozhodovanie](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | Základy JS | Rozhodovanie v JS | Naučte sa, ako vytvárať podmienky vo vašom kóde pomocou rozhodovacích metód | [Rozhodovanie](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Základy JS | Polia a cykly | Pracovať s dátami pomocou polí a cyklov v JavaScripte | [Polia a cykly](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | Základy JS | Polia a cykly | Práca s dátami pomocou polí a cyklov v JavaScripte | [Polia a cykly](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terárium](./3-terrarium/solution/README.md) | HTML v praxi | Vytvoriť HTML pre online terárium, so zameraním na tvorbu rozloženia | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML v praxi | Postavte HTML pre online terrárium, zamerané na tvorbu rozloženia stránky | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terárium](./3-terrarium/solution/README.md) | CSS v praxi | Vytvoriť CSS na štýlovanie online terária, so zameraním na základy CSS vrátane responzívneho dizajnu | [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrárium](./3-terrarium/solution/README.md) | CSS v praxi | Postavte CSS na štýlovanie online terrária, zamerajte sa na základy CSS vrátane responzívneho dizajnu | [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terárium](./3-terrarium/solution/README.md) | JavaScript Closures, manipulácia s DOM | Vytvoriť JavaScript pre funkciu terária ako drag & drop rozhranie, so zameraním na closures a manipuláciu s DOM | [JavaScript Closures, manipulácia s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScript Closure, manipulácia s DOM | Vybudujte JavaScript, ktorý umožní drag/drop rozhranie terrária, zamerajte sa na closure a manipuláciu s DOM | [JavaScript Closure, manipulácia s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Hra na písanie](./4-typing-game/solution/README.md) | Vytvoriť hru na písanie | Naučiť sa používať klávesové udalosti na riadenie logiky JavaScript aplikácie | [Programovanie riadené udalosťami](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Hra na písanie](./4-typing-game/solution/README.md) | Vytvorenie hry na písanie | Naučte sa používať udalosti klávesnice na riadenie logiky JavaScriptovej aplikácie | [Programovanie riadené udalosťami](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Práca s prehliadačmi | Naučiť sa ako prehliadače fungujú, ich históriu a ako vytvoriť prvé prvky rozšírenia prehliadača | [O prehliadačoch](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Práca s prehliadačmi | Naučte sa, ako fungujú prehliadače, ich históriu a ako vytvoriť základy rozšírenia prehliadača | [O prehliadačoch](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Vytváranie formulára, volanie API a ukladanie premenných do lokálneho úložiska | Vytvoriť JavaScriptové prvky vášho rozšírenia prehliadača na volanie API pomocou premenných uložených v lokálnom úložisku | [API, formuláre a lokálne úložisko](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Vytváranie formulára, volanie API a ukladanie premenných | Vytvorte JavaScriptové prvky rozšírenia prehliadača, ktoré volajú API a používajú premenné uložené v lokálnom úložisku | [API, formuláre a lokálne úložisko](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Procesy na pozadí v prehliadači, webový výkon | Použiť procesy na pozadí pre správu ikony rozšírenia; naučiť sa o webovom výkone a optimalizáciách | [Úlohy na pozadí a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Pozadie procesov v prehliadači, webový výkon | Použite pozadné procesy prehliadača na správu ikony rozšírenia; naučte sa o webovom výkone a optimalizáciách | [Pozadné úlohy a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Pokročilejší vývoj hier v JavaScripte | Naučiť sa o dedičnosti pomocou tried a kompozície a o vzore Pub/Sub, príprava na tvorbu hry | [Úvod do pokročilého vývoja hier](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Pokročilejšie vývoj hier v JavaScripte | Naučte sa o dedičnosti cez triedy aj kompozíciu a o vzore Pub/Sub, v príprave na vytvorenie hry | [Úvod do pokročilého vývoja hier](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Kreslenie na plátno | Naučiť sa o Canvas API, ktoré sa používa na kreslenie prvkov na obrazovku | [Kreslenie na plátno](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Kreslenie na canvas | Naučte sa o Canvas API, ktoré sa používa na kreslenie prvkov na obrazovku | [Kreslenie na Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Pohyb prvkov po obrazovke | Objaviť, ako prvky môžu získať pohyb pomocou kartézskych súradníc a Canvas API | [Pohyb prvkov](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Pohyb prvkov na obrazovke | Objavte, ako môžu prvky získať pohyb pomocou kartézskych súradníc a Canvas API | [Pohyb prvkov](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Detekcia kolízií | Spraviť, aby sa prvky zrazili a reagovali navzájom pri stláčaní klávesov, zabezpečiť cooldown funkciu pre výkon hry | [Detekcia kolízií](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Detekcia kolízií | Urobte, aby sa prvky zrážali a reagovali navzájom pomocou stlačení klávesov; pridajte cooldown funkciu na zabezpečenie výkonu | [Detekcia kolízií](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Skladanie bodov | Vykonávať matematické výpočty na základe stavu a výkonu hry | [Skladanie bodov](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Udržiavanie skóre | Vykonávajte matematické výpočty na základe stavu a výkonu hry | [Udržiavanie skóre](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Ukončenie a reštart hry | Naučiť sa, ako hru ukončiť a reštartovať, vrátane čistenia zdrojov a resetovania hodnôt premenných | [Podmienka ukončenia](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Hra vo vesmíre](./6-space-game/solution/README.md) | Ukončenie a reštart hry | Naučte sa o ukončení a reštartovaní hry vrátane čistenia zdrojov a resetovania premenných | [Podmienka ukončenia](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banková aplikácia](./7-bank-project/solution/README.md) | HTML šablóny a routy vo webovej aplikácii | Naučiť sa vytvoriť kostru architektúry multipage webu pomocou routovania a HTML šablón | [HTML šablóny a routy](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Banková aplikácia](./7-bank-project/solution/README.md) | HTML šablóny a trasy vo webovej aplikácii | Naučte sa vytvoriť kostru viacstránkovej webovej architektúry pomocou routovania a HTML šablón | [HTML šablóny a trasy](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banková aplikácia](./7-bank-project/solution/README.md) | Vytvorenie prihlasovacieho a registračného formulára | Naučiť sa o tvorbe formulárov a riešení validácie | [Formuláre](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Banková aplikácia](./7-bank-project/solution/README.md) | Vytvorenie prihlasovacieho a registračného formulára | Naučte sa vytvárať formuláre a spracovávať validačné rutiny | [Formuláre](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banková aplikácia](./7-bank-project/solution/README.md) | Spôsoby získavania a používania dát | Ako dáta prichádzajú do aplikácie a odchádzajú z nej, ako ich získavať, ukladať a likvidovať | [Dáta](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banková aplikácia](./7-bank-project/solution/README.md) | Spôsoby získavania a využívania dát | Ako do vašej aplikácie vstupujú a z nej vychádzajú dáta, ako ich získavať, ukladať a likvidovať | [Dáta](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banková aplikácia](./7-bank-project/solution/README.md) | Koncepty správy stavu | Naučiť sa, ako si aplikácia udržiava stav a ako ho programovo spravovať | [Správa stavu](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banková aplikácia](./7-bank-project/solution/README.md) | Koncepty správy stavu | Naučte sa, ako si vaša aplikácia udržiava stav a ako s ním manažovať programovo | [Správa stavu](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Kód prehliadača/VScode](../../8-code-editor) | Práca s VScode | Naučiť sa používať kódový editor| [Používanie VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Kód prehliadača/VScode](../../8-code-editor) | Práca s VScode | Naučte sa používať editor kódu | [Použitie VScode Editora](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI asistenti](./9-chat-project/README.md) | Práca s AI | Naučiť sa vytvoriť vlastného AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris | | 26 | [AI asistenti](./9-chat-project/README.md) | Práca s AI | Naučte sa vytvoriť vlastného AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris |
## 🏫 Pedagógia ## 🏫 Pedagógia
Náš učebný plán je navrhnutý s dvoma kľúčovými pedagogickými princípmi: Náš učebný plán je navrhnutý s ohľadom na dve kľúčové pedagogické princípy:
* učenie založené na projektoch * učenie založené na projektoch
* časté kvízy * časté kvízy
Program vyučuje základy JavaScriptu, HTML a CSS, ako aj najnovšie nástroje a techniky používané dnešnými webovými vývojármi. Študenti budú mať príležitosť získať praktické skúsenosti vytvorením hry na písanie, virtuálneho terária, ekologicky priateľského rozšírenia prehliadača, hry vo vesmírnom štýle a bankovej aplikácie pre firmy. Na konci série budú mať študenti pevné pochopenie webového vývoja. Program učí základy JavaScriptu, HTML a CSS, ako aj najnovšie nástroje a techniky používané dnešnými webovými vývojármi. Študenti budú mať možnosť získať praktické skúsenosti tvorbou hry na písanie, virtuálneho terrária, ekologického rozšírenia prehliadača, hry typu space invaders a bankovej aplikácie pre podniky. Na konci série získajú študenti pevné základy vo webovom vývoji.
> 🎓 Prvé lekcie v tomto kurikule si môžete zobrať ako [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn! > 🎓 Môžete absolvovať prvé lekcie tohto učebného plánu ako [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
Zabezpečením, že obsah je zosúladený s projektmi, sa proces pre študentov stáva zábavnejším a zlepšuje sa zapamätateľnosť konceptov. Tiež sme napísali niekoľko úvodných lekcií v základoch JavaScriptu, ktoré predstavujú koncepty, spolu s videom z kolekcie „[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)“, ktorého niektorí autori prispeli do tohto kurikula. Zaradením obsahu do projektov sa celý proces stáva pre študentov atraktívnejším a zvyšuje sa udržanie naučených konceptov. Tiež sme pripravili niekoľko úvodných lekcií o základoch JavaScriptu, ktoré vysvetľujú koncepty, doplnených videom z kolekcie "[Séria pre začiatočníkov: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", ktorých niektorí autori prispeli k tomuto učebnému plánu.
Okrem toho, nízko náročný kvíz pred triedou nastavuje študentovi cieľ naučiť sa danú tému, zatiaľ čo druhý kvíz po hodine zabezpečuje ďalšie upevnenie vedomostí. Tento učebný plán bol navrhnutý tak, aby bol flexibilný a zábavný a môžete ho absolvovať celý alebo čiastočne. Projekty začínajú jednoduché a postupne sa stávajú zložitejšími počas 12-týždňového cyklu. Okrem toho nízko-stresový kvíz pred vyučovaním nastaví študentovi zámer učiť sa tému, zatiaľ čo druhý kvíz po vyučovaní zabezpečuje ďalšie upevnenie vedomostí. Tento učebný plán bol navrhnutý tak, aby bol flexibilný a zábavný, a dá sa absolvovať celý alebo čiastočne. Projekty začínajú malé a na konci 12-týždňového cyklu sú čoraz zložitejšie.
Hoci sme zámerne vynechali zavádzanie JavaScript frameworkov, aby sme sa sústredili na základné zručnosti potrebné pre webového vývojára pred prijatím frameworku, ďalším dobrým krokom po dokončení tohto kurikula je naučiť sa o Node.js cez inú kolekciu videí: „[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)“. Aj keď sme zámerne vynechali zavedenie JavaScriptových frameworkov, aby sme sa sústredili na základné zručnosti potrebné ako webový vývojár pred osvojením frameworku, ďalším dobrým krokom po dokončení tohto učebného plánu je naučiť sa o Node.js pomocou ďalšej video kolekcie: "[Séria pre začiatočníkov: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Navštívte náš [Kódex správania](CODE_OF_CONDUCT.md) a [Príspevky](CONTRIBUTING.md). Radi prijímame vaše konštruktívne pripomienky! > Navštívte naše [Pravidlá správania](CODE_OF_CONDUCT.md) a pokyny k [Príspevkom](CONTRIBUTING.md). Vaša konštruktívna spätná väzba je vítaná!
## 🧭 Prístup offline ## 🧭 Offline prístup
Túto dokumentáciu môžete používať offline pomocou [Docsify](https://docsify.js.org/#/). Forknite tento repozitár, [nainštalujte Docsify](https://docsify.js.org/#/quickstart) na svoj lokálny počítač a potom v koreňovom priečinku tohto repozitára zadajte príkaz `docsify serve`. Webstránka bude dostupná na porte 3000 na localhoste: `localhost:3000`. Túto dokumentáciu môžete spustiť offline pomocou [Docsify](https://docsify.js.org/#/). Vytvorte si fork tohoto repozitára, [nainštalujte Docsify](https://docsify.js.org/#/quickstart) na svoj lokálny stroj a potom v koreňovom priečinku tohto repozitára zadajte príkaz `docsify serve`. Webová stránka bude dostupná na porte 3000 na localhoste: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF všetkých lekcií nájdete [tu](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). PDF so všetkými lekciami nájdete [tu](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Ďalšie kurzy ## 🎒 Ďalšie kurzy
Náš tím vytvára aj ďalšie kurzy! Pozrite si: Náš tím vytvára aj iné kurzy! Pozrite sa na:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j pre začiatočníkov](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js pre začiatočníkov](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain pre začiatočníkov](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Agents ### Azure / Edge / MCP / Agentúry
[![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![AZD pre začiatočníkov](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI pre začiatočníkov](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP pre začiatočníkov](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI Agents for Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) [![AI Agentúry pre začiatočníkov](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Generatívna AI séria ### Generatívna AI séria
[![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generatívna AI pre začiatočníkov](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generatívna AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) [![Generatívna AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[![Generative AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) [![Generatívna AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
--- ---
### Základné učenie ### Základné učenie
[![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![ML pre začiatočníkov](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Dátová veda pre začiatočníkov](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI pre začiatočníkov](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Cybersecurity for Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Kyberbezpečnosť pre začiatočníkov](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Web Dev for Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Webový vývoj pre začiatočníkov](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT for Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT pre začiatočníkov](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![XR Development for Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR vývoj pre začiatočníkov](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Copilot séria ### Copilot séria
[![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot pre AI párované programovanie](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot pre C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot dobrodružstvo](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Získanie pomoci ## Získanie pomoci
Ak sa zaseknete alebo máte otázky o tvorbe AI aplikácií. Pridajte sa k ostatným študentom a skúseným vývojárom v diskusiách o MCP. Je to podporná komunita, kde sú otázky vítané a znalosti sa slobodne zdieľajú. Ak sa zaseknete alebo máte akékoľvek otázky ohľadom tvorby AI aplikácií, pripojte sa ku komunite študentov a skúsených vývojárov k diskusiám o MCP. Je to podporná komunita, kde sú otázky vítané a zdieľanie vedomostí je voľné.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Ak máte spätnú väzbu k produktu alebo narazíte na chyby počas vývoja, navštívte: Ak máte spätnú väzbu k produktu alebo ste narazili na chyby počas vývoja, navštívte:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
## Licencia ## Licencia
Tento repozitár je licencovaný pod licenciou MIT. Viac informácií nájdete v súbore [LICENSE](../../LICENSE). Tento repozitár je licencovaný pod licenciou MIT. Pre viac informácií pozrite súbor [LICENSE](../../LICENSE).
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Upozornenie**: **Výhrada**:
Tento dokument bol preložený pomocou AI prekladateľskej služby [Co-op Translator](https://github.com/Azure/co-op-translator). Aj keď sa snažíme o presnosť, berte na vedomie, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Originálny dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Nezodpovedáme za akékoľvek nedorozumenia alebo nesprávne výklady vyplývajúce z použitia tohto prekladu. Tento dokument bol preložený pomocou AI prekladateľskej služby [Co-op Translator](https://github.com/Azure/co-op-translator). Hoci sa snažíme o presnosť, uvedomte si, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Pôvodný dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Nie sme zodpovední za žiadne nedorozumenia alebo nesprávne interpretácie vyplývajúce z použitia tohto prekladu.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

53
translations/sk/Roadmap.md
Unescape View File

@ -0,0 +1,53 @@
# Plán vývoja pre repozitár Web-Dev-For-Beginners od Microsoftu
**Tento repozitár poskytuje plán na učenie základov webového vývoja so zameraním na JavaScript, HTML a CSS. Učebný plán je flexibilný a môžete ho absolvovať celý alebo čiastočne, pozostáva zo 24 lekcií rozložených na 12 týždňov.**
## Kľúčové míľniky
* **Týždne 1-3:**
* Úvod do programovacích jazykov a nástrojov remesla
* Základy GitHubu
* Prístupnosť
* Základy JS: dátové typy, funkcie a metódy
* Rozhodovanie v JS
* **Týždne 4-6:**
* Polia a slučky
* Terrárium: HTML v praxi
* CSS v praxi
* Uzávierky v JavaScripte
* Manipulácia s DOM
* **Týždne 7-9:**
* Hra na písanie: Programovanie riadené udalosťami
* Zelené rozšírenie prehliadača: Práca s prehliadačmi
* Tvorba formulára, volanie API a ukladanie premenných do miestneho úložiska
* Pozadie procesov v prehliadači
* Výkon webu
* **Týždne 10-12:**
* Hra v priestore: Pokročilejší vývoj hier v JavaScripte
* Kreslenie na plátno
* Pohyb prvkov po obrazovke
* Detekcia kolízií
* Sčítanie bodov, ukončenie a reštart hry
* Banková aplikácia: HTML šablóny a trasy vo webovej aplikácii
* Tvorba prihlásenia a registračného formulára
* Spôsoby získavania a používania dát
* Koncepty správy stavu
## Výsledky učenia
**Úspešným absolvovaním tohto plánu získajú študenti praktické skúsenosti s tvorbou hry na písanie, virtuálneho terária, ekologického rozšírenia prehliadača, hry v štýle útočníka z vesmíru a bankovej aplikácie pre firmy. Taktiež si vybudujú pevné základy webového vývoja.**
## Ďalšie zdroje
* Tento repozitár poskytuje množstvo zdrojov na ďalšie učenie, vrátane tutoriálov, príkladov kódu a výziev.
* Platforma Microsoft Learn ponúka rôzne kurzy a vzdelávacie cesty v oblasti webového vývoja.
* Online komunity ako Stack Overflow a MDN Web Docs poskytujú cennú podporu a zdroje pre webových vývojárov.
**Dúfam, že vám tento plán pomôže na vašej ceste vo webovom vývoji!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Upozornenie**:
Tento dokument bol preložený pomocou AI prekladateľskej služby [Co-op Translator](https://github.com/Azure/co-op-translator). Hoci sa snažíme o presnosť, upozorňujeme, že automatické preklady môžu obsahovať chyby alebo nepresnosti. Originálny dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre dôležité informácie odporúčame profesionálny ľudský preklad. Nie sme zodpovední za akékoľvek nedorozumenia alebo nesprávne interpretácie vzniknuté použitím tohto prekladu.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
Write Preview
Loading…
Cancel
Save