Web-Dev-For-Beginners/translations/cs

Postupujte podle těchto kroků, abyste mohli začít používat tyto zdroje:

1. Forkněte repozitář: Klikněte
2. Naklonujte repozitář: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Připojte se na Discord Azure AI Foundry a setkejte se s experty a dalšími vývojáři

Webový vývoj pro začátečníky - Kurikulum

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í se zaměřuje na JavaScript, 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ů, diskusí a praktických úkolů. Zlepšete své dovednosti a optimalizujte si zapamatování znalostí díky našemu efektivnímu přístupu založenému na projektech. Začněte svou cestu kódování ještě dnes!

🌐 Podpora více jazyků

Podporováno prostřednictvím GitHub Action (automatizované a vždy aktuální)

Francouzština | Španělština | Němčina | Ruština | Arabština | Perština (Farsi) | Urdu | Čínština (zjednodušená) | Čínština (tradiční, Macao) | Čínština (tradiční, Hongkong) | Čínština (tradiční, Tchaj-wan) | Japonština | Korejština | Hindština | Bengálština | Maráthština | Nepálština | Paňdžábština (Gurmukhi) | Portugalština (Portugalsko) | Portugalština (Brazílie) | Italština | Polština | Turečtina | Řečtina | Thajština | Švédština | Dánština | Norština | Finština | Nizozemština | Hebrejština | Vietnamština | Indonéština | Malajština | Tagalog (Filipíny) | Svahilština | Maďarština | Čeština | Slovenština | Rumunština | Bulharština | Srbština (cyrilice) | Chorvatština | Slovinština | Ukrajinština | Barmština (Myanmar)

Pokud si přejete přidat další překlady, seznam podporovaných jazyků najdete zde

🧑‍🎓 Jste student?

Navštivte stránku Student Hub, kde najdete zdroje pro začátečníky, studentské balíčky a dokonce způsoby, jak získat voucher na certifikát zdarma. Tuto stránku si uložte do záložek a pravidelně ji kontrolujte, protože obsah měníme každý měsíc.

📣 Oznámení - Nový projekt na tvorbu pomocí generativní AI

Právě přidán nový projekt AI Assistant, podívejte se na něj projekt

📣 Oznámení - Nové kurikulum o generativní AI pro JavaScript bylo právě vydáno

Nezmeškejte naše nové kurikulum o generativní AI!

Navštivte https://aka.ms/genai-js-course a začněte!

• Lekce pokrývající vše od základů po RAG.
• Interakce s historickými postavami pomocí GenAI a naší doprovodné aplikace.
• Zábavný a poutavý příběh, budete cestovat časem!

Každá lekce obsahuje úkol k dokončení, kontrolu znalostí a výzvu, která vás provede učením témat, jako jsou:

• Tvorba a optimalizace promptů
• Generování textových a obrazových aplikací
• Vyhledávací aplikace

Navštivte https://aka.ms/genai-js-course a začněte!

🌱 Začínáme

Učitelé, zahrnuli jsme několik návrhů, jak toto kurikulum využít. Budeme rádi za vaši zpětnou vazbu v našem diskusním fóru!

Studenti, u každé lekce začněte přednáškovým kvízem a pokračujte čtením materiálů, plněním různých aktivit a ověřte si své znalosti pomocí kvízu po přednášce.

Pro zlepšení vašeho vzdělávacího zážitku se spojte s ostatními studenty a pracujte na projektech společně! Diskuse jsou podporovány v našem diskusním fóru, kde bude náš tým moderátorů k dispozici, aby odpověděl na vaše otázky.

Pro další vzdělávání důrazně doporučujeme prozkoumat Microsoft Learn pro další studijní materiály.

📋 Nastavení vašeho prostředí

Toto kurikulum má připravené vývojové prostředí! Jakmile začnete, můžete si vybrat, zda budete kurikulum spouštět v Codespace (prostředí založené na prohlížeči, bez nutnosti instalace), nebo lokálně na vašem počítači pomocí textového editoru, jako je Visual Studio Code.

Vytvořte svůj repozitář

Abyste si mohli snadno uložit svou práci, doporučujeme vytvořit si vlastní kopii tohoto repozitáře. Můžete to 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í kurikula.

Postupujte podle těchto kroků:

1. Forkněte repozitář: Klikněte na tlačítko "Fork" v pravém horním rohu této stránky.
2. Naklonujte repozitář: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Spuštění kurikula v Codespace

Ve vaší kopii tohoto repozitáře, kterou jste vytvořili, klikněte na tlačítko Code a vyberte Open with Codespaces. Tím se vytvoří nový Codespace, ve kterém můžete pracovat.

!Codespace./images/createcodespace.png)

Spuštění kurikula lokálně na vašem počítači

Pro spuštění tohoto kurikula 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ů, vás provede různými možnostmi pro každý z těchto nástrojů, abyste si mohli vybrat, co vám nejlépe vyhovuje.

Naše doporučení je použít Visual Studio Code jako editor, který má také vestavěný Terminál. Visual Studio Code si můžete stáhnout zde.

1. Naklonujte svůj repozitář na váš počítač. Můžete to udělat kliknutím na tlačítko Code a zkopírováním URL:

   !CodeSpace

   Poté otevřete Terminál ve Visual Studio Code a spusťte následující příkaz, přičemž <your-repository-url> nahraďte URL, kterou jste právě zkopírovali:

   git clone <your-repository-url>
   

2. Otevřete složku ve Visual Studio Code. Můžete to udělat kliknutím na File

Otevřete složku a vyberte složku, kterou jste právě naklonovali. Doporučené rozšíření pro Visual Studio Code:

• Live Server - pro náhled HTML stránek přímo ve Visual Studio Code
• Copilot - pro rychlejší psaní kódu

📂 Každá lekce obsahuje:

• volitelný sketchnote
• volitelné doplňkové video
• zahřívací kvíz před lekcí
• psanou lekci
• u projektově zaměřených lekcí podrobné návody na vytvoření projektu
• kontrolní otázky
• výzvu
• doplňkové čtení
• úkol
• kvíz po lekci

Poznámka ke kvízům: Všechny kvízy jsou obsaženy ve složce Quiz-app, celkem 48 kvízů, každý se třemi otázkami. Jsou dostupné zde a aplikaci pro kvízy lze spustit lokálně nebo nasadit na Azure; postupujte podle pokynů ve složce quiz-app.

🗃️ Lekce

	Název projektu	Probírané koncepty	Cíle učení	Odkaz na lekci	Autor
01	Začínáme	Úvod do programování a nástroje pro vývojáře	Naučte se základní principy většiny programovacích jazyků a software, který pomáhá profesionálním vývojářům při práci	Úvod do programovacích jazyků a nástrojů	Jasmine
02	Začínáme	Základy GitHubu, včetně týmové spolupráce	Jak používat GitHub ve vašem projektu a jak spolupracovat s ostatními na kódu	Úvod do GitHubu	Floor
03	Začínáme	Přístupnost	Naučte se základy přístupnosti webu	Základy přístupnosti	Christopher
04	Základy JS	Datové typy v JavaScriptu	Základy datových typů v JavaScriptu	Datové typy	Jasmine
05	Základy JS	Funkce a metody	Naučte se o funkcích a metodách pro řízení logiky aplikace	Funkce a metody	Jasmine a Christopher
06	Základy JS	Rozhodování v JavaScriptu	Naučte se vytvářet podmínky v kódu pomocí metod pro rozhodování	Rozhodování	Jasmine
07	Základy JS	Pole a cykly	Práce s daty pomocí polí a cyklů v JavaScriptu	Pole a cykly	Jasmine
08	Terárium	HTML v praxi	Vytvořte HTML pro online terárium, zaměřte se na tvorbu rozvržení	Úvod do HTML	Jen
09	Terárium	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	Jen
10	Terárium	Uzávěry v JavaScriptu, manipulace DOM	Vytvořte JavaScript pro funkčnost terária jako drag/drop rozhraní, zaměřte se na uzávěry a manipulaci DOM	Uzávěry a manipulace DOM	Jen
11	Hra na psaní	Vytvoření hry na psaní	Naučte se používat události klávesnice pro řízení logiky aplikace	Programování řízené událostmi	Christopher
12	Rozšíření prohlížeče	Práce s prohlížeči	Naučte se, jak fungují prohlížeče, jejich historii a jak vytvořit první prvky rozšíření prohlížeče	O prohlížečích	Jen
13	Rozšíření prohlížeče	Vytvoření formuláře, volání API a ukládání proměnných do místního úložiště	Vytvořte JavaScriptové prvky rozšíření prohlížeče pro volání API pomocí proměnných uložených v místním úložišti	API, formuláře a místní úložiště	Jen
14	Rozšíření prohlížeče	Procesy na pozadí v prohlížeči, výkon webu	Použijte procesy na pozadí pro správu ikony rozšíření; naučte se o výkonu webu a optimalizacích	Procesy na pozadí a výkon	Jen
15	Vesmírná hra	Pokročilý vývoj her v JavaScriptu	Naučte 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	Chris
16	Vesmírná hra	Kreslení na plátno	Naučte se používat Canvas API pro kreslení prvků na obrazovku	Kreslení na plátno	Chris
17	Vesmírná hra	Pohyb prvků na obrazovce	Objevte, jak mohou prvky získat pohyb pomocí kartézských souřadnic a Canvas API	Pohyb prvků	Chris
18	Vesmírná hra	Detekce kolizí	Naučte se, jak prvky kolidují a reagují na sebe pomocí stisků kláves a jak zajistit výkon hry pomocí funkce cooldown	Detekce kolizí	Chris
19	Vesmírná hra	Počítání skóre	Provádějte matematické výpočty na základě stavu a výkonu hry	Počítání skóre	Chris
20	Vesmírná hra	Ukončení a restartování hry	Naučte se, jak ukončit a restartovat hru, včetně vyčištění prostředků a resetování hodnot proměnných	Podmínka ukončení	Chris
21	Bankovní aplikace	HTML šablony a směrování v aplikaci	Naučte se vytvořit strukturu více stránkové webové aplikace pomocí směrování a HTML šablon	HTML šablony a směrování	Yohan
22	Bankovní aplikace	Vytvoření přihlašovacího a registračního formuláře	Naučte se vytvářet formuláře a zpracovávat validační rutiny	Formuláře	Yohan
23	Bankovní aplikace	Metody získávání a používání dat	Jak data proudí do vaší aplikace a z ní, jak je získávat, ukládat a mazat	Data	Yohan
24	Bankovní aplikace	Koncepty správy stavu	Naučte se, jak vaše aplikace uchovává stav a jak jej programově spravovat	Správa stavu	Yohan
25	Editor kódu VScode	Práce s VScode	Naučte se používat editor kódu	Použití editoru VScode	Chris
26	AI asistenti	Práce s AI	Naučte se vytvořit vlastního AI asistenta	Projekt AI asistenta	Chris

🏫 Pedagogika

Náš učební plán je navržen s ohledem na dva klíčové pedagogické 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 získají praktické zkušenosti vytvořením hry na psaní, 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 studenti mít pevné základy ve vývoji webu.

🎓 První lekce tohoto kurzu si můžete projít jako učební cestu na Microsoft Learn!

Díky propojení obsahu s projekty je proces pro studenty poutavější a zlepšuje se zapamatování konceptů. Také jsme vytvořili několik úvodních lekcí o základech JavaScriptu, které jsou doplněny videi ze série "Beginners Series to: JavaScript", na jejichž tvorbě se podíleli i autoři tohoto kurzu.

Kromě toho nízkostresový kvíz před lekcí nastaví studentovu pozornost na dané téma, zatímco druhý kvíz po lekci zajistí lepší zapamatování. Tento učební plán byl navržen tak, aby byl flexibilní a zábavný, a lze jej absolvovat celý nebo jen jeho části. Projekty začínají jednoduše a postupně se stávají složitějšími během 12týdenního cyklu.

Záměrně jsme se vyhnuli zavádění JavaScriptových frameworků, abychom se soustředili na základní dovednosti potřebné pro webového vývojáře před přijetím frameworku. Dalším krokem po dokončení tohoto kurzu by mohlo být učení o Node.js prostřednictvím jiné série videí: "Beginner Series to: Node.js".

Navštivte naše Pravidla chování a Pokyny pro přispívání. Uvítáme vaši konstruktivní zpětnou vazbu!

🧭 Offline přístup

Tuto dokumentaci můžete spustit offline pomocí Docsify. Forkněte toto repo, nainstalujte Docsify na svůj lokální počítač a poté ve složce root tohoto repozitáře zadejte docsify serve. Web bude dostupný na portu 3000 na vašem localhostu: localhost:3000.

📘 PDF

PDF všech lekcí najdete zde.

🎒 Další kurzy

Náš tým vytváří i další kurzy! Podívejte se na:

• Generativní AI pro začátečníky
• Generativní AI pro začátečníky .NET
• Generativní AI s JavaScriptem
• Generativní AI s Javou
• AI pro začátečníky
• Data Science pro začátečníky
• ML pro začátečníky
• Kybernetická bezpečnost pro začátečníky
• Webový vývoj pro začátečníky
• IoT pro začátečníky
• Vývoj XR pro začátečníky
• Ovládnutí GitHub Copilot pro agentické použití
• Ovládnutí GitHub Copilot pro vývojáře C#/.NET
• Vyberte si vlastní dobrodružství s Copilotem

Licence

Tento repozitář je licencován pod licencí MIT. Další informace naleznete v souboru LICENSE.

---

Upozornění:
Tento dokument byl přeložen pomocí služby pro automatický překlad Co-op Translator. I když se snažíme o co největší přesnost, mějte prosím na paměti, že automatické překlady mohou obsahovat chyby nebo nepřesnosti. Původní dokument v jeho původním jazyce by měl být považován za závazný zdroj. Pro důležité informace doporučujeme profesionální lidský překlad. Neodpovídáme za žádná nedorozumění nebo nesprávné výklady vyplývající z použití tohoto překladu.