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!

Csatlakozzon az Azure AI Foundry Discord közösséghez

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
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

Arab | Bengáli | Bolgár | Burmese (Myanmar) | Kínai (egyszerűsített) | Kínai (hagyományos, Hong Kong) | Kínai (hagyományos, Makaó) | Kínai (hagyományos, Tajvan) | Horvát | Cseh | Dán | Holland | Észt | Finn | Francia | Német | Görög | Héber | Hindi | Magyar | Indonéz | Olasz | Japán | Kannada | Khmer | Koreai | Litván | Maláj | Malayalam | Marathi | Nepáli | Nigériai pidgin | Norvég | Perzsa (Farsi) | Lengyel | Portugál (Brazília) | Portugál (Portugália) | Pandzsábi (Gurmukhi) | Román | Orosz | Szerb (cirill) | Szlovák | Szlovén | Spanyol | Szuahéli | Svéd | Tagalog (Filippínó) | Tamil | Telugu | Thai | Török | Ukrán | Urdu | Vietnami

Szeretné helyben klónozni?

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:

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):

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"

Ez mindent megad, amire szüksége van a tanfolyam elvégzéséhez sokkal gyorsabb letöltéssel.

Ha további támogatott fordítási nyelveket szeretne, azok itt találhatók

Látogass el a Diák Hub oldalra, 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.

Ú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.

Új AI asszisztens projekt került hozzáadásra, nézd meg a projektdokumentációt

Ne hagyd ki új Generatív MI tanmenetünket!

Látogass el a https://aka.ms/genai-js-course oldalra, és kezdj bele!

• Leckék az alapoktól a RAG-ig.
• Történelmi szereplőkkel léphetsz interakcióba a Generatív MI és kísérő alkalmazásunk segítségével.
• Szórakoztató és lebilincselő történet, időutazás élményével!

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átogass el a https://aka.ms/genai-js-course oldalra, és kezdj bele!

Tanárként néhány javaslatot ide tettünk közzé a tanmenet használatára. Szívesen fogadjuk visszajelzésedet vitafórumunkban!

Tanulók, 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 diáktársaitokkal a projekteken! A beszélgetések ösztönzöttek a vitafórumunkon, ahol moderátor csapatunk készen áll válaszolni kérdéseitekre.

A tanulmányaitok elősegítéséhez erősen ajánljuk a Microsoft Learn platform további anyagainak felfedezését.

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 (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 segítségével.

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.

Lépések:

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 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 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 segít több lehetőség közötti választásban ezek közül.

Ajánljuk a Visual Studio Code használatát szerkesztőként, amely beépített Terminált is tartalmaz. A Visual Studio Code letölthető innen.

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

   Ezután nyisd meg a Terminált a Visual Studio Code belül, és futtasd a következő parancsot, az <your-repository-url> helyére beillesztve a most kimásolt URL-t:

   git clone <your-repository-url>

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:

• Live Server - HTML oldalak előnézete a Visual Studio Code-on belül
• Copilot - segít gyorsabban kódot írni

• opcionális vázlatrajzot
• opcionális kiegészítő videót
• 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 megépítéséhez
• tudásellenőrzéseket
• kihívást
• kiegészítő olvasnivalót
• feladatot
• tanóra utáni kvízt

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, a kvízalkalmazás futtatható helyileg vagy telepíthető Azure-ra; kövesd az utasításokat a quiz-app mappában.

Tananyagunk két fontos pedagógiai elv szerint készült:

• projekt alapú tanulás
• gyakori kvízek

A program JavaScript, HTML és CSS alapjait tanítja meg, valamint a legújabb eszközöket és technikákat, amelyeket a mai webfejlesztők használnak. A diákoknak lehetőségük 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ő néhány leckét ebben a tananyagban Microsoft Learn-ön Tanulási útvonalként is végezheted!

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" 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 ó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.

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".

Látogasd meg Viselkedési Kódexünket és Hozzájárulás irányelveinket. Szívesen fogadjuk építő jellegű visszajelzéseidet!

Ezt a dokumentációt offline is futtathatod a Docsify használatával. Fork-old ezt a repót, telepítsd a Docsify-t 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.

A PDF az összes leckéről megtalálható itt.

Csapatunk más kurzusokat is készít! Nézd meg:

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.

Ha visszajelzésed vagy hibák vannak a fejlesztés közben, látogass el ide:

Ez a tároló az MIT licenc alatt áll. További információért lásd a LICENSE fájlt.

Felelősség kizárása:
Ezt a dokumentumot az AI fordító szolgáltatás 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.