Toto je vzdělávací repozitář kurikula pro výuku základů webového vývoje pro začátečníky. Kurikulum představuje komplexní 12týdenní kurz vyvinutý Microsoft Cloud Advocates, obsahující 24 praktických lekcí pokrývajících JavaScript, CSS a HTML.
Toto je vzdělávací repozitář kurikula 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í zaměřených na JavaScript, CSS a HTML.
### Klíčové komponenty
### Klíčové součásti
- **Vzdělávací obsah**: 24 strukturovaných lekcí organizovaných do modulů založených na projektech
- **Praktické projekty**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor a AI Chat Assistant
- **Interaktivní kvízy**: 48 kvízů s 3 otázkami každý (před/po lekci)
- **Podpora více jazyků**: Automatické překlady do více než 50 jazyků pomocí GitHub Actions
- **Praktické projekty**: Terrárium, Hra na psaní, Rozšíření prohlížeče, Vesmírná hra, Bankovní aplikace, Kódový editor a AI Chat asistent
- **Interaktivní kvízy**: 48 kvízů s 3 otázkami každého (před a po lekci)
- **Podpora vícejazyčnosti**: Automatizované překlady do více než 50 jazyků pomocí GitHub Actions
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) doporučený pro studenty
- Další kurzy: Generative AI, Data Science, ML, IoT kurikula k dispozici
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) doporučeno pro studenty
- Další kurzy: Generativní AI, Data Science, ML, IoT kurikula dostupná
### Práce se specifickými projekty
### Práce s konkrétními projekty
Pro podrobné instrukce k jednotlivým projektům viz README soubory v:
Pro detailní instrukce k jednotlivým projektům odkazujte na README soubory v:
- `quiz-app/README.md` - Vue 3 aplikace kvízu
- `7-bank-project/README.md` - Bankovní aplikace s autentizací
- `7-bank-project/README.md` - Bankovní aplikace s ověřováním
- `5-browser-extension/README.md` - Vývoj rozšíření prohlížeče
- `6-space-game/README.md` - Vývoj hry na canvasu
- `6-space-game/README.md` - Vývoj hry založené na canvasu
- `9-chat-project/README.md` - Projekt AI chat asistenta
### Struktura monorepa
I když to není tradiční monorepo, tento repozitář obsahuje více nezávislých projektů:
I když nejde o tradiční monorepo, tento repozitář obsahuje více nezávislých projektů:
- Každá lekce je samostatná
- Projekty nesdílejí závislosti
- Pracujte na jednotlivých projektech bez ovlivnění ostatních
- Pro plný zážitek klonujte celý repozitář kurikula
- Projekty nesdílí závislosti
- Práce na jednotlivých projektech bez ovlivnění ostatních
- Klonujte celý repozitář pro plný zážitek z kurikula
---
<!-- 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 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 kritické informace je doporučen profesionální lidský překlad. Nejsme odpovědní za jakákoliv nedorozumění nebo chybné interpretace vyplývající z použití tohoto překladu.
**Upozornění**:
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 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 autorizovaný zdroj. Pro zásadní informace se doporučuje profesionální lidský překlad. Nejsme odpovědni za žádné nedorozumění či chybné interpretace vyplývající z použití tohoto překladu.
Naučte se základy webového vývoje s naším 12týdenním komplexním kurzem od Microsoft Cloud Advocates. Každá ze 24 lekcí se zabývá JavaScriptem, CSS a HTML prostřednictvím praktických projektů, jako jsou terária, rozšíření pro 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í díky naší efektivní projektově orientované pedagogice. Začněte svou cestu programování ještě dnes!
Naučte se základy webového vývoje s naším 12týdenním komplexním kurzem od Microsoft Cloud Advocates. Každá z 24 lekcí proniká 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 si uchování znalostí díky naší efektivní pedagogice založené na projektech. Začněte svou cestu kódováním ještě dnes!
Připojte se k Azure AI Foundry Discord komunitě
Připojte se ke komunitě Azure AI Foundry na Discordu
> Tento repozitář obsahuje více než 50 překladů jazyků, což výrazně zvětšuje velikost stahování. Pro klonování bez překladů použijte sparse checkout:
> Tento repozitář obsahuje více než 50 jazykových překladů, což výrazně zvětšuje velikost stahování. Pro klonování bez překladů použijte sparse checkout:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,232 +48,233 @@ Postupujte podle těchto kroků, abyste začali používat tyto zdroje:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> Tím získáte vše potřebné k dokončení kurzu s mnohem rychlejším stažením.
> Tento způsob vám poskytne vše potřebné ke zvládnutí kurzu s mnohem rychlejším stažením.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Pokud chcete podporu dalších jazyků, jsou zde uvedeny podporované jazykové možnosti [zde](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Pokud si přejete podporu dalších překladových jazyků, jsou uvedeny [zde](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _Jste student?_
Navštivte [**Student Hub stránku**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde naleznete zdroje pro začátečníky, studentské balíčky a dokonce i způsoby, jak získat bezplatný certifikát. Tuto stránku si chcete zařadit mezi oblíbené a čas od času ji zkontrolovat, protože obsah měníme měsíčně.
Navštivte [**Student Hub stránku**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kde naleznete zdroje pro začátečníky, studentské balíčky a dokonce i způsoby, jak získat voucher na bezplatný certifikát. Tuto stránku si chcete uložit do záložek a občas jí kontrolovat, protože obsah měníme každý měsíc.
### 📣 Oznámení - Nové výzvy režimu GitHub Copilot Agent k dokončení!
### 📣 Oznámení - Nové výzvy v režimu GitHub Copilot Agent k dokončení!
Přidána nová výzva, hledejte "GitHub Copilot Agent Challenge 🚀" ve většině kapitol. To je nová výzva, kterou máte dokončit pomocí GitHub Copilot a režimu Agent. Pokud jste režim Agent nikdy 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 🚀" v většině kapitol. Je to nová výzva pro dokončení pomocí GitHub Copilot a režimu Agent. Pokud jste režim Agent dosud nepoužili, umožňuje nejen generovat text, ale také vytvářet a upravovat soubory, spouštět příkazy a další.
### 📣 Oznámení - _Nový projekt k vytvoření pomocí generativní AI_
### 📣 Oznámení - _Nový projekt k vytvoření pomocí generativní AI_
Právě přidán nový projekt AI asistenta, podívejte se na [projekt](./9-chat-project/README.md)
Právě přidán nový AI Assistant projekt, 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ý kurz_ o Generativní AI pro JavaScript byl právě zveřejněn
Nezmeškejte naše nové kurikulum Generativní AI!
Nezmeškejte náš nový kurz Generativní AI!
Navštivte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začněte!
Každá lekce obsahuje úkol k dokončení, ověření znalostí a výzvu, která vás provede tématy jako:
- Vytváření promptů a jejich inženýrství
Každá lekce obsahuje úkol k dokončení, kontrolu znalostí a výzvu, které vás provedou tématy jako:
- Promptování a tvorba promptů (prompt engineering)
- Generování textových a obrazových aplikací
- Vyhledávací aplikace
Navštivte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začněte!
## 🌱 Začínáme
> **Učitelé**, zahrnuli jsme [několik návrhů](for-teachers.md), jak použít 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ěkteré návrhy](for-teachers.md), jak tento plán kurzu 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)!
**[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 přednáškového materiálu, dokončením různých aktivit a ověřením porozumění pomocí povětrná přednáškového kvízu.
**[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 výukového materiálu, plněním různých aktivit a ověřte si své porozumění pomocí popřednáškového kvízu.
Pro lepší zkušenosti s učením se spojte s kolegy 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 k dispozici náš tým moderátorů, kteří vám pomohou.
Pro zlepšení vašeho studijního zážitku se spojte s kolegy a pracujte společně na projektech! Diskuze jsou podporovány v našem [diskuzním fóru](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde je k dispozici tým moderátorů, aby zodpověděl vaše dotazy.
Pro další vzdělávání 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í
Toto kurikulum má připravené vývojové prostředí! Na začátku si můžete vybrat, zda budete kurz spouštět v [Codespace](https://github.com/features/codespaces/) (_prohlížečem ovládané prostředí bez nutnosti instalace_), nebo lokálně na svém počítači pomocí textového editoru, například [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Tento plán kurzu má připravené vývojové prostředí! Na začátku si můžete vybrat, zda budete kurz spouštět v [Codespace](https://github.com/features/codespaces/) (_prohlížečové prostředí bez nutnosti instalací_) nebo lokálně na vašem počítači s použitím textového editoru, jako je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Vytvořte si vlastní repozitář
Pro snadné ukládání vaší práce je doporučeno vytvořit si vlastní kopii tohoto repozitáře. Můžete tak učinit kliknutím na tlačítko **Použít tuto šablonu** na vrchu stránky. Tím se vytvoří nový repozitář na vašem GitHub účtu s kopií kurikula.
#### Vytvořte svůj repozitář
Pro snadné ukládání své práce se doporučuje 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 se vytvoří nový repozitář ve vašem GitHub účtu s kopií kurzu.
Postupujte následovně:
1. **Vytvořte Fork repozitáře**: Klikněte na tlačítko „Fork“ v pravém horním rohu této stránky.
Postupujte podle těchto kroků:
1. **Vytvořte fork repozitáře**: Klikněte na tlačítko "Fork" v pravém horním rohu této stránky.
Ve své kopii repozitáře klikněte na tlačítko **Code** a vyberte **Open with Codespaces**. Tím vytvoříte nový Codespace, ve kterém můžete pracovat.
Ve vaší kopii tohoto repozitáře klikněte na tlačítko **Code** a vyberte **Open with Codespaces**. Tím se vytvoří nový Codespace, ve kterém můžete pracovat.
Pro spuštění tohoto 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ů](../../1-getting-started-lessons/1-intro-to-programming-languages), vás provede různými možnostmi pro každý z těchto nástrojů, abyste si vybrali, co vám vyhovuje nejvíce.
Pro spuštění tohoto kurzu lokálně na vašem počítači 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ů řemesla](../../1-getting-started-lessons/1-intro-to-programming-languages), vás provede různými možnostmi pro každý z těchto nástrojů, abyste si mohli vybrat, co vám nejvíce vyhovuje.
Doporučujeme použít [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) jako editor, který má také zabudovaný [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žívat [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).
1. Naklonujte si své úložiště do počítače. Můžete to udělat kliknutím na tlačítko **Code** a zkopírováním URL:
[CodeSpace](./images/createcodespace.png)
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 právě zkopírovanou URL:
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
git clone <your-repository-url>
```
2. Otevřete složku ve Visual Studio Code. Můžete to udělat kliknutím na **File** > **Open Folder** a výběrem složky, kterou jste právě naklonovali.
2. Otevřete složku ve Visual Studio Code. Můžete to udělat kliknutím na **Soubor** > **Otevřít složku** a výběrem složky, kterou jste právě naklonovali.
> 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
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - pomáhá rychleji psát kód
> * [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) – pro rychlejší psaní kódu
## 📂 Každá lekce obsahuje:
- volitelnou náčrtnou poznámku (sketchnote)
- volitelnou sketchnotu
- volitelné doplňkové video
- rozcvičovací kvíz před lekcí
- rozehřívací kvíz před lekcí
- psanou lekci
- u lekcí založených na projektu krok za krokem průvodce, jak projekt postavit
- kontrolní otázky
- u lekcí založených na projektech krok za krokem návody, jak projekt vybudovat
- ověřování znalostí
- výzvu
- doplňkové čtení
- doplňující čtení
- úkol
- [kvíz po lekci](https://ff-quizzes.netlify.app/web/)
> **Poznámka ke kvízům**: Všechny kvízy jsou uloženy ve složce Quiz-app, celkem 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; postupujte podle instrukcí ve složce `quiz-app`.
> **Poznámka ke kvízům**: Všechny kvízy jsou umístěny ve složce Quiz-app, celkem 48 kvízů se třemi otázkami každý. Jsou dostupné [zde](https://ff-quizzes.netlify.app/web/), aplikaci s kvízy lze spustit lokálně nebo publikovat na Azure; řiďte se pokyny ve složce `quiz-app`.
## 🗃️ Lekce
| | Název projektu | Naučené koncepty | Cíle učení | Propojená lekce | Autor |
| 01 | Začínáme | Úvod do programování a nástroje řemesla | Naučte se základní principy většiny programovacích jazyků a o softwaru, která pomáhá profesionálním vývojářům | [Ú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, 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č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 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čte se o funkcích a metodách k řízení 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čte se vytvářet podmínky ve vašem kódu pomocí rozhodovacích metod | [Rozhodování](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Základy JS | Pole a cykly | Práce s daty pomocí polí a cyklů v JavaScriptu | [Pole a cykly](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML v praxi | Vytvořte HTML pro online terárium, zaměřte se na tvorbu rozvržení | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS v praxi | Vytvořte CSS pro stylování online terária, zaměřte se na základy CSS včetně responzivního designu | [Ú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 | Napište JavaScript, aby terárium fungovalo jako rozhraní drag/drop, zaměřte se na uzávěry a manipulaci s DOM | [JavaScriptové uzávěry, manipulace s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Vytvoření hry psaní na klávesnici | Naučte se používat události klávesnice k řízení logiky JavaScriptové aplikace | [Programování řízené událostmi](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Práce s prohlížeči | Naučte se, jak fungují prohlížeče, jejich historii a jak vytvářet základy rozšíření prohlížeče | [O prohlížečích](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./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 | Vytvořte JavaScriptové prvky rozšíření pro volání API pomocí 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 |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Pozadí procesů v prohlížeči, webový výkon | Použijte pozadí prohlížeče ke správě ikony rozšíření; naučte se o výkonu webu a optimalizacích | [Pozadí úkolů a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Pokročilejší vývoj her v JavaScriptu | Naučte se o dědičnosti pomocí tříd a kompozice a o vzoru Pub/Sub jako příprava na tvorbu hry | [Úvod do pokročilého vývoje her](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Kreslení na plátno | Naučte se o Canvas API, které slouží k vykreslování prvků na obrazovku | [Kreslení na plátno](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./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 | [Space Game](./6-space-game/solution/README.md) | Detekce kolizí | Udělejte, aby se prvky srážely a reagovaly na sebe pomocí stisků kláves a přidejte funkci chladnutí pro výkon hry | [Detekce kolizí](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Udržování skóre | Proveďte matematické výpočty na základě stavu a výkonu hry | [Udržování skóre](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Ukončení 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 | [Podmínka ukončení](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML šablony a směrování ve webové aplikaci | Naučte se vytvářet architekturu vícestránkového webu pomocí směrování a HTML šablon | [HTML šablony a směrování](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Vytvoření přihlašovacího a registračního formuláře | Naučte se o tvorbě formulářů a zpracování validací | [Formuláře](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Metody získávání a použití dat | Jak data proudí do a z vaší aplikace, jak je získávat, ukládat a odstraňovat | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Koncepty správy stavu | Naučte 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 |
| 25 | [Browser/VScode Code](../../8-code-editor) | Práce s VScode | Naučte se používat editor kódu | [Použití editoru kódu VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./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 |
| | Název projektu | Naučené koncepty | Výukové cíle | Propojená lekce | Autor |
| 01 | Začínáme | Úvod do programování a nástroje oboru | Naučit se základní principy většiny programovacích jazyků a software, který pomáhá profesionálním vývojářům 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 svém 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 |
| 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 |
| 05 | Základy JS | Funkce a metody | Naučit se o funkcích a metodách pro řízení 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 v kódu pomocí rozhodovacích metod | [Rozhodování](./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 |
| 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML v praxi | Vytvořit HTML pro online terrárium, zaměřit se na tvorbu rozložení | [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrárium](./3-terrarium/solution/README.md) | CSS v praxi | Vytvořit CSS pro stylování online terrária, zaměřit se na základy CSS včetně responzivního designu | [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScriptové uzávěry, manipulace s DOM | Napsat JavaScript, aby terrárium fungovalo jako rozhraní drag/drop, zaměřit se na uzávěry a manipulaci s DOM | [JavaScriptové uzávěry, manipulace s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Hra na psaní](./4-typing-game/solution/README.md) | Vytvoření hry na psaní | Naučit se používat klávesové události pro řízení logiky ve své JavaScriptové aplikaci | [Programování řízené událostmi](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Ekologické rozšíření pro prohlížeč](./5-browser-extension/solution/README.md) | Práce s prohlížeči | Naučit se, jak fungují prohlížeče, jejich historii a jak vytvořit první prvky rozšíření | [O prohlížečích](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Ekologické rozšíření pro prohlížeč](./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 | Napsat JavaScriptové prvky rozšíření pro volání API a ukládání proměnný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 |
| 14 | [Ekologické rozšíření pro prohlížeč](./5-browser-extension/solution/README.md) | Procesy na pozadí v prohlížeči, webový výkon | Použití procesů na pozadí pro správu ikon rozšíření; poznání webového výkonu a některých optimalizací pro zlepšení | [Úlohy na pozadí a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Kosmická hra](./6-space-game/solution/README.md) | Pokročilejší vývoj her v JavaScriptu | Naučit se o dědičnosti pomocí tříd a kompozice a 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 | [Kosmická hra](./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 |
| 17 | [Kosmická hra](./6-space-game/solution/README.md) | Pohyb prvků po obrazovce | Objevte, jak prvky získávají pohyb pomocí kartézských souřadnic a Canvas API| [Pohyb prvků po obrazovce](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Kosmická hra](./6-space-game/solution/README.md) | Detekce kolizí | Zajistit kolize a reakce prvků na sebe navzájem pomocí stisknutých kláves a přidat cooldown funkci pro výkon hry | [Detekce kolizí](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Kosmická hra](./6-space-game/solution/README.md) | Udržování skóre | Provádět matematické výpočty na základě stavu a výkonu hry | [Udržování skóre](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Kosmická hra](./6-space-game/solution/README.md) | Ukončení a restartování hry | Naučit se o ukončení a restartování hry, včetně čištění zdrojů a resetování proměnných| [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 routování ve webové aplikaci | Naučit se vytvářet kostru vícestránkové webové stránky pomocí routování a HTML šablon | [HTML šablony a routování](./7-bank-project/1-template-route/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čit se o tvorbě formulářů a zpracování validačních rutin | [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í do aplikace i ven z ní, jak je načítat, ukládat a mažet | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Bankovní aplikace](./7-bank-project/solution/README.md) | Koncept správy stavu | Naučit se, jak si aplikace uchovává stav a jak ho programově ovládat | [Správa stavu](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Kód prohlížeče/VScode](../../8-code-editor) | Práce s VScode | 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čte se vytvořit vlastního AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogika
Náš výukový plán je navržen s ohledem na dva klíčové pedagogické principy:
Náš učební plán je navržený s dvěma klíčovými pedagogickými principy:
* učení založené na projektech
* časté kvízy
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 budou mít možnost získat praktické zkušenosti stavbou hry psaní na klávesnici, virtuálního terária, ekologického rozšíření prohlížeče, hry ve stylu Space Invaders a bankovní aplikace pro firmy. Na konci série budou mít studenti pevné základy webového vývoje.
Program vede 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 příležitost získat praktické zkušenosti vytvořením hry na psaní, virtuálního terrária, ekologického rozšíření pro prohlížeč, hry ve stylu space-invader a bankovní aplikace pro firmy. Na konci série budou mít studenti pevné porozumění webovému vývoji.
> 🎓 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 v tomto kurikulu můžete absolvovat jako [Učební cestu](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
Díky sladění obsahu s projekty je proces pro studenty zajímavější a zvyšuje se zapamatování konceptů. Také jsme napsali několik úvodních lekcí o základech JavaScriptu doplněných videi z kolekce "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", jejichž autoři se podíleli na tomto kurzu.
Díky propojení obsahu s projekty je proces pro studenty poutavější a zlepšuje se zapamatování konceptů. Také jsme napsali několik úvodních lekcí o základech JavaScriptu, které představují koncepty, doprovázené videi ze série "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)"– někteří autoři těchto videí přispěli do tohoto kurikula.
Navíc nízkorizikový kvíz před hodinou nastavuje záměr studenta se učit dané téma, zatímco druhý kvíz po hodině podporuje další zapamatování. Tento kurz je navržen tak, aby byl flexibilní a zábavný a lze ho absolvovat celý nebo částečně. Projekty začínají malé a na konci 12týdenního cyklu jsou stále složitější.
Navíc nízkorizikový kvíz před lekcí pomáhá studentovi zaměřit se na téma, zatímco kvíz po lekci podpoří další zapamatování. Tento učební plán je navržen flexibilně a zábavně a lze ho absolvovat celý nebo částečně. Projekty začínají jednoduché a postupně se v průběhu 12 týdnů stávají složitějšími.
Záměrně jsme se vyhnuli zavádění JavaScriptových frameworků, abychom se soustředili na základní dovednosti potřebné jako webový vývojář před přijetím frameworku, dobrým dalším krokem po absolvování tohoto kurzu by bylo naučit se Node.js prostřednictvím jiné kolekce videí: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
I když jsme záměrně vynechali zavádění frameworků JavaScriptu, abychom se soustředili na základní dovednosti webového vývojáře před přijetím frameworku, dobrým dalším krokem po dokončení tohoto kurikula je naučit se o Node.js prostřednictvím další série 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 [Kodex chování](CODE_OF_CONDUCT.md) a [Přispívání](CONTRIBUTING.md). Těšíme se na vaše konstruktivní návrhy!
> Navštivte naše [Kodex chování](CODE_OF_CONDUCT.md) a [Příspěvky](CONTRIBUTING.md) zásady. Vítáme vaše konstruktivní připomínky!
## 🧭 Offline přístup
Tuto dokumentaci můžete spustit offline pomocí [Docsify](https://docsify.js.org/#/). Forkněte si toto repo, [nainstalujte Docsify](https://docsify.js.org/#/quickstart) na svém počítači a poté v kořenové složce tohoto repozitáře spusťte příkaz `docsify serve`. Webová stránka bude servírována na portu 3000 na vašem localhostu: `localhost:3000`.
Tuto dokumentaci můžete používat offline pomocí [Docsify](https://docsify.js.org/#/). Forkněte si toto repozitář, [nainstalujte Docsify](https://docsify.js.org/#/quickstart) na svůj počítač a pak v kořenové složce repozitáře napište `docsify serve`. Webová stránka bude dostupná na portu 3000 na vašem localhostu: `localhost:3000`.
## 📘 PDF
PDF všech lekcí naleznete [zde](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
PDF všech lekcí lze nalézt [zde](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Ostatní kurzy
## 🎒 Další kurzy
Náš tým připravuje i další kurzy! Podívejte se na:
Náš tým vytváří i další kurzy! Podívejte se na:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
---
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
### Azure / Edge / MCP / Agenti
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Generativní AI série
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
### Série Generativní AI
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-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í vzdělávání
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Série Copilot
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
Pokud se zaseknete nebo máte otázky ohledně tvorby AI aplikací, připojte se k ostatním studentům a zkušeným vývojářům v diskusích o MCP. Je to podpůrná komunita, kde jsou otázky vítány a znalosti se sdílejí otevřeně.
Pokud budete mít potíže nebo nějaké dotazy ohledně vytváření AI aplikací, připojte se k ostatním studentům a zkušeným vývojářům v diskuzích o MCP. Je to vstřícná komunita, kde jsou otázky vítány a znalosti se sdílejí otevřeně.
Tento repozitář je licencován pod licencí MIT. Více informací naleznete v souboru [LICENSE](../../LICENSE).
Toto úložiště je licencováno pod licencí MIT. Pro více informací viz soubor [LICENSE](../../LICENSE).
---
<!-- 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 automatizované překlady mohou obsahovat chyby nebo nepřesnosti. Originální 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. Za jakékoli nedorozumění nebo nesprávné výklady vzniklé z použití tohoto překladu neneseme odpovědnost.
**Zdroj informací**:
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 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 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. Nejsme odpovědní za jakékoliv nedorozumění nebo nesprávné výklady vyplývající z použití tohoto překladu.
Ez egy oktatási tananyag-tár, amely a webfejlesztés alapjainak tanítására szolgál 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, amelyek JavaScript-et, CSS-t és HTML-t fednek le.
Ez egy oktatási tananyag tárhely, amely kezdők számára tanítja a webfejlesztés alapjait. 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.
- `6-space-game/README.md` - Canvas alapú játék fejlesztés
- `9-chat-project/README.md` - AI csevegő asszisztens projekt
- `9-chat-project/README.md` - AI chat asszisztens projekt
### Monorepo struktúra
### Monorepo szerkezet
Bár nem hagyományos monorepóról van szó, ez a tárhely több független projektet tartalmaz:
- Minden lecke önálló egység
Habár nem egy hagyományos monorepo, ez a tárhely több önálló projektet tartalmaz:
- Minden lecke önállóan működik
- A projektek nem osztanak meg függőségeket
- Egyedi projekteken dolgozhatsz anélkül, hogy másokat befolyásolnál
- Teljes tananyag élményéhez klónozd az egész tárhelyet
- Az egyes projekteken önállóan dolgozhatsz befolyás nélkül a többire
- A teljes tananyag élményért klónozd a teljes tárhelyet
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Felelősségkizárás**:
Ez a dokumentum az [Co-op Translator](https://github.com/Azure/co-op-translator) AI fordító szolgáltatás segítségével készült. 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 az anyanyelvén tekintendő hivatalos forrásnak. Kritikus információk esetén professzionális emberi fordítást javasolt igénybe venni. Nem vállalunk felelősséget semmilyen félreértésért vagy helytelen értelmezésért, amely ebből a fordításból adódik.
**Felelősségkizárása**:
Ez a dokumentum az AI fordító szolgáltatás [Co-op Translator](https://github.com/Azure/co-op-translator) segítségével készült. Bár az pontosságra törekszünk, kérjük, vegye figyelembe, hogy az automatikus fordítás hibákat vagy pontatlanságokat tartalmazhat. Az eredeti dokumentum a saját nyelvén tekintendő hiteles forrásnak. Kritikus információk esetén professzionális emberi fordítást javaslunk. Nem vállalunk felelősséget a fordítás használatából eredő félreértésekért vagy téves értelmezésekért.
Ismerd meg a webfejlesztés alapjait a Microsoft Cloud Advocates által tartott 12 hetes átfogó tanfolyamunkon. A 24 leckéből mindegyik JavaScriptet, CSS-t és HTML-t tárgyal, gyakorlati projektek révén, mint terráriumok, böngészőbővítmények és űrjátékok. Vegyél részt kvízekben, beszélgetésekben és gyakorlati feladatokban. Fejleszd készségeidet és optimalizáld a tudásod megtartását hatékony, projekt-alapú tanulási módszerünkkel. Kezdd el a kódolási utadat még ma!
Ismerkedjen meg a webfejlesztés alapjaival a Microsoft Cloud Advocates által készített 12 hetes átfogó tanfolyamunkkal. Mind a 24 lecke a JavaScript, CSS és HTML témakörébe nyújt betekintést gyakorlati projektek segítségével, mint például terráriumok, böngészőkiegészítők és űrjátékok. Vegyen részt kvízekben, beszélgetésekben és gyakorlati feladatokban. Fejlessze képességeit és optimalizálja tudásának megőrzését hatékony, projekten alapuló oktatásunkkal. Kezdje el a kódolási kalandot még ma!
Csatlakozz az Azure AI Foundry Discord közösséghez
Csatlakozzon az Azure AI Foundry Discord közösséghez
3. [**Csatlakozz az Azure AI Foundry Discordhoz, és ismerkedj meg szakértőkkel és fejlesztőtársaiddal**](https://discord.com/invite/ByRwuEEgH4)
Kövesse az alábbi lépéseket, hogy elkezdje használni ezeket az erőforrásokat:
1. **Forkolja a tárházat**: Kattintson ide [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Klónozza a tárházat**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Csatlakozzon az Azure AI Foundry Discordhoz, hogy találkozzon szakértőkkel és fejlesztőtársaival**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Többnyelvű támogatás
#### GitHub Action segítségével támogatott (Automatikus és mindig naprakész)
#### GitHub Action segítségével támogatott (Automatizált és Mindig naprakész)
> Ez a repozitórium több mint 50 nyelvi 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álj sparse checkoutot:
> Ez a tárház több mint 50 nyelvi fordítást tartalmaz, ami jelentősen megnöveli a letöltési méretet. Ha fordítások nélkül szeretné klónozni, használja a sparse checkout-ot:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,91 +48,92 @@ Kövesd ezeket a lépéseket, hogy elkezdd használni ezeket az erőforrásokat:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> Így mindent megkapsz, amire szükséged van a tanfolyam elvégzéséhez, sokkal gyorsabb letöltéssel.
> Ez mindent megad, amire szüksége van a tanfolyam elvégzéséhez sokkal gyorsabb letöltéssel.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ha további nyelvű fordításokat szeretnél, ezek itt találhatók [itt](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Ha további támogatott fordítási nyelveket szeretne, azok [itt találhatók](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _Tanuló vagy?_
#### 🧑🎓 _Diák vagy?_
Látogasd meg a [**Hallgatói központ oldalt**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), ahol megtalálod a kezdő erőforrásokat, hallgatói csomagokat és akár ingyenes tanúsítvány kupont is szerezhetsz. Ezt az oldalt érdemes elmenteni könyvjelzőnek és időnként ellenőrizni, mert havonta frissítjük a tartalmat.
Látogass el a [**Diák Hub oldalra**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), ahol kezdő erőforrásokat, diák csomagokat és akár ingyenes tanúsítvány utalványokat is találsz. Ezt az oldalt érdemes rendszeresen könyvjelzőzni, mivel havonta frissítjük a tartalmat.
### 📣 Bejelentés - Új GitHub Copilot Agent mód kihívások!
Új kihívás került hozzáadásra, keresd a "GitHub Copilot Agent Challenge 🚀" feliratot a legtöbb fejezetben. Ez egy új kihívás, amelyet GitHub Copilot és Agent mód segítségével teljesíthetsz. Ha még nem használtad az Agent módot, tud szöveget generálni, fájlokat létrehozni és szerkeszteni, parancsokat futtatni és még sok mást.
Új kihívás került hozzáadásra "GitHub Copilot Agent Challenge 🚀" néven a legtöbb fejezetben. Ez egy új kihívás, amit a GitHub Copilot és az Agent mód segítségével teljesíthetsz. Ha még nem használtad az Agent módot, az nemcsak szöveg generálására képes, hanem fájlok létrehozására és szerkesztésére, parancsok futtatására és még sok másra.
### 📣 Bejelentés - _Új projekt generatív MI használatával_
### 📣 Bejelentés - _Új projekt a Generatív Mesterséges Intelligencia használatával_
Új AI asszisztens projekt került hozzáadásra, nézd meg a [projektet](./9-chat-project/README.md)
Új AI asszisztens projekt került hozzáadásra, nézd meg a [projektdokumentációt](./9-chat-project/README.md)
### 📣 Bejelentés - _Új tananyag_ Generatív MI témában JavaScripthez
### 📣 Bejelentés - _Új tanmenet_ JavaScript Generatív MI témában jelent meg
Ne hagyd ki új generatív MI tananyagunkat!
Ne hagyd ki új Generatív MI tanmenetünket!
Látogasd meg a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalt a kezdéshez!
Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra, és kezdj bele!
Minden lecke tartalmaz egy kitöltendő feladatot, tudásellenőrzést és egy kihívást, amelyek segítenek a következők elsajátításában:
- Promptolás és prompttervezés
- Szöveg és kép alkalmazás generálás
Minden lecke egy feladatot, egy tudásellenőrzést és egy kihívást tartalmaz, hogy segítsen a következő témák elsajátításában:
- Promptolás és prompt mérnöki munka
- Szöveg- és képalkalmazás generálás
- Keresőalkalmazások
Látogasd meg a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalt a kezdéshez!
Látogass el a [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) oldalra, és kezdj bele!
## 🌱 Első lépések
## 🌱 Kezdés
> **Tanárok**, [tartalmazunk néhány javaslatot](for-teachers.md) a tananyag használatához. Visszajelzéseteket szívesen várjuk [a beszélgetési fórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
> **Tanárként** néhány javaslatot [ide](for-teachers.md) tettünk közzé a tanmenet használatára. Szívesen fogadjuk visszajelzésedet [vitafórumunkban](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éhez kezdjetek egy előadás előtti kvízzel, majd olvassátok el az előadás anyagát, végezzétek el a különféle feladatokat, és a végén a jó megértés érdekében oldjátok meg az előadás utáni kvízt.
**[Tanulók](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, minden lecke előtt végezzetek bevezető kvízt, majd olvassátok el az anyagot, végezzétek el a feladatokat, és teszteljétek tudásotokat az utólagos kvízzel.
A tanulási élmény fokozása érdekében dolgozzatok együtt társaitokkal a projekteken! A beszélgetéseket ösztönözzük [beszélgetési fórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), ahol moderátoraink rendelkezésre állnak, hogy válaszoljanak kérdéseitekre.
A tanulási élmény fokozása érdekében dolgozzatok együtt diáktársaitokkal a projekteken! A beszélgetések ösztönzöttek a [vitafórumunkon](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), ahol moderátor csapatunk készen áll válaszolni kérdéseitekre.
Tovább mélyítheted tudásodat, ha felfedezed a [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) oldalát további tananyagokért.
A tanulmányaitok elősegítéséhez erősen ajánljuk a [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) platform további anyagainak felfedezését.
### 📋 Környezeted beállítása
### 📋 Fejlesztői környezet beállítása
Ez a tananyag fejlesztői környezettel érkezik, ami készen áll a használatra! A kezdéshez választhatod, hogy a tananyagot egy [Codespace-ben](https://github.com/features/codespaces/) futtatod (_böngésző alapú, telepítés nélküli környezet_), vagy helyben a számítógépeden egy szövegszerkesztővel, például a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) alkalmazással.
Ez a tanmenet egy működő fejlesztői környezettel érkezik! Kezdésként választhatjátok a tanmenet futtatását [Codespace-ben](https://github.com/features/codespaces/) (_böngésző alapú, telepítés nélküli környezet_), vagy helyben, a számítógépeden egy szövegszerkesztővel, például a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) segítségével.
#### Hozd létre saját repositorydat
Ahhoz, hogy könnyen elmented a munkádat, ajánlott, hogy készíts saját másolatot erről a repozitóriumról. Ezt megteheted, ha a lap tetején a **Use this template** gombra kattintasz. Ez létrehoz egy új repozitóriumot a GitHub fiókodban a tananyag másolatával.
#### Hozd létre a saját tárházad
A munkád biztonságos mentése érdekében ajánlott létrehoznod a saját példányodat ebből a tárházból. Ezt megteheted az oldal tetején található **Use this template** gombra kattintva. Ez egy új tárházat hoz létre GitHub fiókodban, a tanmenet másolatával.
Kövessétek ezeket a lépéseket:
1. **Forráspont másolása (Fork)**: Kattints a "Fork" gombra a lap jobb felső sarkában.
1. **Forkold a tárházat**: Kattints a jobb felső sarokban lévő "Fork" gombra.
2. **Klónozd a tárházat**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### A tananyag futtatása Codespace-ben
#### Tanmenet futtatása Codespace-ben
A saját másolatodban, amit létrehoztál, kattints a **Code** gombra, majd válaszd az **Open with Codespaces**lehetőséget. Ez új Codespace-et hoz létre a munkához.
A tárházadban, amit létrehoztál, kattints a **Code** gombra, majd válaszd az **Open with Codespaces**opciót. Ez létrehoz egy új Codespace-t a munkához.
A tananyag helyi futtatásához egy 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özökbe](../../1-getting-started-lessons/1-intro-to-programming-languages), bemutat különféle lehetőségeket ezek közül, hogy kiválaszthasd a számodra legmegfelelőbbet.
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, [Bevezetés a programozási nyelvekbe és eszközökbe](../../1-getting-started-lessons/1-intro-to-programming-languages) segít több lehetőség közötti választásban ezek közül.
Ajánljuk a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) használatát szerkesztőként, amely beépített [Terminált](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) is tartalmaz. A Visual Studio Code-ot innen töltheted le: [ide](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Klónozd le a tárolódat a számítógépedre. Ezt úgy teheted meg, hogy rákattintasz a **Code** gombra, majd kimásolod az URL-t:
Ajánljuk a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) használatát szerkesztőként, amely 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).
1. Klónozd a tárolódat a számítógépedre. Ezt úgy teheted meg, hogy rákattintasz a **Code** gombra, és kimásolod az URL-t:
[CodeSpace](./images/createcodespace.png)
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 beillesztve az imént kimásolt URL-t:
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) belül, és futtasd a következő parancsot, az`<your-repository-url>` helyére beillesztve a most kimásolt URL-t:
```bash
git clone <your-repository-url>
```
2. Nyisd meg a mappát a Visual Studio Code-ban. Ezt a **File** > **Open Folder** menüpont kiválasztásával, majd a klónozott mappa megadásával teheted meg.
2. Nyisd meg a mappát a Visual Studio Code-ban. Ezt úgy teheted meg, hogy rákattintasz a **File** > **Open Folder** menüpontra, majd kiválasztod a klónozott mappát.
> Ajánlott Visual Studio Code kiterjesztések:
@ -144,136 +145,136 @@ Ajánljuk a [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academi
- opcionális vázlatrajzot
- opcionális kiegészítő videót
- leckét megelőző bemelegítő kvízt
- tanóra előtti bemelegítő kvízt
- írott leckét
- projekt alapú leckékhez lépésről lépésre útmutatókat a projekt elkészítéséhez
- tudásellenőrzőket
- projekt alapú leckékhez lépésről lépésre útmutatókat a projekt megépítéséhez
- tudásellenőrzéseket
- kihívást
- kiegészítő olvasnivalót
- feladatot
- [lecke utáni kvízt](https://ff-quizzes.netlify.app/web/)
- [tanóra utáni kvízt](https://ff-quizzes.netlify.app/web/)
> **Megjegyzés a kvízekhez**: Az összes kvíz a Quiz-app mappában található, összesen 48 darab, mindhárom kérdésből álló teszt. Elérhetők [itt](https://ff-quizzes.netlify.app/web/), a kvízalkalmazás helyileg is futtatható vagy Azure-ra telepíthető; kövesd az utasításokat a `quiz-app` mappában.
> **Megjegyzés a kvízekhez**: Minden kvíz a Quiz-app mappában található, összesen 48 kvíz három kérdéssel. Elérhetőek [itt](https://ff-quizzes.netlify.app/web/), a kvízalkalmazás futtatható helyileg vagy telepíthető Azure-ra; kövesd az utasításokat a `quiz-app` mappában.
## 🗃️ Leckék
| | Projekt neve | Tanított koncepciók | Tanulási célok | Kapcsolódó lecke | Szerző |
| | Projekt neve | Tanított fogalmak | Tanulási célok | Hivatkozott lecke | Szerző |
| 01 | Első lépések | Bevezetés a programozásba és a szakmában használt eszközök | Ismerd meg a legtöbb programozási nyelv alapjait és azokat a szoftvereket, amelyek segítik a profi fejlesztőket a munkájukban | [Bevezetés a programozási nyelvekbe és eszközökbe](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Első lépések | A GitHub alapjai, csapatmunkával együtt | Hogyan használd a GitHubot a projektedben, és hogyan működj össze másokkal egy kódalapon | [Bevezetés a GitHubba](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Első lépések | Akadálymentesség | Ismerd meg a webes akadálymentesség alapjait | [Az akadálymentesség alapjai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 05 | JS Alapok | Függvények és metódusok | Ismerd meg a függvényeket és metódusokat, amelyek az alkalmazás logikájának kezelésére szolgálnak | [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 | Tanuld meg, hogyan készíts feltételeket a kódodban döntéshozó módszerekkel | [Döntéshozatal](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Alapok | Tömbök és ciklusok | Dolgozz adatokkal tömbök és ciklusok segítségével JavaScriptben | [Tömbök és ciklusok](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML a gyakorlatban | Építsd meg az online terrárium HTML-jét, fókuszálva a layout elkészítésére | [Bevezetés a HTML-be](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrárium](./3-terrarium/solution/README.md) | CSS a gyakorlatban | Építsd meg a CSS-t az online terrárium stílusához, beleértve az oldal reszponzívvá tételét is | [Bevezetés a CSS-be](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScript lezárások, DOM kezelése | Építsd meg a JavaScript-et, hogy a terrárium drag/drop felületként működjön, fókuszálva a lezárásokra és a DOM kezelésére | [JavaScript lezárások, DOM kezelés](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Billentyűzetes játék](./4-typing-game/solution/README.md) | Billentyűzetes játék építése | Tanulj meg billentyűeseményeket használni JavaScript alkalmazásod logikájának vezérléséhez | [Eseményvezérelt programozás](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zöld böngészőbővítmény](./5-browser-extension/solution/README.md) | Böngészőkkel való munka | Ismerd meg, hogyan működnek a böngészők, történetüket és hogyan készítsd el 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őbővítmény](./5-browser-extension/solution/README.md) | Űrlap készítése, API hívás és változók tárolása helyi tárolóban | Építsd meg a böngészőbővítmény JavaScript elemeit, hogy API-t hívj változók használatával, melyek helyileg tárolódnak | [API-k, űrlapok és helyi tárolók](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zöld böngészőbővítmény](./5-browser-extension/solution/README.md) | Háttérfolyamatok a böngészőben, webteljesítmény | Használd a böngésző háttérfolyamatait az ikon kezelésére; ismerd meg a webteljesítményt és néhány optimalizálást | [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) | Haladóbb játékfejlesztés JavaScript-tel | Tanuld meg az öröklődést osztályok és kompozíció segítségével, valamint a Pub/Sub mintát egy játék fejlesztéséhez | [Bevezetés a haladó játékfejlesztésbe](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Űrjáték](./6-space-game/solution/README.md) | Rajzolás vászonra | Ismerd meg a Canvas API-t, amely elemek rajzolására szolgál a képernyőre | [Rajzolás vászonra](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Űrjáték](./6-space-game/solution/README.md) | Mozgatás a képernyőn | Fedezd fel, hogyan mozdíthatók el elemek kartézián koordináták és a Canvas API segítségével | [Elemmozgatás](./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 | Tedd lehetővé, hogy az elemek ütközzenek, reagáljanak egymásra billentyűleütések alapján, és legyen visszaállító funkció a teljesítmény érdekében | [Ü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 | Végezz matematikai számításokat a játék állapotának és teljesítményének megfelelően | [Pontszámlálás](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Űrjáték](./6-space-game/solution/README.md) | A játék befejezése és újraindítása | Ismerd meg, hogyan zárd le és indítsd újra a játékot, beleértve az erőforrások felszabadítását és a változók alaphelyzetbe állítását | [A befejezés feltétele](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banki alkalmazás](./7-bank-project/solution/README.md) | HTML sablonok és útvonalak egy webalkalmazásban | Tanuld meg, hogyan készítsd el egy többlapos weboldal architektúrájának alapját útvonalak és HTML sablonok használatával | [HTML sablonok és útvonalak](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Belépési és regisztrációs űrlap készítése | Tanuld meg az űrlapok építését és az érvényesítés kezelését | [Űrlapok](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Az adatok lekérése és használata | Hogyan áramlanak az adatok az alkalmazásban, hogyan kérhetők le, tárolhatók és törölhetők | [Adatok](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Állapotkezelés alapjai | Tanuld meg, hogyan őrzi meg az alkalmazás az állapotot, és hogyan kezelheted 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 | Tanuld meg a kódszerkesztő használatá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 | Tanuld meg, hogyan építsd fel a saját AI asszisztensedet | [AI asszisztens projekt](./9-chat-project/README.md) | Chris |
## 🏫 Didaktika
Tananyagunk kialakításánál két alapvető didaktikai elv vezérelt minket:
* projektalapú tanulás
| 01 | Kezdés | Bevezetés a programozásba és a szakmai eszközökbe | Ismerd meg a legtöbb programozási nyelv alapjait és azokat a szoftvereket, amelyek segítik a profi fejlesztők munkáját | [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 | A GitHub alapjai, beleértve a csapatmunkát | Hogyan használd a GitHubot a projektedben, és hogyan működj együtt másokkal kódbázison | [Bevezetés a GitHubba](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Kezdés | Akadálymentesség | Ismerd meg a web akadálymentesség alapjait | [Akadálymentesség alapjai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 05 | JS alapok | Függvények és metódusok | Ismerd meg a függvényeket és metódusokat 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 | Tanuld meg, hogyan hozz létre feltételeket a kódodban döntéshozatali módszerekkel | [Döntéshozatal](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS alapok | Tömbök és ciklusok | Dolgozz adatkezeléssel tömbök és ciklusok segítségével JavaScriptben | [Tömbök és ciklusok](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrárium](./3-terrarium/solution/README.md) | HTML gyakorlatban | Építsd meg a HTML-t egy online terráriumhoz, a layout készítésére 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 | Építsd meg a CSS-t az online terráriumhoz, a CSS alapjaira fókuszálva, beleértve az oldal reszponzívvá tételét | [Bevezetés a CSS-be](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrárium](./3-terrarium/solution/README.md) | JavaScript closures, DOM manipuláció | Építsd meg a JavaScript-et, hogy a terrárium drag/drop felületként működjön, fókuszálva a closures és a DOM kezelésére | [JavaScript closures, 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 építése | Tanuld meg, hogyan használd a billentyűzetes eseményeket appod logikájának vezérlésére | [Eseményvezérelt programozás](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zöld böngészőbővítmény](./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 használd a böngészőbővítmény első elemeinek létrehozásához | [A böngészőkről](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Zöld böngészőbővítmény](./5-browser-extension/solution/README.md) | Űrlap készítése, API hívása és helyi tároló változók használata | Építsd meg a böngészőbővítményed JavaScript elemeit egy API meghívásához helyi tároló változókkal | [API-k, űrlapok és helyi tárolás](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zöld böngészőbővítmény](./5-browser-extension/solution/README.md) | Háttérfolyamatok a böngészőben, webteljesítmény | Használd a böngésző háttérfolyamatait az ikonjának kezelésére; ismerd meg a web teljesítményét és néhány optimalizálási módszert | [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 | Ismerd meg az öröklést osztályok és összetétel (composition) használatával, valamint a Pub/Sub mintát, hogy előkészülj egy játék építésére | [Bevezetés a fejlett játékfejlesztésbe](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Űrjáték](./6-space-game/solution/README.md) | Rajzolás a vászonra | Ismerd meg a Canvas API-t, amellyel elemeket rajzolhatunk a képernyőre | [Rajzolás a vászonra](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Űrjáték](./6-space-game/solution/README.md) | Mozgatás a képernyőn | Fedezd fel, hogyan kaphatnak mozgást az elemek a kartézián koordináták és a Canvas API segítségével | [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észlelés | Készíts ütközéseket és reagálást az elemek között billentyűleütésekkel és adj hozzá hűlési funkciót a játék teljesítményének biztosítására | [Ütközésészlelés](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Űrjáték](./6-space-game/solution/README.md) | Pontszám nyilvántartás | Végez matematika műveleteket a játék állapota és teljesítménye alapján | [Pontszámlálás](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Űrjáték](./6-space-game/solution/README.md) | A játék befejezése és újraindítása | Tanuld meg a játék befejezését és újraindítását, beleértve az erőforrások takarítását és a változó értékek visszaállítását | [A befejezési feltétel](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banki alkalmazás](./7-bank-project/solution/README.md) | HTML sablonok és útvonalak egy webalkalmazásban | Tanuld meg, hogyan készítsd el egy többoldalas weboldal felépítését routinggal és HTML sablonokkal | [HTML sablonok és útvonalak](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Bejelentkezési és regisztrációs űrlap készítése | Tanuld meg az űrlapkészítést és az érvényesítési rutinok kezelését | [Űrlapok](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Adatok lekérése és használata | Hogyan áramlanak be és ki az adatok az alkalmazásból, hogyan kérd le, tárold és szabadulj meg tőlük | [Adatok](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banki alkalmazás](./7-bank-project/solution/README.md) | Állapotkezelés fogalmai | Tanuld meg, hogyan őrzi meg az alkalmazás az állapotot és hogyan kezeld programozottan | [Állapotkezelés](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Böngésző/VScode kód](../../8-code-editor) | Munka VScode-dal | Tanulj meg kódszerkesztőt használni | [VScode kódszerkesztő használata](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [Mesterséges intelligencia asszisztensek](./9-chat-project/README.md) | Munkavégzés MI-vel | Tanuld meg, hogyan építsd fel a saját MI asszisztensed | [MI asszisztens projekt](./9-chat-project/README.md) | Chris |
## 🏫 Pedagógia
Tananyagunk két fontos pedagógiai elv szerint készült:
* projektalapú tanulás
* gyakori kvízek
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 diákoknak lehetőségük lesz gyakorlati tapasztalatot szerezni egy billentyűzetes 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 banki alkalmazás építésével. A tanfolyam végére szilárd webfejlesztési ismeretekkel rendelkeznek majd.
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 nyílik gyakorlati tapasztalat szerzésére gépelős játék, virtuális terrárium, környezetbarát böngészőbővítmény, űrhajós játék és üzleti bankalkalmazás építésével. A sorozat végére alapos webfejlesztési tudásra tesznek szert.
> 🎓 Az első pár 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 ebben a tananyagban Microsoft Learn-ön [Tanulási útvonalként](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) is végezheted!
Az anyag projektekhez igazítása által a folyamat élvezetesebb lesz a diákok számára, és növeli a koncepciók elsajátítását. Emellett több bevezető leckét is írtunk a JavaScript alapjairól, kiegészítve a "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videós oktatóanyag gyűjtemény egyik videójával, amelynek néhány szerzője közreműködött ebben a tananyagban.
Azáltal, hogy a tartalom a projektekhez igazodik, a folyamat érdekesebb a diákok számára, és a fogalmak megtartása is javul. Több kezdő leckét is írtunk JavaScript alapokból, hogy megismertessük az alapfogalmakat, kiegészítve a "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videósorozat néhány szerzőjének oktató videóival, akik szintén hozzájárultak ehhez a tananyaghoz.
Továbbá, egy alacsony tétű kvíz az óra előtt segíti a tanuló elköteleződését a téma iránt, míg egy második kvíz az óra után tovább erősíti a tudás megszilárdítását. Ez a tananyag rugalmas és szórakoztató, egészben vagy részleteiben is végezhető. A projektek kicsiben indulnak, és a 12 hetes ciklus végére egyre összetettebbekké válnak.
Továbbá egy alacsony tétű kvíz óra előtt beállítja a diák szándékát a tanulásra, míg egy második kvíz óra után elősegíti a tudás mélyebb rögzítését. Ez a tananyag rugalmas és szórakoztató, egészben vagy részleteiben is végezhető. A projektek kicsiben indulnak és fokozatosan egyre összetettebbek lesznek a 12 hetes ciklus végére.
Miközben szándékosan mellőztük JavaScript keretrendszerek bemutatását, hogy a webfejlesztőként szükséges alapvető készségekre koncentráljunk, mielőtt keretrendszert alkalmaznánk, egy jó következő lépés a tananyag elvégzése után a Node.js megismerése lehet a következő 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 tudatosan kerültük a JavaScript keretrendszerek bevezetését, hogy az alapvető webfejlesztői készségekre koncentráljunk a keretrendszerhasználat előtt, a tananyag elvégzése után jó következő lépés a Node.js megismerése egy másik videósorozat segítségével: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Látogasd meg a [Viselkedési kódexünket](CODE_OF_CONDUCT.md) és a [Hozzájárulás](CONTRIBUTING.md) irányelveinket. Örömmel fogadjuk konstruktív visszajelzésed!
> Látogasd meg [Viselkedési Kódexünket](CODE_OF_CONDUCT.md) és [Hozzájárulás](CONTRIBUTING.md) irányelveinket. Szívesen fogadjuk építő jellegű visszajelzéseidet!
## 🧭 Offline használat
## 🧭 Offline hozzáférés
Ez a dokumentáció offline is használható a [Docsify](https://docsify.js.org/#/) használatával. Forkold ezt a repo-t, telepítsd a Docsify-t helyileg a gépeden, majd a repo gyökerében írd be, hogy `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. Fork-old ezt a repót, [telepítsd a Docsify-t](https://docsify.js.org/#/quickstart) a helyi gépedre, majd a repó gyökérmappájában írd be: `docsify serve`. Az oldal a 3000-es porton lesz elérhető a localhostodon: `localhost:3000`.
## 📘 PDF
Az összes leckéről készült PDF [itt található](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
A PDF az összes leckéről megtalálható [itt](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Egyéb tanfolyamok
## 🎒 Egyéb kurzusok
Csapatunk más tanfolyamokat is készít! Nézd meg:
Csapatunk más kurzusokat is készít! Nézd meg:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
---
### Alapvető tanulás
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
Ha elakadsz vagy kérdésed van az AI alkalmazások építésével kapcsolatban, csatlakozz más tanulókhoz é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éseket örömmel fogadják és a tudást szabadon megosztják.
Ha elakadsz vagy kérdésed van AI alkalmazások fejlesztésével kapcsolatban. Csatlakozz tanulótársaidhoz és tapasztalt fejlesztőkhöz a MCP témájú 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.
Ez a tároló az MIT licenc alatt áll. Részletekért lásd a [LICENSE](../../LICENSE) fájlt.
Ez a tároló az MIT licenc alatt áll. További információért lásd a [LICENSE](../../LICENSE) fájlt.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Jóváhagyási nyilatkozat**:
Ezt a dokumentumot az AI fordító szolgáltatás, a [Co-op Translator](https://github.com/Azure/co-op-translator) használatával 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, anyanyelvi dokumentum tekintendő a hiteles forrásnak. Kritikus információk esetén professzionális, emberi fordítást javaslunk. Nem vállalunk felelősséget az ebből a fordításból eredő félreértésekért vagy félreértelmezésekért.
**Felelősség kizárása**:
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 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 a saját nyelvén tekintendő hivatalos forrásnak. Kritikus információk esetén professzionális emberi fordítás javasolt. 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.
Huu ni hazina ya mtaala wa elimu kwa kufundisha misingi ya maendeleo ya wavuti kwa wanaoanza. Mtaala huu ni kozi kamili ya wiki 12 iliyotengenezwa na Wataalamu wa Microsoft Cloud, ikijumuisha masomo 24 ya vitendo kuhusu JavaScript, CSS, na HTML.
Huu ni hifadhidata ya mtaala wa elimu kwa kufundisha misingi ya maendeleo ya wavuti kwa wanaoanza. Mtaala ni kozi kamili ya wiki 12 iliyotengenezwa na Microsoft Cloud Advocates, ikijumuisha masomo 24 ya vitendo kuhusu JavaScript, CSS, na HTML.
### Vipengele Vikuu
### Vipengele Muhimu
- **Maudhui ya Elimu**: Masomo 24 yaliyopangwa katika moduli za mradi
- **Miradi ya Vitendo**: Terrarium, Mchezo wa Kuandika, Kiongezi cha Kivinjari, Mchezo wa Anga, Programu ya Benki, Mhariri wa Msimbo, na Msaidizi wa Mazungumzo wa AI
- **Mtihani wa Kuingiliana**: Maswali 48 yenye maswali 3 kila mmoja (vipimo kabla/baada ya somo)
- **Msaada wa Lugha Nyingi**: Tafsiri za moja kwa moja kwa lugha 50+ kupitia GitHub Actions
- **Maudhui ya Elimu**: Masomo 24 yaliyopangiliwa kwa muundo wa moduli zinazotegemea miradi
- **Miradi ya Vitendo**: Terrarium, Mchezo wa Uandikaji, Kiongezi cha Kivinjari, Mchezo wa Anga, App ya Benki, Mhariri wa Nambari, na Msaidizi wa Mazungumzo wa AI
- **Mitihani ya Kuingiliana**: Mitihani 48 yenye maswali 3 kila moja (mapema/kwa baada ya somo)
- **Usaidi wa Lugha Nyingi**: Tafsiri za moja kwa moja kwa lugha zaidi ya 50 kupitia GitHub Actions
- Tumia VS Code na programu-jalizi ya Live Server kwa miradi ya HTML
- Sakinisha programu-jalizi za ESLint na Prettier kwa ulinganisho mzuri wa fomati
- Tumia DevTools za kivinjari kwa utambuzi wa makosa ya JavaScript
- Kwa miradi ya Vue, sakinisha programu-jalizi ya Vue DevTools ya kivinjari
- Tumia VS Code na ugani wa Live Server kwa miradi ya HTML
- Sakinisha ugani za ESLint na Prettier kwa uundaji thabiti
- Tumia DevTools za kivinjari kutatua matatizo ya JavaScript
- Kwa miradi ya Vue, sakinisha Vue DevTools ugani wa kivinjari
### Mambo ya Kufikiria Kuhusu Utendaji
### Masharti ya Utendaji
- Idadi kubwa ya faili zilizotafsiriwa (lugha 50+) inafanya kloni kamili kuwa kubwa
- Tumia shallow clone ikiwa unafanya kazi na maudhui pekee: `git clone --depth 1`
- Epuka tafsiri katika utafutaji wakati wa kazi za Kiingereza
- Michakato ya ujenzi inaweza kuchelewa mara ya kwanza (npm install, ujenzi wa Vite)
- Idadi kubwa ya faili zilizotafsiriwa (zaidi ya 50) inasababisha vane kubwa kwa clone kamili
- Tumia shallow clone wakati unafanya kazi tu na maudhui: `git clone --depth 1`
- Epuka tafsiri wakati wa kufanya kazi na maudhui ya Kiingereza
- Mchakato wa ujenzi unaweza kuwa polepole kwa mara ya kwanza (npm install, ujenzi wa Vite)
## Mambo ya Usalama
### Mabadiliko ya Mazingira
- Funguo za API hazipaswi kuwekwa kwenye hazina
- Tumia faili `.env` (zimeorodheshwa tayari katika `.gitignore`)
- Elezea mabadiliko ya mazingira yanayohitajika katika README za miradi
- Funguo za API hazipaswi kung’olewa hifadhidatani
- Tumia faili za `.env` (zipo tayari katika `.gitignore`)
- Andika mabadiliko ya mazingira yanayohitajika katika README za miradi
### Miradi ya Python
- Tumia mazingira ya virtual: `python -m venv venv`
- Shikilia utegemezi umeboreshwa
- Tokeni za GitHub ziwe na ruhusa ndogo zinazohitajika pekee
- Dumisha dependencies zikisasishwa
- Tokens za GitHub zisiwe na ruhusa zaidi ya zisizohitajika
### Ufikiaji wa GitHub Models
- Tokeni za Ufikiaji wa Binafsi (PAT) zinahitajika kwa GitHub Models
- Tokeni zipo hifadhiwa kama mabadiliko ya mazingira
- Kamwe usiweka tokeni au vitambulisho kwenye hazina
- Tokens za Ufikiaji Binafsi (PAT) zinahitajika kwa GitHub Models
- Tokens zihifadhiwe kama mabadiliko ya mazingira
- Kamwe usiweke tokens au nyaraka za usalama hifadhidatani
## Vidokezo Zaidi
### Hadhira Lengwa
- Waanzilishi kamili wa maendeleo ya wavuti
- Waanzilishi kabisa wa maendeleo ya wavuti
- Wanafunzi na wanaojifunza peke yao
- Walimu wanaotumia mtaala darasani
- Maudhui yameundwa kwa upatikanaji na ukuaji wa ujuzi polepole
- Walimu wanaotumia mtaala katika madarasa
- Maudhui yamebuniwa kwa upatikanaji na kujenga ujuzi polepole
### Falsafa ya Elimu
- Mbinu za kujifunza kwa mradi
- Mbinu ya kujifunza kwa mradi
- Vipimo vya mara kwa mara vya maarifa (quiz)
- Mazoezi ya msimbo kwa vitendo
- Mazoezi ya kuandika msimbo kwa mikono
- Mifano ya matumizi halisi
- Kuzingatia misingi kabla ya fremu za kazi
- Kuzingatia misingi kabla ya mifumo ya kazi
### Matengenezo ya Hazina
### Matunzo ya Hifadhidata
- Jamii yenye shughuli za wanafunzi na wachangiaji
- Sasisho za mara kwa mara vya utegemezi na maudhui
- Masuala na majadiliano yanasimamiwa na wasimamizi
- Sasisho za tafsiri za moja kwa moja kupitia GitHub Actions
- Jamii hai ya wanafunzi na wachangiaji
- Sasisho za mara kwa mara kwa tegemezi na maudhui
- Masuala na majadiliano yanatiliwa mkazo na watunza
- Sasisho za tafsiri kwa njia ya otomatiki kupitia GitHub Actions
### Rasilimali Zinazohusiana
- [Moduli za Microsoft Learn](https://docs.microsoft.com/learn/)
- [Rasilimali za Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) inapendekezwa kwa wanafunzi
- Kozi za ziada: AI Inayotengeneza, Sayansi ya Data, ML, na mtaala wa IoT upo
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) inashauriwa kwa wanafunzi
- Kozi za ziada: AI ya kizazi, Sayansi ya Data, ML, IoT zinapatikana
### Kufanya Kazi na Miradi Maalum
Kwa maelekezo ya undani kuhusu miradi binafsi, rejelea faili za README katika:
- `quiz-app/README.md` - Programu ya quiz ya Vue 3
Kwa maelekezo ya kina ya miradi binafsi, rejelea mafaili ya README katika:
- `quiz-app/README.md` - Programu ya kucheza quiz ya Vue 3
- `7-bank-project/README.md` - Programu ya benki yenye uthibitishaji
- `5-browser-extension/README.md` - Maendeleo ya kiongezi cha kivinjari
- `6-space-game/README.md` - Uundaji wa mchezo wa Canvas
- `6-space-game/README.md` - Maendeleo ya mchezo wa Canvas
- `9-chat-project/README.md` - Mradi wa msaidizi wa mazungumzo wa AI
### Muundo wa Monorepo
Ingawa si monorepo ya kawaida, hazina hii ina miradi huru mingi:
- Kila somo ni huru
- Miradi haiwasiliani katika utegemezi
Ingawa si monorepo ya kawaida, hifadhidata hii ina miradi kadhaa huru:
- Kila somo ni tegemezi la pekee
- Miradi haishiriki tegemezi
- Fanya kazi kwenye miradi binafsi bila kuathiri mingine
- Clone hazina nzima kwa uzoefu wa mtaala kamili
- Dondoa hifadhidata nzima kwa uzoefu kamili wa mtaala
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Tangazo la kutokujali**:
Nyaraka hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ingawa tunajitahidi kwa usahihi, tafadhali fahamu kwamba tafsiri za kiotomatiki zinaweza kuwa na makosa au utata. Nyaraka ya asili kwa lugha yake ya asili inapaswa kuzingatiwa kama chanzo cha mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatuwajibiki kwa kutoelewana au tafsiri zisizo sahihi zinazotokana na matumizi ya tafsiri hii.
**Angalizo**:
Hati hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Wakati tunajitahidi kwa usahihi, tafadhali fahamu kwamba tafsiri za kiotomatiki zinaweza kuwa na makosa au upungufu katika usahihi. Hati ya asili katika lugha yake ya asili inapaswa kuchukuliwa kama chanzo chenye mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatuwajibiki kwa mkanganyiko wowote au kutoelewana kunakotokana na matumizi ya tafsiri hii.
[](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)
Jifunze misingi ya maendeleo ya wavuti na kozi yetu kamili ya wiki 12 iliyotolewa na Microsoft Cloud Advocates. Kila somo kati ya 24 linachunguza JavaScript, CSS, na HTML kupitia miradi ya vitendo kama vile terrariums, virutubisho vya kivinjari, na michezo ya anga. Shirikiana na vipimo, mijadala, na waraka wa vitendo. Boresha ujuzi wako na boresha ufahamu wako kwa mbinu bora ya kujifunza kupitia miradi. Anza safari yako ya kuweka nambari leo!
Jifunze misingi ya maendeleo ya wavuti kupitia kozi yetu kamili ya wiki 12 inayotolewa na Microsoft Cloud Advocates. Kila somo kati ya 24 linachunguza JavaScript, CSS, na HTML kupitia miradi ya vitendo kama vile terrariums, nyongeza za kivinjari, na michezo ya anga. Shirikiana na maswali ya mtihani, mijadala, na kazi za vitendo. Boresha ujuzi wako na uboresha kumbukumbu yako kwa kutumia mfumo wetu mzuri wa kujifunza unaotegemea miradi. Anza safari yako ya kuandika msimbo leo!
Jiunge na Jumuiya ya Azure AI Foundry Discord
Jiunge na Jamii ya Azure AI Foundry kwenye Discord
> Hii repository ina jumla ya tafsiri 50+ za lugha ambazo huongeza kiasi cha kupakua. Ili kukopa bila tafsiri, tumia sparse checkout:
> Hifadhi hii ina tafsiri za lugha 50+ ambazo huongeza sana ukubwa wa kupakua. Ili kukopa bila tafsiri, tumia sparse checkout:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,43 +48,43 @@ Fuata hatua hizi kuanza kutumia rasilimali hizi:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> Hii itakupa kila kitu unachohitaji kukamilisha kozi kwa upakuaji wa haraka zaidi.
> Hii itakupa kila kitu unachohitaji kukamilisha kozi kwa usakinishaji wa haraka zaidi.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ikiwa unataka kuongezwa kwa lugha za tafsiri zinazoungwa mkono zimetajwa [hapa](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Ikiwa unataka lugha za ziada za tafsiri kuungwa mkono zimetajwa [hapa](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _Je, wewe ni mwanafunzi?_
Tembelea [**ukurasa wa Kituo cha Wanafunzi**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) ambapo utapata rasilimali za waanzilishi, vifurushi vya wanafunzi na hata njia za kupata vocha ya cheti bure. Huu ndio ukurasa unaotaka kuweka alama na kuangalia mara kwa mara tunapobadilisha maudhui kila mwezi.
Tembelea [**ukurasa wa Kituo cha Wanafunzi**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) ambapo utapata rasilimali za wanaoanza, vifurushi vya wanafunzi na hata njia za kupata vocha ya cheti bure. Huu ndio ukurasa unaotaka kuweka kama alama na kuangalia mara kwa mara tunapobadilisha maudhui kila mwezi.
### 📣 Tangazo - Changamoto Mpya za GitHub Copilot Agent Mode za Kumaliza!
### 📣 Tangazo - Changamoto Mpya za Mode ya GitHub Copilot Agent kukamilisha!
Changamoto mpya imeongezwa, tafuta "GitHub Copilot Agent Challenge 🚀" katika sura nyingi. Hiyo ni changamoto mpya kwa ajili yako kukamilisha ukitumia GitHub Copilot na Agent mode. Ikiwa hujawahi kutumia Agent mode hapo awali, ina uwezo wa si tu kuzalisha maandishi bali pia kuunda na kuhariri faili, kuendesha amri zaidi.
Changamoto Mpya imeongezwa, tafuta "GitHub Copilot Agent Challenge 🚀" katika sura nyingi. Hiyo ni changamoto mpya kwako kukamilisha ukiwa unatumia GitHub Copilot na Mode ya Agent. Ikiwa hujawahi kutumia Mode ya Agent hapo awali, ina uwezo si tu wa kuandika maandishi bali pia kuunda na kuhariri mafaili, kuendesha amri na mengineyo.
### 📣 Tangazo - _Mradi Mpya wa Kujenga kwa Kutumia AI ya Kizazi_
### 📣 Tangazo - _Mradi Mpya wa kujenga kwa kutumia AI ya Kizazi_
Mradi mpya wa Msaidizi wa AI umeongezwa, angalia [mradi](./9-chat-project/README.md)
### 📣 Tangazo - _Mtaala Mpya_juu ya AI ya Kizazi kwa JavaScript umeachiliwa tu
### 📣 Tangazo - _Mtaala Mpya_kuhusu AI ya Kizazi kwa JavaScript umeachiliwa
> **Walimu**, tumetoa [mapendekezo baadhi](for-teachers.md) juu ya jinsi ya kutumia mtaala huu. Tunapenda maoni yenu [katika jukwaa letu la majadiliano](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
> **Walimu**, tumetoa [mapendekezo kadhaa](for-teachers.md) juu ya jinsi ya kutumia mtaala huu. Tunapenda maoni yako [katika jukwaa letu la majadiliano](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Wanafunzi](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, kwa kila somo, anza na jaribio la kabla ya mhadhara na fuata kwa kusoma nyenzo za mhadhara, kukamilisha shughuli mbalimbali na angalia ufahamu wako na jaribio la baada ya mhadhara.
**[Wanafunzi](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, kwa kila somo, anza na mtihani kabla ya mihadhara na fuata kwa kusoma nyenzo za mihadhara, kukamilisha shughuli mbalimbali na hakikisha unaelewa kupitia mtihani baada ya mihadhara.
Ili kuboresha uzoefu wako wa kujifunza, ungana na wenzao kufanya miradi pamoja! Majadiliano yanahimizwa katika [jukwaa letu la majadiliano](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) ambapo timu yetu ya wasimamizi itakuwa inapatikana kujibu maswali yako.
Ili kuboresha uzoefu wako wa kujifunza, ungana na wenzako kufanya miradi pamoja! Majadiliano yanahimizwa katika [jukwaa letu la majadiliano](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) ambapo timu yetu ya wasimamizi itakuwepo kujibu maswali yako.
Ili kuendeleza elimu yako, tunapendekeza sana kuchunguza [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) kwa nyenzo zaidi za masomo.
Ili kuendeleza elimu yako, tunapendekeza sana kuchunguza [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) kwa nyenzo zaidi za kusoma.
### 📋 Kuweka mazingira yako
### 📋 Kuandaa mazingira yako
Mtaala huu una mazingira ya maendeleo tayari kufanya kazi! Unapoanza unaweza kuchagua kuendesha mtaala kwenye [Codespace](https://github.com/features/codespaces/) (_eneo la kivinjari lisilo hitaji usakinishaji_), au sokoni kwenye kompyuta yako ukitumia mhariri wa maandishi kama [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Mtaala huu una mazingira ya maendeleo tayari! Unapoanza unaweza kuchagua kuendesha mtaala katika [Codespace](https://github.com/features/codespaces/) (_mazingira ya kivinjari, yasiyo na usakinishaji yanayohitajika_), au eneo la karibu kwenye kompyuta yako ukitumia mhariri wa maandishi kama [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Unda repository yako
Ili kukuwezesha kuhifadhi kazi yako kwa urahisi, inashauriwa uunde nakala yako mwenyewe ya repository hii. Unaweza kufanya hivyo kwa kubonyeza kitufe cha **Use this template** juu ya ukurasa huu. Hii itaunda repository mpya kwenye akaunti yako ya GitHub na nakala ya mtaala.
#### Tengeneza hifadhi yako
Ili iwe rahisi kuhifadhi kazi yako, inapendekezwa kutengeneza nakala yako mwenyewe ya hifadhi hii. Unaweza kufanya hivyo kwa kubonyeza kitufe cha **Use this template** juu ya ukurasa. Hii itatengeneza hifadhi mpya katika akaunti yako ya GitHub yenye nakala ya mtaala.
Fuata hatua hizi:
1. **Fagia Repository**: Bonyeza kitufe cha "Fork" kilichopo kona ya juu-kulia ya ukurasa huu.
Katika nakala yako ya repository uliyoiunda, bonyeza kitufe cha **Code** na chagua **Open with Codespaces**. Hii itaunda Codespace mpya utakayofanyia kazi.
Katika nakala yako ya hifadhi uliyotengeneza, bonyeza kitufe cha **Code** kisha chagua **Open with Codespaces**. Hii itatengeneza Codespace mpya utakaoweza kufanya kazi ndani yake.
#### Kuendesha mtaala eneo la karibu kwenye kompyuta yako
Ili kuendesha mtaala huu sokoni kwenye kompyuta yako, utahitaji mhariri wa maandishi, kivinjari na chombo cha mstari wa amri. Somo letu la kwanza, [Utangulizi wa Lugha za Programu na Vifaa vya Biashara](../../1-getting-started-lessons/1-intro-to-programming-languages), litakuongoza kupitia chaguzi mbalimbali za kila chombo ili uchague kinachofaa zaidi kwako.
Ili kuendesha mtaala huu eneo la karibu kwenye kompyuta yako, utahitaji mhariri wa maandishi, kivinjari na zana za mstari wa amri. Somo letu la kwanza, [Utangulizi wa Lugha za Programu na Zana za Kazi](../../1-getting-started-lessons/1-intro-to-programming-languages), litakuongoza kupitia chaguzi mbalimbali za kila zana ili kuchagua kama inakufaa.
Mapendekezo yetu ni kutumia [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kama mhariri wako, ambao pia una [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) iliyojengwa ndani. Unaweza kupakua Visual Studio Code [hapa](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Nakili hazina yako kwenye kompyuta yako. Unaweza kufanya hivyo kwa kubofya kitufe cha **Code** na kunakili URL:
Pendekezo letu ni kutumia [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kama mhariri wako, ambao pia una [Terminali](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) iliyojengwa ndani. Unaweza kupakua Visual Studio Code [hapa](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Nakili hazina yako kwenye kompyuta yako. Unaweza kufanya hivi kwa kubofya kitufe cha **Code** kisha kunakili URL:
[CodeSpace](./images/createcodespace.png)
@ -133,134 +133,134 @@ Mapendekezo yetu ni kutumia [Visual Studio Code](https://code.visualstudio.com/?
git clone <your-repository-url>
```
2. Fungua folda ndani ya Visual Studio Code. Unaweza kufanya hivyo kwa kubofya **File** > **Open Folder** na kuchagua folda uliyoinakili hivi karibuni.
2. Fungua folda katika Visual Studio Code. Unaweza kufanya hivi kwa kubofya **File** > **Open Folder** na kuchagua folda uliyoinakili hivi karibuni.
> Vipengele vya ziada vya Visual Studio Code vinavyopendekezwa:
> Virahisi vinavyopendekezwa vya Visual Studio Code:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - kutazama ukurasa wa HTML ndani ya Visual Studio Code
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - kutazama mapokeo ya kurasa za HTML ndani ya Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - kusaidia kuandika msimbo haraka zaidi
## 📂 Kila somo linajumuisha:
- sketchnote hiari
- video ya ziada hiari
- mtihani wa kujiandaa kabla ya somo
- video ya ziada ya hiari
- zoezi la kuwajalia kabla ya somo
- somo lililoandikwa
- kwa masomo yanayohusiana na miradi, mwongozo wa hatua kwa hatua jinsi ya kujenga mradi
- kwa masomo yanayotegemea miradi, miongozo ya hatua kwa hatua ya jinsi ya kujenga mradi
- ukaguzi wa maarifa
- changamoto
- usomaji wa ziada
- kazi ya nyumbani
- [mtihani baada ya somo](https://ff-quizzes.netlify.app/web/)
- [zoezi la baada ya somo](https://ff-quizzes.netlify.app/web/)
> **Kumbuka kuhusu mitihani**: Mitihani yote ipo katika folda ya Quiz-app, mitihani 48 kwa jumla yenye maswali matatu kila moja. Inapatikana [hapa](https://ff-quizzes.netlify.app/web/) programu ya mtihani inaweza kuendeshwa kwa ndani au kuwekwa katika Azure; fuata maelekezo katika folda ya `quiz-app`.
> **Kumbukumbu kuhusu mazoezi ya maswali**: Mazoezi yote yapo katika folda ya Quiz-app, jumla ya mazoezi 48 yenye maswali matatu kila moja. Yapatikana [hapa](https://ff-quizzes.netlify.app/web/), programu ya mazoezi inaweza kuendeshwa kwa ndani au kutolewa Azure; fuata maelekezo katika folda `quiz-app`.
## 🗃️ Masomo
| | Jina la Mradi | Dhana Zinazofundishwa | Malengo ya Kujifunza | Somo Linalohusiana | Mwandishi |
| 01 | Kuanzisha | Utangulizi wa Programu na Zana za Kazi | Jifunze msingi wa misingi ya lugha nyingi za programu na kuhusu programu zinazosaidia waendelezaji wa kitaalamu kufanya kazi zao | [Utangulizi wa Lugha za Programu na Zana za Kazi](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Kuanzisha | Misingi ya GitHub, pamoja na kufanya kazi na timu | Jinsi ya kutumia GitHub katika mradi wako, jinsi ya kushirikiana na wengine kwenye msimbo wa msingi | [Utangulizi wa GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Kuanzisha | Ufikikaji | Jifunze misingi ya upatikanaji wa mtandao | [Misingi ya Ufikikaji](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| | Jina la Mradi | Mada Zinazofundishwa | Malengo ya Kujifunza | Somo Lililohusishwa | Mwandishi |
| 01 | Kuanzia | Utangulizi wa Programu na Vifaa vya Kazi | Jifunze misingi ya lugha nyingi za programu na kuhusu programu zinazosaidia waendelezaji wa kitaalamu kufanya kazi zao | [Utangulizi wa Lugha za Programu na Vifaa vya Kazi](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Kuanzia | Msingi wa GitHub, ikijumuisha kazi ya timu | Jinsi ya kutumia GitHub katika mradi wako, jinsi ya kushirikiana na wengine katika msimbo wa programu | [Utangulizi wa GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Kuanzia | Upatikanaji | Jifunze misingi ya upatikanaji wa wavuti | [Misingi ya Upatikanaji](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Misingi ya JS | Aina za Data za JavaScript | Misingi ya aina za data za JavaScript | [Aina za Data](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Misingi ya JS | Vifunction na Mbinu | Jifunze kuhusu vifunction na mbinu za kusimamia mtiririko wa mantiki ya programu | [Vifunction na Mbinu](./2-js-basics/2-functions-methods/README.md) | Jasmine na Christopher |
| 06 | Misingi ya JS | Kufanya Maamuzi kwa JS | Jifunze jinsi ya kuunda masharti katika msimbo wako kwa kutumia mbinu za kufanya maamuzi | [Kufanya Maamuzi](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Misingi ya JS | Miskani na Mizunguko | Fanya kazi na data kwa kutumia miskani na mizunguko katika JavaScript | [Miskani na Mizunguko](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML Katika Vitendo | Jenga HTML kuunda terrarium mtandaoni, ukielekeza kwenye kuunda mpangilio | [Utangulizi wa HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS Katika Vitendo | Jenga CSS kupamba terrarium mtandaoni, ukielekeza misingi ya CSS ikijumuisha kupangilia ukurasa iwe rahisi kubadilika | [Utangulizi wa CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Kufunga za JavaScript, usimamizi wa DOM | Jenga JavaScript ili kufanya terrarium kufanya kazi kama interface ya buruta/achilia, ukielekeza kwenye kufunga na usimamizi wa DOM | [Kufunga za JavaScript, usimamizi wa DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Jenga Mchezo wa Kuandika | Jifunze jinsi ya kutumia matukio ya kibodi kuendesha mantiki ya programu yako ya JavaScript | [Programu Inayoendeshwa na Matukio](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Kufanya kazi na Vivinjari | Jifunze jinsi vivinjari vinavyofanya kazi, historia yao, na jinsi ya kuanzisha vipengele vya kwanza vya kiendelezaji cha kivinjari | [Kuhusu Vivinjari](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Kujenga fomu, kuitisha API na kuhifadhi vigezo katika hifadhi ya ndani | Jenga vipengele vya JavaScript vya kiendelezaji chako cha kivinjari kuitisha API kwa kutumia vigezo vilivyohifadhiwa katika hifadhi ya ndani | [API, Fomu, na Hifadhi ya Ndani](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Mchakato wa nyuma katika kivinjari, utendakazi wa wavuti | Tumia michakato ya nyuma ya kivinjari kusimamia ikoni ya kiendelezaji; jifunze kuhusu utendakazi wa wavuti na baadhi ya maboresho ya kufanya | [Mchakato wa Nyuma na Utendakazi](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Maendeleo ya Mchezo wa Juu zaidi na JavaScript | Jifunze kuhusu Urithi kwa kutumia Madarasa na Muundo pamoja na muundo wa Pub/Sub, tayari kwa kujenga mchezo | [Utangulizi wa Maendeleo ya Mchezo ya Juu](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Kuchora kwenye turubai | Jifunze kuhusu API ya Canvas, inayotumika kuchora vipengele kwenye skrini | [Kuchora kwenye Turubai](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Kusogeza vipengele kwenye skrini | Gundua jinsi vipengele vinavyoweza kupata mwendo kwa kutumia makosari ya Cartesian na API ya Canvas | [Kusogeza Vipengele](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Ugunduzi wa Migongano | Fanya vipengele kugongana na kuathiriana kwa kutumia kubofya funguo na toa kipengele cha mapumziko kuhakikisha utendakazi bora wa mchezo | [Ugunduzi wa Migongano](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Kuhifadhi alama | Fanya mahesabu ya hisabati kulingana na hali na utendakazi wa mchezo | [Kuhifadhi Alama](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Kuhitimisha na kuanzisha upya mchezo | Jifunze kuhusu kumaliza na kuanzisha upya mchezo, pamoja na kusafisha rasilimali na kuweka upya thamani za vigezo | [Hali ya Kumaliza](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | Violezo vya HTML na Njia katika Tovuti Mtandao | Jifunze jinsi ya kuunda muundo wa tovuti yenye kurasa nyingi kwa kutumia routing na violezo vya HTML | [Violezo vya HTML na Njia](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Jenga Fomu ya Kuingia na Usajili | Jifunze kuhusu ujenzi wa fomu na kushughulikia taratibu za uhakiki | [Fomu](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Mbinu za Kupata na Kutumia Data | Jinsi data inavyotiririka ndani na nje ya app yako, jinsi ya kuipata, kuhifadhi na kuizitupa | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Dhana za Usimamizi wa Hali | Jifunze jinsi app yako inavyodumisha hali na jinsi ya kuiendesha kwa mpangilio | [Usimamizi wa Hali](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Kufanya kazi na VScode | Jifunze jinsi ya kutumia mhariri wa msimbo| [Tumia Mhariri wa Msimbo wa VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Kufanya kazi na AI | Jifunze jinsi ya kujenga msaidizi wako wa AI | [Mradi wa Msaidizi wa AI](./9-chat-project/README.md) | Chris |
| 05 | Misingi ya JS | Kazi na Mbinu | Jifunze kuhusu kazi na mbinu za kusimamia mtiririko wa mantiki ya programu | [Kazi na Mbinu](./2-js-basics/2-functions-methods/README.md) | Jasmine na Christopher |
| 06 | Misingi ya JS | Kufanya Maamuzi na JS | Jifunze jinsi ya kuunda masharti katika msimbo wako kwa kutumia mbinu za kufanya maamuzi | [Kufanya Maamuzi](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Misingi ya JS | Array na Loops | Fanya kazi na data kwa kutumia array na loops katika JavaScript | [Array na Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML Katika Vitendo | Jenga HTML ili kuunda terrarium mtandaoni, ukizingatia ujenzi wa mpangilio | [Utangulizi wa HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS Katika Vitendo | Jenga CSS kuunda mtindo wa terrarium mtandaoni, ukizingatia misingi ya CSS ikiwa pamoja na kufanya ukurasa uwe wa responsive | [Utangulizi wa CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Jifunze JavaScript Closures, na uendeshaji DOM | Jenga JavaScript ili terrarium ifanye kazi kama interface ya buruta/acha, ukizingatia closures na uendeshaji wa DOM | [JavaScript Closures, uendeshaji wa DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Jenga Mchezo wa Kuandika | Jifunze jinsi ya kutumia matukio ya keyboard kuendesha mantiki ya app yako ya JavaScript | [Programu Dhirio kwa Matukio](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Kazi na Vivinjari | Jifunze jinsi vivinjari vinavyofanya kazi, historia yao, na jinsi ya kuunda vipengele vya awali vya kiendelezi cha kivinjari | [Kuhusu Vivinjari](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Jenga fomu, piga API na hifadhi mabadiliko kwenye hifadhi ya ndani | Jenga vipengele vya JavaScript vya kiendelezi chako cha kivinjari kupiga API kwa kutumia mabadiliko yaliyohifadhiwa kwenye hifadhi ya ndani | [API, Fomu, na Hifadhi ya Ndani](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Michakato ya nyuma katika kivinjari, utendaji wa wavuti | Tumia michakato ya nyuma ya kivinjari kusimamia ikoni ya kiendelezi; jifunze kuhusu utendaji wa wavuti na baadhi ya mbinu za kuboresha kufanya kazi vizuri | [Kazi za Nyuma na Utendaji](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Maendeleo ya Mchezo Zaidi kwa JavaScript | Jifunze kuhusu Urithi kwa kutumia madarasa na muundo pamoja na muundo wa Pub/Sub, tayari kwa kujenga mchezo | [Utangulizi kwa Maendeleo ya Mchezo Zaidi](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Kuchora kwenye Canvas | Jifunze kuhusu API ya Canvas, inayotumika kuchora vipengele kwenye skrini | [Kuchora kwenye Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Kuhamisha vipengele kwenye skrini | Gundua jinsi vipengele vinaweza kupata mwendo kwa kutumia koordineti za Cartesian na API ya Canvas | [Kuhamisha Vipengele](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Ugunduzi wa Mgongano | Fanya vipengele vikagongane na kujibu kwa kila mmoja kwa kutumia vitufe vya kuandika na toa kazi ya hifadhi ili kuhakikisha utendaji mzuri wa mchezo | [Ugunduzi wa Mgongano](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Kuhifadhi alama | Fanya mahesabu ya hisabati kulingana na hali na utendaji wa mchezo | [Kuhifadhi alama](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Kumaliza na kuanza upya mchezo | Jifunze kuhusu kumaliza na kuanza upya mchezo, ikijumuisha kusafisha mali na kuweka tena thamani za mabadiliko | [Hali ya Kumaliza](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | Violezo vya HTML na Njia katika Programu ya Wavuti | Jifunze jinsi ya kuunda miundo ya tovuti yenye kurasa nyingi kwa kutumia njia na violezo vya HTML | [Violezo vya HTML na Njia](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Jenga Fomu ya Kuingia na Usajili | Jifunze kuhusu ujenzi wa fomu na kushughulikia taratibu za uthibitishaji | [Fomu](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Mbinu za Kupata na Kutumia Data | Jinsi data inavyoingia na kutoka kwenye app yako, jinsi ya kuipata, kuihifadhi, na kuitupa | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Misingi ya Usimamizi wa Hali | Jifunze jinsi app yako inavyohifadhi hali na jinsi ya kuisimamia kwa njia ya programu | [Usimamizi wa Hali](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Kazi na VScode | Jifunze jinsi ya kutumia mhariri wa msimbo| [Tumia Mhariri wa VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Kazi na AI | Jifunze jinsi ya kujenga msaidizi wako wa AI | [Mradi wa Msaidizi wa AI](./9-chat-project/README.md) | Chris |
## 🏫 Falsafa ya Mafunzo
## 🏫 Mbinu ya Kufundishia
Mtaala wetu umeundwa kwa kanuni mbili muhimu za kielimu:
* kujifunza kwa miradi
* mitihani ya mara kwa mara
Mtaala wetu umeundwa kwa misingi miwili muhimu ya kielimu:
* kujifunza kupitia miradi
* mazoezi ya mara kwa mara
Mpango huu hufundisha misingi ya JavaScript, HTML, na CSS, pamoja na zana na mbinu za hivi karibuni zinazotumiwa na waendelezaji wa wavuti wa sasa. Wanafunzi watapata fursa ya kufanya mazoezi kwa mikono kwa kujenga mchezo wa kuandika, terrarium halisi mtandaoni, kiendelezaji cha kivinjari kinachozingatia mazingira, mchezo wa aina ya wavamizi wa anga, na programu ya benki kwa biashara. Mwisho wa mfululizo huu, wanafunzi watakuwa na uelewa thabiti wa uendelezaji wa wavuti.
Mpango huu hufundisha misingi ya JavaScript, HTML, na CSS, pamoja na zana na mbinu za hivi karibuni zinazotumiwa na waendelezaji wa wavuti wa leo. Wanafunzi watapata fursa ya kupata uzoefu wa vitendo kwa kujenga mchezo wa kuandika, terrarium wa kidijitali, kiendelezi cha kivinjari rafiki wa mazingira, mchezo wa wavamizi wa anga, na programu ya benki kwa biashara. Mwisho wa mfululizo huu, wanafunzi watakuwa na uelewa mzuri wa maendeleo ya wavuti.
> 🎓 Unaweza kuchukua masomo ya mwanzo ya mtaala huu kama [Njia ya Kujifunza](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) kwenye Microsoft Learn!
> 🎓 Unaweza kuchukua masomo machache ya kwanza katika mtaala huu kama [Njia ya Kujifunza](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) kwenye Microsoft Learn!
Kwa kuhakikisha kuwa maudhui yanahusiana na miradi, mchakato unakuwa wa kuvutia zaidi kwa wanafunzi na uhifadhi wa dhana utaongezeka. Pia tuliandika masomo kadhaa ya mwanzo kuhusu misingi ya JavaScript kuanzisha dhana, pamoja na video kutoka kwenye mkusanyo wa “"[Mfululizo wa Waanzilishi wa: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)” ya mafunzo ya video, baadhi ya waandishi wake walichangia kwa mtaala huu.
Kwa kuhakikisha kuwa maudhui yanaendana na miradi, mchakato unakuwa wa kuvutia zaidi kwa wanafunzi na kuhifadhi dhana kutaboreshwa. Pia tuliandika masomo kadhaa ya mwanzo juu ya misingi ya JavaScript ili kuanzisha dhana, yanayounganishwa na video kutoka kwa mkusanyiko wa "[Mfululizo wa Waanzilishi kwa: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", ambapo baadhi ya waandishi wake walichangia mtaala huu.
Pia, mtihani wa chini kabla ya darasa unaweka nia ya mwanafunzi kuelekea kujifunza somo, wakati mtihani wa pili baada ya darasa unahakikisha uhifadhi zaidi. Mtaala huu umeundwa kuwa rahisi na wa kufurahisha na unaweza kuchukuliwa kwa ujumla au sehemu. Miradi huanza ndogo na kuendelea kuwa ngumu zaidi mwishoni mwa mzunguko wa wiki 12.
Aidha, zoezi la nyepesi kabla ya darasa hutoa nia kwa mwanafunzi kuelekea kujifunza mada, wakati zoezi la pili baada ya darasa linahakikisha uhifadhi wa zaidi. Mtaala huu umetengenezwa kuwa rahisi na wa kufurahisha na unaweza kuchukuliwa kwa mkamilifu au sehemu. Miradi huanza midogo na kuwa changamoto zaidi mwishoni mwa mzunguko wa wiki 12.
Ingawa tumependelea kuepuka kuanzisha mifumo ya JavaScript ili kuzingatia ujuzi wa msingi unaohitajika kama mendelezaji wa wavuti kabla ya kutumia mfumo, hatua njema inayofuata baada ya kukamilisha mtaala huu ni kujifunza kuhusu Node.js kupitia mkusanyo mwingine wa video: "[Mfululizo wa Waanzilishi wa: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Ingawa tuliepuka kuanzisha mifumo ya JavaScript ili kuzingatia ujuzi wa msingi unaohitajika kama msanidi wa wavuti kabla ya kutumia mfumo, hatua nzuri inayofuata kumalizia mtaala huu ni kujifunza kuhusu Node.js kupitia mkusanyiko mwingine wa video: "[Mfululizo wa Waanzilishi kwa: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Tembelea [Kanuni Zetu za Maadili](CODE_OF_CONDUCT.md) na miongozo ya [Kushiriki](CONTRIBUTING.md). Tunakukaribisha maoni yako yenye kujenga!
> Tembelea [Kanuni zetu za Maadili](CODE_OF_CONDUCT.md) na mwongozo wa [Kushiriki](CONTRIBUTING.md). Tunakaribisha maoni yako ya kujenga!
## 🧭 Upatikanaji bila Mtandao
## 🧭 Ufikiaji wa Kupatikana Bila Mtandao
Unaweza kuendesha nyaraka hii bila mtandao kwa kutumia [Docsify](https://docsify.js.org/#/). Nakili repozitori hii, [sakinisha Docsify](https://docsify.js.org/#/quickstart) kwenye mashine yako ya ndani, kisha katika folda kuu ya repozitori hii, andika `docsify serve`. Tovuti itahudumiwa kwenye lango la 3000 kwenye localhost yako: `localhost:3000`.
Unaweza kuendesha nyaraka hii bila mtandao kwa kutumia [Docsify](https://docsify.js.org/#/). Fanya fork ya repo hii, [sakinisha Docsify](https://docsify.js.org/#/quickstart) kwenye kompyuta yako, kisha katika folda ya mizizi ya repo hii, andika `docsify serve`. Tovuti itapelekwa kwenye bandari 3000 kwenye localhost yako: `localhost:3000`.
## 📘 PDF
PDF ya masomo yote inaweza kupatikana [hapa](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
PDF ya masomo yote inapatikana [hapa](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Kozi Nyingine
Timu yetu hutengeneza kozi nyingine! Angalia:
Timu yetu hutoa kozi nyingine! Angalia:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
---
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Mfululizo wa AI Inayotengeneza
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
### Mfululizo wa AI ya Kizazi
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
---
### Msingi wa Kujifunza
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
### Kujifunza Msingi
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Mfululizo wa Copilot
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Kupata Msaada
Ikiwa umekwama au una maswali kuhusu kujenga programu za AI. Jiunge na wanafunzi wenzako na waendelezaji wenye uzoefu katika mijadala kuhusu MCP. Ni jamii inayounga mkono ambapo maswali yanakaribishwa na maarifa husambazwa kwa huru.
Ikiwa unaenda kikwazo au una maswali yoyote kuhusu ujenzi wa programu za AI. Jiunge na wanafunzi wenzako na watengenezaji wenye uzoefu katika mijadala kuhusu MCP. Ni jamii ya kusaidia ambapo maswali yanakaribishwa na maarifa hushirikiwa kwa uhuru.
@ -270,11 +270,11 @@ Ikiwa una maoni kuhusu bidhaa au makosa wakati wa kujenga tembelea:
## Leseni
Hifadhidata hii imepewa leseni chini ya leseni ya MIT. Angalia faili la [LICENSE](../../LICENSE) kwa maelezo zaidi.
Hazina hii inalindwa chini ya leseni ya MIT. Tazama faili la [LICENSE](../../LICENSE) kwa maelezo zaidi.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Takwimu ya Kukataa**:
Hati hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ingawa tunajitahidi kwa usahihi, tafadhali fahamu kuwa tafsiri za moja kwa moja zinaweza kuwa na makosa au kasoro. Hati ya awali katika lugha yake ya asili inapaswa kuzingatiwa kama chanzo chenye mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu na ya binadamu inapendekezwa. Hatuwajibiki kwa kutoelewana au tafsiri mbaya yatokanayo na matumizi ya tafsiri hii.
**Sekela**:
Hati hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ingawa tunajitahidi kufikia usahihi, tafadhali fahamuni kwamba tafsiri za moja kwa moja zinaweza kuwa na makosa au upungufu. Hati asilia katika lugha yake ya asili inapaswa kuzingatiwa kama chanzo chenye mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatubebwi dhamana kwa kutoelewana au tafsiri potofu zinazotokana na matumizi ya tafsiri hii.
localizeflow[bot]
6 days ago