|
|
2 months ago | |
|---|---|---|
| .. | ||
| 1-getting-started-lessons | 2 months ago | |
| 2-js-basics | 2 months ago | |
| 3-terrarium | 2 months ago | |
| 4-typing-game | ||
| 5-browser-extension | 2 months ago | |
| 6-space-game | ||
| 7-bank-project | 2 months ago | |
| 8-code-editor/1-using-a-code-editor | 2 months ago | |
| 9-chat-project | ||
| 10-ai-framework-project | 2 months ago | |
| Git-Basics | 2 months ago | |
| docs | ||
| lesson-template | ||
| memory-game | 2 months ago | |
| quiz-app | ||
| AGENTS.md | 2 months ago | |
| CODE_OF_CONDUCT.md | ||
| CONTRIBUTING.md | ||
| README.md | 2 months ago | |
| SECURITY.md | ||
| SUPPORT.md | ||
| _404.md | ||
| for-teachers.md | 2 months ago | |
README.md
Interneto svetainių kūrimas pradedantiesiems – mokymo programa
Išmokite interneto svetainių kūrimo pagrindus per 12 savaičių išsamų kursą, kurį parengė „Microsoft Cloud Advocates“. Kiekviena iš 24 pamokų apima JavaScript, CSS ir HTML per praktinius projektus, tokius kaip terariumai, naršyklės plėtiniai ir kosminiai žaidimai. Dalyvaukite viktorinose, diskusijose ir praktinėse užduotyse. Tobulinkite savo įgūdžius ir optimizuokite žinių įsisavinimą naudodamiesi efektyvia projektų pagrindu sukurta mokymo metodika. Pradėkite savo programavimo kelionę jau šiandien!
Prisijunkite prie „Azure AI Foundry“ Discord bendruomenės
Pradėkite naudotis šiais ištekliais atlikdami šiuos veiksmus:
- Fork‘inkite saugyklą: Spustelėkite
- Klonuokite saugyklą:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git - Prisijunkite prie „Azure AI Foundry“ Discord ir susipažinkite su ekspertais bei kitais kūrėjais
🌐 Daugiakalbė palaikymas
Palaikoma per GitHub Action (automatiškai ir visada atnaujinta)
Arabų | Bengalų | Bulgarų | Birmos (Mianmaras) | Kinų (supaprastinta) | Kinų (tradicinė, Honkongas) | Kinų (tradicinė, Makao) | Kinų (tradicinė, Taivanas) | Kroatų | Čekų | Danų | Olandų | Estų | Suomių | Prancūzų | Vokiečių | Graikų | Hebrajų | Hindi | Vengrų | Indoneziečių | Italų | Japonų | Korėjiečių | Lietuvių | Malajų | Maratų | Nepalų | Norvegų | Persų (farsi) | Lenkų | Portugalų (Brazilija) | Portugalų (Portugalija) | Pundžabi (gurmukhi) | Rumunų | Rusų | Serbų (kirilica) | Slovakų | Slovėnų | Ispanų | Svahilių | Švedų | Tagalogų (filipiniečių) | Tamilų | Tajų | Turkų | Ukrainiečių | Urdu | Vietnamiečių
Jei norite, kad būtų palaikomos papildomos kalbos, sąrašą rasite čia
🧑🎓 Ar esate studentas?
Apsilankykite Studentų centro puslapyje, kuriame rasite pradedančiųjų išteklius, studentų paketus ir net būdus, kaip gauti nemokamą sertifikato kuponą. Tai puslapis, kurį verta įsiminti ir kartkartėmis patikrinti, nes turinys keičiamas kas mėnesį.
📣 Pranešimas - Naujas projektas su generatyviniu AI
Pridėtas naujas AI asistentas projektui, peržiūrėkite projektą
📣 Pranešimas - Nauja mokymo programa apie generatyvinį AI JavaScript kalbai
Nepraleiskite mūsų naujos generatyvinio AI mokymo programos!
Apsilankykite https://aka.ms/genai-js-course, kad pradėtumėte!
- Pamokos nuo pagrindų iki RAG.
- Sąveika su istoriniais veikėjais naudojant GenAI ir mūsų papildomą programėlę.
- Smagi ir įtraukianti istorija, keliausite laiku!
Kiekvienoje pamokoje yra užduotis, žinių patikrinimas ir iššūkis, padedantis mokytis tokių temų kaip:
- Komandų kūrimas ir jų inžinerija
- Teksto ir vaizdų programėlių kūrimas
- Paieškos programėlės
Apsilankykite https://aka.ms/genai-js-course, kad pradėtumėte!
🌱 Pradžia
Mokytojai, mes įtraukėme keletą pasiūlymų, kaip naudoti šią mokymo programą. Laukiame jūsų atsiliepimų mūsų diskusijų forume!
Mokiniams, kiekvienai pamokai pradėkite nuo viktorinos prieš paskaitą, perskaitykite paskaitos medžiagą, atlikite įvairias veiklas ir patikrinkite savo supratimą su viktorina po paskaitos.
Norėdami pagerinti mokymosi patirtį, susisiekite su bendraamžiais ir dirbkite kartu prie projektų! Diskusijos skatinamos mūsų diskusijų forume, kur mūsų moderatorių komanda bus pasirengusi atsakyti į jūsų klausimus.
Norėdami toliau mokytis, labai rekomenduojame išnagrinėti Microsoft Learn papildomai mokymosi medžiagai.
📋 Aplinkos nustatymas
Ši mokymo programa turi paruoštą kūrimo aplinką! Pradėdami galite pasirinkti vykdyti mokymo programą Codespace (naršyklėje, nereikia nieko įdiegti), arba vietoje savo kompiuteryje naudodami teksto redaktorių, pvz., Visual Studio Code.
Sukurkite savo saugyklą
Kad galėtumėte lengvai išsaugoti savo darbą, rekomenduojama sukurti savo šios saugyklos kopiją. Tai galite padaryti spustelėdami mygtuką Use this template puslapio viršuje. Tai sukurs naują saugyklą jūsų GitHub paskyroje su mokymo programos kopija.
Atlikite šiuos veiksmus:
- Fork‘inkite saugyklą: Spustelėkite mygtuką „Fork“ puslapio viršutiniame dešiniajame kampe.
- Klonuokite saugyklą:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Mokymo programos vykdymas Codespace aplinkoje
Savo sukurtoje šios saugyklos kopijoje spustelėkite mygtuką Code ir pasirinkite Open with Codespaces. Tai sukurs naują Codespace aplinką, kurioje galėsite dirbti.
Mokymo programos vykdymas vietoje jūsų kompiuteryje
Norėdami vykdyti šią mokymo programą vietoje savo kompiuteryje, jums reikės teksto redaktoriaus, naršyklės ir komandinės eilutės įrankio. Pirmoji pamoka, Įvadas į programavimo kalbas ir įrankius, padės jums pasirinkti geriausius įrankius.
Rekomenduojame naudoti Visual Studio Code kaip redaktorių, kuris taip pat turi integruotą Terminalą. Visual Studio Code galite atsisiųsti čia.
-
Klonuokite savo saugyklą į kompiuterį. Tai galite padaryti spustelėdami mygtuką Code ir nukopijuodami URL:
Tada atidarykite Terminalą Visual Studio Code ir vykdykite šią komandą, pakeisdami
<your-repository-url>į ką tik nukopijuotą URL:git clone <your-repository-url> -
Atidarykite aplanką Visual Studio Code. Tai galite padaryti spustelėdami File > Open Folder ir pasirinkdami ką tik klonuotą aplanką.
Rekomenduojami Visual Studio Code plėtiniai:
- Live Server - HTML puslapių peržiūrai Visual Studio Code
- Copilot - padeda greičiau rašyti kodą
📂 Kiekviena pamoka apima:
- pasirenkamą eskizą
- pasirenkamą papildomą vaizdo įrašą
- viktoriną prieš pamoką
- rašytos pamokos
- projektų pagrindu sukurtos pamokos, žingsnis po žingsnio vadovai, kaip sukurti projektą
- žinių patikrinimai
- iššūkis
- papildoma literatūra
- užduotis
- testas po pamokos
Pastaba apie testus: Visi testai yra „Quiz-app“ aplanke, iš viso 48 testai, kiekviename po tris klausimus. Jie pasiekiami čia. Testų programėlę galima paleisti lokaliai arba įdiegti „Azure“; sekite instrukcijas „quiz-app“ aplanke.
🗃️ Pamokos
| Projekto pavadinimas | Mokomos sąvokos | Mokymosi tikslai | Susieta pamoka | Autorius | |
|---|---|---|---|---|---|
| 01 | Pradžia | Įvadas į programavimą ir darbo įrankius | Sužinokite pagrindinius programavimo kalbų principus ir apie programinę įrangą, kuri padeda profesionaliems programuotojams atlikti savo darbą | Įvadas į programavimo kalbas ir darbo įrankius | Jasmine |
| 02 | Pradžia | „GitHub“ pagrindai, įskaitant darbą komandoje | Kaip naudoti „GitHub“ savo projekte, kaip bendradarbiauti su kitais kodų bazėje | Įvadas į „GitHub“ | Floor |
| 03 | Pradžia | Prieinamumas | Sužinokite pagrindinius interneto prieinamumo principus | Prieinamumo pagrindai | Christopher |
| 04 | JS pagrindai | „JavaScript“ duomenų tipai | „JavaScript“ duomenų tipų pagrindai | Duomenų tipai | Jasmine |
| 05 | JS pagrindai | Funkcijos ir metodai | Sužinokite apie funkcijas ir metodus, kurie padeda valdyti programos logikos eigą | Funkcijos ir metodai | Jasmine ir Christopher |
| 06 | JS pagrindai | Sprendimų priėmimas su JS | Sužinokite, kaip kurti sąlygas savo kode naudojant sprendimų priėmimo metodus | Sprendimų priėmimas | Jasmine |
| 07 | JS pagrindai | Masyvai ir ciklai | Darbas su duomenimis naudojant masyvus ir ciklus „JavaScript“ | Masyvai ir ciklai | Jasmine |
| 08 | Terariumas | HTML praktikoje | Sukurkite HTML, kad sukurtumėte internetinį terariumą, sutelkiant dėmesį į išdėstymo kūrimą | Įvadas į HTML | Jen |
| 09 | Terariumas | CSS praktikoje | Sukurkite CSS, kad stilizuotumėte internetinį terariumą, sutelkiant dėmesį į CSS pagrindus, įskaitant puslapio pritaikymą įvairiems įrenginiams | Įvadas į CSS | Jen |
| 10 | Terariumas | „JavaScript“ uždarymai, DOM manipuliacija | Sukurkite „JavaScript“, kad terariumas veiktų kaip vilkimo/nuleidimo sąsaja, sutelkiant dėmesį į uždarymus ir DOM manipuliaciją | „JavaScript“ uždarymai, DOM manipuliacija | Jen |
| 11 | Rašymo žaidimas | Sukurkite rašymo žaidimą | Sužinokite, kaip naudoti klaviatūros įvykius, kad valdytumėte „JavaScript“ programos logiką | Įvykių valdymo programavimas | Christopher |
| 12 | Žalias naršyklės plėtinys | Darbas su naršyklėmis | Sužinokite, kaip veikia naršyklės, jų istoriją ir kaip sukurti pirmuosius naršyklės plėtinio elementus | Apie naršykles | Jen |
| 13 | Žalias naršyklės plėtinys | Formos kūrimas, API kvietimas ir kintamųjų saugojimas vietinėje saugykloje | Sukurkite „JavaScript“ elementus savo naršyklės plėtiniui, kad galėtumėte kviesti API naudojant vietinėje saugykloje saugomus kintamuosius | API, formos ir vietinė saugykla | Jen |
| 14 | Žalias naršyklės plėtinys | Fono procesai naršyklėje, interneto našumas | Naudokite naršyklės fono procesus, kad valdytumėte plėtinio piktogramą; sužinokite apie interneto našumą ir optimizacijas, kurios gali padėti | Fono užduotys ir našumas | Jen |
| 15 | Kosmoso žaidimas | Sudėtingesnis žaidimų kūrimas su „JavaScript“ | Sužinokite apie paveldėjimą naudojant tiek klases, tiek kompoziciją, ir „Pub/Sub“ modelį, ruošiantis žaidimo kūrimui | Įvadas į pažangų žaidimų kūrimą | Chris |
| 16 | Kosmoso žaidimas | Piešimas ant drobės | Sužinokite apie „Canvas API“, naudojamą elementų piešimui ekrane | Piešimas ant drobės | Chris |
| 17 | Kosmoso žaidimas | Elementų judėjimas ekrane | Sužinokite, kaip elementai gali judėti naudojant Dekarto koordinates ir „Canvas API“ | Elementų judėjimas | Chris |
| 18 | Kosmoso žaidimas | Susidūrimų aptikimas | Padarykite, kad elementai susidurtų ir reaguotų vienas į kitą naudojant klavišų paspaudimus, ir suteikite atvėsimo funkciją, kad užtikrintumėte žaidimo našumą | Susidūrimų aptikimas | Chris |
| 19 | Kosmoso žaidimas | Taškų skaičiavimas | Atlikite matematinius skaičiavimus pagal žaidimo būseną ir našumą | Taškų skaičiavimas | Chris |
| 20 | Kosmoso žaidimas | Žaidimo pabaiga ir paleidimas iš naujo | Sužinokite apie žaidimo pabaigą ir paleidimą iš naujo, įskaitant išteklių išvalymą ir kintamųjų reikšmių atstatymą | Pabaigos sąlyga | Chris |
| 21 | Banko programėlė | HTML šablonai ir maršrutai interneto programėlėje | Sužinokite, kaip sukurti daugiapuslapio svetainės architektūros karkasą naudojant maršrutizavimą ir HTML šablonus | HTML šablonai ir maršrutai | Yohan |
| 22 | Banko programėlė | Prisijungimo ir registracijos formos kūrimas | Sužinokite apie formų kūrimą ir validacijos procedūrų valdymą | Formos | Yohan |
| 23 | Banko programėlė | Duomenų gavimo ir naudojimo metodai | Kaip duomenys teka į jūsų programėlę ir iš jos, kaip juos gauti, saugoti ir ištrinti | Duomenys | Yohan |
| 24 | Banko programėlė | Būsenos valdymo koncepcijos | Sužinokite, kaip jūsų programėlė išlaiko būseną ir kaip ją valdyti programiškai | Būsenos valdymas | Yohan |
| 25 | Naršyklės/VScode kodas | Darbas su VScode | Sužinokite, kaip naudoti kodo redaktorių | Naudokite VScode kodo redaktorių | Chris |
| 26 | AI asistentai | Darbas su AI | Sužinokite, kaip sukurti savo AI asistentą | AI asistento projektas | Chris |
🏫 Pedagogika
Mūsų mokymo programa sukurta remiantis dviem pagrindiniais pedagoginiais principais:
- mokymasis projektų pagrindu
- dažni testai
Programa moko „JavaScript“, HTML ir CSS pagrindų, taip pat naujausių įrankių ir technikų, kurias naudoja šiuolaikiniai interneto kūrėjai. Studentai turės galimybę įgyti praktinės patirties kurdami rašymo žaidimą, virtualų terariumą, ekologišką naršyklės plėtinį, kosmoso invazijos stiliaus žaidimą ir banko programėlę verslui. Baigę kursą, studentai turės tvirtą interneto kūrimo supratimą.
🎓 Pirmąsias kelias pamokas iš šios mokymo programos galite rasti kaip mokymosi kelią „Microsoft Learn“!
Užtikrinant, kad turinys atitiktų projektus, procesas tampa labiau įtraukiantis studentams, o sąvokų išlaikymas bus sustiprintas. Taip pat parašėme kelias pradedančiųjų pamokas apie „JavaScript“ pagrindus, kad pristatytume sąvokas, kartu su vaizdo įrašu iš „Pradedančiųjų serija: JavaScript“ vaizdo pamokų kolekcijos, kurios autoriai prisidėjo prie šios mokymo programos.
Be to, mažo spaudimo testas prieš pamoką nustato studento ketinimą mokytis temos, o antrasis testas po pamokos užtikrina geresnį išlaikymą. Ši mokymo programa buvo sukurta taip, kad būtų lanksti ir įdomi, ją galima studijuoti visą arba dalimis. Projektai prasideda nuo mažų ir tampa vis sudėtingesni iki 12 savaičių ciklo pabaigos.
Nors sąmoningai vengėme pristatyti „JavaScript“ karkasus, kad sutelktume dėmesį į pagrindinius įgūdžius, reikalingus interneto kūrėjui prieš pradedant naudoti karkasą, geras kitas žingsnis baigus šią mokymo programą būtų mokytis apie „Node.js“ per kitą vaizdo įrašų kolekciją: „Pradedančiųjų serija: Node.js“.
Apsilankykite mūsų Elgesio kodekse ir Prisidėjimo gairėse. Laukiame jūsų konstruktyvaus atsiliepimo!
🧭 Prieiga neprisijungus
Šią dokumentaciją galite paleisti neprisijungus naudodami Docsify. Fork'inkite šį repo, įdiekite Docsify savo vietiniame kompiuteryje, o tada repo šakniniame aplanke įveskite docsify serve. Svetainė bus paleista 3000 prievade jūsų vietiniame kompiuteryje: localhost:3000.
Visų pamokų PDF galite rasti čia.
🎒 Kiti kursai
Mūsų komanda kuria ir kitus kursus! Peržiūrėkite:
- MCP pradedantiesiems
- Edge AI pradedantiesiems
- AI agentai pradedantiesiems
- Generatyvinis AI pradedantiesiems .NET
- Generatyvinis AI su „JavaScript“
- Generatyvinis AI su „Java“
- AI pradedantiesiems
- Duomenų mokslas pradedantiesiems
- ML pradedantiesiems
- Kibernetinis saugumas pradedantiesiems
- Interneto kūrimas pradedantiesiems
- IoT pradedantiesiems
- XR kūrimas pradedantiesiems
- GitHub Copilot įvaldymas agentiniam naudojimui
- GitHub Copilot įvaldymas C#/.NET kūrėjams
- Pasirinkite savo Copilot nuotykį
Pagalbos gavimas
Jei susiduriate su sunkumais ar turite klausimų apie AI programų kūrimą, prisijunkite:
Jei turite atsiliepimų apie produktą ar susiduriate su klaidomis kurdami, apsilankykite:
Licencija
Šis saugyklos turinys yra licencijuotas pagal MIT licenciją. Daugiau informacijos rasite LICENSE faile.
Atsakomybės atsisakymas:
Šis dokumentas buvo išverstas naudojant AI vertimo paslaugą Co-op Translator. Nors siekiame tikslumo, prašome atkreipti dėmesį, kad automatiniai vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba turėtų būti laikomas autoritetingu šaltiniu. Kritinei informacijai rekomenduojama profesionali žmogaus vertimo paslauga. Mes neprisiimame atsakomybės už nesusipratimus ar neteisingus interpretavimus, atsiradusius naudojant šį vertimą.


