Web-Dev-For-Beginners/translations/sk

Vývoj webu pre začiatočníkov - Učebný plán

Naučte sa základy vývoja webu s naším 12-týždňovým komplexným kurzom od Microsoft Cloud Advocates. Každá z 24 lekcií sa zameriava na JavaScript, CSS a HTML prostredníctvom praktických projektov ako teráriá, rozšírenia pre prehliadače a vesmírne hry. Zapojte sa do kvízov, diskusií a praktických úloh. Zlepšite svoje zručnosti a optimalizujte uchovávanie vedomostí pomocou našej efektívnej projektovo orientovanej pedagogiky. Začnite svoju cestu programovania ešte dnes!

Pripojte sa ku komunite Azure AI Foundry na Discorde

Nasledujte tieto kroky, aby ste začali používať tieto zdroje:

1. Forknite si repozitár: Kliknite na
2. Klónujte repozitár: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Pripojte sa ku komunite Azure AI Foundry na Discorde a spoznajte odborníkov a kolegov vývojárov

🌐 Podpora viacerých jazykov

Podporované cez GitHub Action (automatizované a vždy aktuálne)

Preferujete klonovanie lokálne?

Tento repozitár obsahuje viac ako 50 jazykových prekladov, čo výrazne zväčšuje veľkosť sťahovania. Ak chcete klonovať bez prekladov, použite sparse checkout:

Bash / macOS / Linux:

git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'

 
**CMD (Windows):**  
> ```cmd
git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"

Toto vám poskytne všetko potrebné na dokončenie kurzu s oveľa rýchlejším sťahovaním.

Ak chcete podporu ďalších jazykov prekladov, nájdete ich zoznam tu

🧑‍🎓 Ste študent?

Navštívte študentskú stránku Student Hub, kde nájdete zdroje pre začiatočníkov, študentské balíčky a dokonca spôsoby, ako získať bezplatný certifikátový poukaz. Toto je stránka, ktorú si chcete uložiť medzi záložky a čas od času ju skontrolovať, pretože obsah sa mení každý mesiac.

📣 Oznámenie - Nové výzvy režimu GitHub Copilot Agent na dokončenie!

Pridaná nová výzva, nájdite "GitHub Copilot Agent Challenge 🚀" v väčšine kapitol. Je to nová výzva pre vás na dokončenie pomocou GitHub Copilot a režimu Agent. Ak ste režim Agent ešte nepoužili, dokáže nielen generovať text, ale aj tvoriť a upravovať súbory, spúšťať príkazy a ďalšie.

📣 Oznámenie - Nový projekt postavený pomocou generatívnej AI

Pridaný nový projekt AI asistenta, pozrite si ho projekt

📣 Oznámenie - Nový učebný plán na Generatívnu AI pre JavaScript práve vydaný

Nezmeškajte náš nový učebný plán Generatívnej AI!

Navštívte https://aka.ms/genai-js-course a začnite!

• Lekcie pokrývajú všetko od základov po RAG.
• Interagujte s historickými postavami pomocou GenAI a našej sprievodnej aplikácie.
• Zábavný a pútavý príbeh, budete cestovať časom!

Každá lekcia obsahuje úlohu na dokončenie, kontrolu vedomostí a výzvu, ktorá vás prevedie učením tém ako:

• Promptovanie a návrh promptov
• Generovanie textových a obrazových aplikácií
• Vyhľadávacie aplikácie

Navštívte https://aka.ms/genai-js-course a začnite!

🌱 Začíname

Učitelia, pridali sme niekoľko návrhov, ako používať tento učebný plán. Budeme radi za vašu spätnú väzbu v našom diskusnom fóre!

Študenti, ku každej lekcii začnite prednáškovým kvízom a pokračujte čítaním prednáškového materiálu, dokončovaním rôznych aktivít a overte si pochopenie pomocou povykaného kvízu.

Pre lepší zážitok z učenia sa spojte so svojimi spolužiakmi, aby ste mohli spoločne pracovať na projektoch! Diskusie sú vítané v našom diskusnom fóre, kde bude tím moderátorov pripravený odpovedať na vaše otázky.

Pre ďalšie vzdelávanie dôrazne odporúčame preskúmať Microsoft Learn pre ďalšie študijné materiály.

📋 Nastavenie vášho prostredia

Tento učebný plán má pripravené vývojové prostredie! Na začiatku môžete vybrať spustenie učebného plánu v Codespace (prostredie v prehliadači, nie je potrebná inštalácia) alebo lokálne vo vašom počítači pomocou textového editora ako Visual Studio Code.

Vytvorte si vlastný repozitár

Pre jednoduché ukladanie svojej práce odporúčame vytvoriť si vlastnú kópiu tohto repozitára. Môžete to urobiť kliknutím na tlačidlo Použiť túto šablónu v hornej časti stránky. Toto vytvorí nový repozitár vo vašom účte GitHub s kópiou učebného plánu.

Postupujte podľa týchto krokov:

1. Forknite si repozitár: Kliknite na tlačidlo „Fork“ v pravom hornom rohu tejto stránky.
2. Klónujte repozitár: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Spustenie učebného plánu v Codespace

Vo vašej vlastnej kópii repozitára, ktorú ste vytvorili, kliknite na tlačidlo Code a vyberte Open with Codespaces. Tým sa pre vás vytvorí nový Codespace na prácu.

Spustenie učebného plánu lokálne na vašom počítači

Ak chcete spustiť učebný plán lokálne, budete potrebovať textový editor, prehliadač a nástroj príkazového riadku. Naša prvá lekcia, Úvod do programovacích jazykov a nástrojov remesla, vás prevedie rôznymi možnosťami pre každý z týchto nástrojov, aby ste si vybrali, čo vám najviac vyhovuje.

Našou odporúčanou voľbou je použiť Visual Studio Code ako editor, ktorý má tiež zabudovaný Terminál. Visual Studio Code si môžete stiahnuť tu.

1. Klonujte si svoj repozitár do svojho počítača. Môžete to urobiť kliknutím na tlačidlo Code a skopírovaním URL:

   CodeSpace

   Potom otvorte Terminál v Visual Studio Code a spustite nasledujúci príkaz, pričom <your-repository-url> nahraďte URL, ktorú ste práve skopírovali:

   git clone <your-repository-url>
   

2. Otvorte priečinok vo Visual Studio Code. Môžete to urobiť kliknutím na File > Open Folder a výberom práve sklonovaného priečinka.

Odporúčané rozšírenia Visual Studio Code:

• Live Server - na náhľad HTML stránok priamo vo Visual Studio Code
• Copilot - na rýchlejšie písanie kódu

📂 Každá lekcia obsahuje:

• voliteľnú náčrtovú poznámku (sketchnote)
• voliteľné doplnkové video
• rozcvičujúci kvíz pred lekciou
• písanú lekciu
• pre lekcie založené na projekte, podrobné návody krok za krokom ako projekt zostrojiť
• overenia vedomostí
• výzvu
• doplnkové čítanie
• zadanie
• kvíz po lekcii

Poznámka o kvízoch: Všetky kvízy sú obsiahnuté v priečinku Quiz-app, celkovo 48 kvízov so zloženými z troch otázok. Sú dostupné tu a aplikáciu kvízov môžeš spustiť lokálne alebo nasadiť do Azure; postupuj podľa pokynov v priečinku quiz-app.

🗃️ Lekcie

	Názov projektu	Naučené koncepty	Učebné ciele	Prepojená lekcia	Autor
01	Začíname	Úvod do programovania a nástrojov remesla	Naučiť sa základné princípy väčšiny programovacích jazykov a softvér, ktorý pomáha profesionálnym vývojárom	Úvod do programovacích jazykov a nástrojov	Jasmine
02	Začíname	Základy GitHubu, vrátane práce v tíme	Ako používať GitHub v projekte, ako spolupracovať s ostatnými na zdrojovom kóde	Úvod do GitHubu	Floor
03	Začíname	Prístupnosť	Naučiť sa základy webovej prístupnosti	Základy prístupnosti	Christopher
04	Základy JS	Dátové typy v JavaScripte	Základy dátových typov v JavaScripte	Dátové typy	Jasmine
05	Základy JS	Funkcie a metódy	Naučiť sa o funkciách a metódach na riadenie logiky aplikácie	Funkcie a metódy	Jasmine a Christopher
06	Základy JS	Rozhodovanie s JS	Naučiť sa vytvárať podmienky v kóde pomocou rozhodovacích metód	Rozhodovanie	Jasmine
07	Základy JS	Pole a cykly	Práca s dátami pomocou polí a cyklov v JavaScripte	Pole a cykly	Jasmine
08	Terrárium	HTML v praxi	Vytvoriť HTML pre online terrárium so zameraním na rozloženie	Úvod do HTML	Jen
09	Terrárium	CSS v praxi	Vytvoriť CSS pre štýlovanie online terrária, so zameraním na základy CSS vrátane responzívneho dizajnu	Úvod do CSS	Jen
10	Terrárium	JavaScript Closures, manipulácia s DOM	Vytvoriť JavaScript pre funkčný drag/drop rozhranie terrária, so zameraním na closures a manipuláciu s DOM	JavaScript Closures, manipulácia s DOM	Jen
11	Hra na písanie	Vytvorenie hry na písanie	Naučiť sa používať klávesnicové udalosti pre ovládanie logiky JavaScript aplikácie	Programovanie na základe udalostí	Christopher
12	Zelené rozšírenie prehliadača	Práca s prehliadačmi	Naučiť sa ako fungujú prehliadače, ich históriu a ako vytvoriť základné prvky prehliadačového rozšírenia	O prehliadačoch	Jen
13	Zelené rozšírenie prehliadača	Vytváranie formulára, volanie API a ukladanie premenných do lokálneho ukladiska	Vytvoriť JavaScript prvky rozšírenia prehliadača na volanie API pomocou premenných uložených v lokálnom ukladisku	API, formuláre a lokálne ukladisko	Jen
14	Zelené rozšírenie prehliadača	Procesy na pozadí v prehliadači, výkon webu	Použiť procesy na pozadí pre správu ikony rozšírenia, naučiť sa o výkone webu a optimalizáciách	Procesy na pozadí a výkon	Jen
15	Hra v priestore	Pokročilejšie vývoj hier v JavaScripte	Naučiť sa o dedičnosti pomocou tried a kompozície a o vzore Pub/Sub, ako prípravu na tvorbu hry	Úvod do pokročilého vývoja hier	Chris
16	Hra v priestore	Kreslenie na plátno	Naučiť sa o Canvas API, používanom na kreslenie prvkov na obrazovke	Kreslenie na plátno	Chris
17	Hra v priestore	Pohybovanie prvkov po obrazovke	Zistiť, ako prvky získavajú pohyb pomocou karteziánskych súradníc a Canvas API	Pohybovanie prvkov	Chris
18	Hra v priestore	Detekcia kolízie	Vytvoriť kolízie medzi prvkami a reakcie na seba prostredníctvom stlačení klávesov a poskytnúť cooldown funkciu pre výkon hry	Detekcia kolízie	Chris
19	Hra v priestore	Sledovanie skóre	Vykonávať matematické výpočty podľa stavu a výkonu hry	Sledovanie skóre	Chris
20	Hra v priestore	Končenie a reštart hry	Naučiť sa o ukončení a reštartovaní hry, vrátane čistenia zdrojov a resetovania premenných	Podmienka ukončenia	Chris
21	Banková aplikácia	Šablóny HTML a routovanie v webovej aplikácii	Naučiť sa vytvoriť rozvrhnutie viacstránkového webu pomocou routovania a HTML šablón	HTML Šablóny a routovanie	Yohan
22	Banková aplikácia	Vytvorenie prihlasovacieho a registračného formulára	Naučiť sa o tvorbe formulárov a spracovaní validácie	Formuláre	Yohan
23	Banková aplikácia	Spôsoby získavania a používania dát	Ako do aplikácie prenikajú dáta, ako ich načítať, uložiť a odstrániť	Dáta	Yohan
24	Banková aplikácia	Koncepty riadenia stavu	Naučiť sa, ako aplikácia uchováva stav a ako ho programovo riadiť	Riadenie stavu	Yohan
25	Kód editor/Brower/VScode	Práca s VScode	Naučiť sa používať editor kódu	Použitie editora VScode	Chris
26	AI asistenti	Práca s AI	Naučiť sa vytvoriť vlastného AI asistenta	Projekt AI asistenta	Chris

🏫 Pedagogika

Naše učebné osnovy sú navrhnuté s dvoma kľúčovými pedagogickými princípmi na pamäti:

• učenie založené na projektoch
• časté kvízy

Program vyučuje základy JavaScriptu, HTML a CSS, ako aj najnovšie nástroje a techniky používané dnešnými webovými vývojármi. Študenti budú mať príležitosť získať praktické skúsenosti vytvorením hry na písanie, virtuálneho terária, ekologicky šetrného rozšírenia prehliadača, hry v štýle Space Invader a bankovej aplikácie pre firmy. Na konci série študenti získajú pevné základy webového vývoja.

🎓 Môžete absolvovať prvých niekoľko lekcií z tohto učebného plánu ako Cestu učenia na Microsoft Learn!

Zabezpečením souladu obsahu s projektmi je proces pre študentov atraktívnejší a dochádza k lepšiemu zapamätaniu si konceptov. Napísali sme takisto niekoľko úvodných lekcií k základom JavaScriptu na predstavenie konceptov, sprevádzané videom zo série "Séria pre začiatočníkov: JavaScript", ktorej niektorí autori prispeli aj k týmto osnovám.

Okrem toho nízko náročný kvíz pred hodinou nastaví študentovi cieľ učiť sa danú tému, zatiaľ čo druhý kvíz po hodine zabezpečí ďalšie upevnenie vedomostí. Tento učebný plán je navrhnutý tak, aby bol flexibilný a zábavný a dá sa absolvovať celý alebo jeho časť. Projekty začínajú jednoducho a postupne sa počas 12-týždňového cyklu komplikujú.

Hoci sme zámerne vynechali zavedenie JavaScript frameworkov, aby sme sa sústredili na základné zručnosti potrebné ako webový vývojár pred osvojením si frameworku, ďalším dobrým krokom po dokončení týchto osnov je naučiť sa Node.js prostredníctvom inej video série: "Séria pre začiatočníkov: Node.js".

Navštívte naše pravidlá Code of Conduct a Contributing. Radi privítame vaše konštruktívne pripomienky!

🧭 Offline prístup

Túto dokumentáciu môžete spustiť offline pomocou Docsify. Zforknite si tento repozitár, nainštalujte Docsify na svojom miestnom počítači a potom v koreňovom priečinku tohto repozitára zadajte príkaz docsify serve. Web stránka bude dostupná na porte 3000 na vašom localhost: localhost:3000.

📘 PDF

PDF so všetkými lekciami nájdete tu.

🎒 Iné kurzy

Náš tím vytvára aj ďalšie kurzy! Pozrite sa:

LangChain

Azure / Edge / MCP / Agents

---

Séria Generatívnej AI

---

Základné vzdelávanie

---

Séria Copilot

Získanie pomoci

Ak máte problém alebo otázky týkajúce sa tvorby AI aplikácií, pripojte sa k ostatným študentom a skúseným vývojárom v diskusiách o MCP. Je to podporná komunita, kde sú otázky vítané a zdieľanie znalostí je bezplatné.

Ak máte spätnú väzbu k produktu alebo chyby počas vývoja, navštívte:

Licencia

Tento repozitár je licencovaný pod licenciou MIT. Viac informácií nájdete v súbore LICENSE.

---

Upozornenie:
Tento dokument bol preložený pomocou AI prekladateľskej služby Co-op Translator. Aj keď sa snažíme o presnosť, uvedomte si, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Originálny dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre dôležité informácie sa odporúča profesionálny ľudský preklad. Nie sme zodpovední za žiadne nedorozumenia alebo nesprávne výklady vyplývajúce z použitia tohto prekladu.