32 KiB

Raw Blame History

Spletni razvoj za začetnike - Pouk

Naučite se osnov spletnega razvoja z našim 12-tedenskim celovitim tečajem Microsoft Cloud Advocates. Vsaka izmed 24 lekcij poglobi znanje JavaScript, CSS in HTML skozi praktične projekte, kot so terariji, razširitve brskalnika in vesoljske igre. Vključuje kvize, razprave in praktične naloge. Izboljšajte svoje veščine in optimizirajte zadrževanje znanja z našo učinkovito pedagoško metodo, ki temelji na projektih. Začnite svojo kodo danes!

Pridružite se skupnosti Azure AI Foundry Discord

Sledite tem korakom, da začnete uporabljati te vire:

Razveji Repozitorij: Kliknite
Kloniraj Repozitorij: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Pridruži se Azure AI Foundry Discord in spoznaj strokovnjake ter ostale razvijalce

🌐 Podpora več jezikov

Podprto preko GitHub Action (Avtomatizirano in vedno posodobljeno)

Raje kloniraš lokalno?

Ta repozitorij vsebuje prevode v več kot 50 jezikov, kar močno poveča velikost prenosa. Če želiš klonirati brez prevodov, uporabi sparse checkout:
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'
Tako dobiš vse, kar potrebuješ za dokončanje tečaja, z veliko hitrejšim prenosom.

Če želiš dodatno podporo za prevodne jezike, so našteti tukaj

🧑‍🎓 Si študent?

Obišči Student Hub stran, kjer najdeš vire za začetnike, študentske pakete in celo načine za pridobitev brezplačnega potrdila. To stran si shrani med priljubljene in jo občasno preverjaj, saj vsebino mesečno posodabljamo.

📣 Obvestilo - Novi izzivi GitHub Copilot Agent načina za dokončanje!

Dodali smo nov izziv, poišči "GitHub Copilot Agent Challenge 🚀" v večini poglavij. To je nov izziv, ki ga lahko opraviš z uporabo GitHub Copilot in Agent načina. Če agent načina še nisi uporabljal, zna ne samo generirati besedila, ampak tudi ustvarjati in urejati datoteke, izvajati ukaze in še več.

📣 Obvestilo - Nov projekt za izgradnjo z uporabo Generativne AI

Pravkar smo dodali nov AI Assistant projekt, oglej si ga projekt

📣 Obvestilo - Nov kurikulum o Generativni AI za JavaScript je pravkar izšel

Ne zamudi našega novega kurikuluma o Generativni AI!

Obišči https://aka.ms/genai-js-course za začetek!

Lekcije obsegajo vse od osnov do RAG.
Komuniciraj z zgodovinskimi liki s pomočjo GenAI in naše spremljevalne aplikacije.
Zabavna in privlačna pripoved, potoval boš skozi čas!

Vsaka lekcija vključuje nalogo za dokončanje, preverjanje znanja in izziv, ki te vodi pri učenju tem, kot so:

Spodbujanje in inženiring spodbude
Generiranje besedilnih in slikovnih aplikacij
Iskalne aplikacije

Obišči https://aka.ms/genai-js-course za začetek!

🌱 Začetek

Učitelji, vključili smo nekaj predlogov o tem, kako uporabljati ta kurikulum. Veseli bomo vaših povratnih informacij v našem forumu za razprave!

Učenci, za vsako lekcijo začnite s predpredavanjem kviza in nadaljujte z branjem predavanj, dokončanjem različnih aktivnosti in preverjanjem razumevanja s post-predavanjem kviza.

Za izboljšanje učne izkušnje se povežite s sošolci in skupaj delajte na projektih! Spodbujamo razprave v našem forumu za razprave, kjer je na voljo naša ekipa moderatorjev za odgovore na vaša vprašanja.

Za nadaljnje izobraževanje močno priporočamo raziskovanje Microsoft Learn za dodatne študijske materiale.

📋 Nastavitev okolja

Ta kurikulum ima pripravljeno razvojno okolje! Ko začneš, lahko začneš izvajati kurikulum v Codespace (brskalniško okolje brez potrebe po namestitvah) ali lokalno na svojem računalniku z urejevalnikom besedil, kot je Visual Studio Code.

Ustvari svoj repozitorij

Da boste lahko enostavno shranjevali svoje delo, je priporočljivo, da ustvarite svojo kopijo tega repozitorija. To lahko storite s klikom na gumb Uporabi ta vzorec na vrhu strani. S tem bo v vašem GitHub računu ustvarjen nov repozitorij s kopijo kurikuluma.

Sledite tem korakom:

Razveji Repozitorij: Kliknite gumb "Fork" v zgornjem desnem kotu te strani.
Kloniraj Repozitorij: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Izvajanje kurikuluma v Codespace

V svoji kopiji tega repozitorija, ki ste jo ustvarili, kliknite na gumb Code in izberite Open with Codespaces. To bo ustvarilo nov Codespace za vaše delo.

Izvajanje kurikuluma lokalno na računalniku

Za izvajanje tega kurikuluma lokalno na svojem računalniku boste potrebovali urejevalnik besedil, brskalnik in orodje ukazne vrstice. Naša prva lekcija, Uvod v programske jezike in orodja, vas bo vodila skozi različne možnosti za vsako od teh orodij, da izberete, kaj vam najbolj ustreza.

Priporočilo je uporaba Visual Studio Code kot urejevalnika, ki ima tudi vgrajen Terminal. Visual Studio Code lahko prenesete tukaj.

Klonirajte svoj repozitorij na računalnik. To lahko storite tako, da kliknete gumb Code in kopirate URL:

CodeSpace Nato odprite Terminal znotraj Visual Studio Code in zaženite naslednji ukaz, pri čemer <your-repository-url> zamenjajte z URL-jem, ki ste ga pravkar kopirali:
```
git clone <your-repository-url>
```
Odprite mapo v Visual Studio Code. To lahko storite tako, da kliknete File > Open Folder in izberete mapo, ki ste jo pravkar klonirali.

Priporočene razširitve za Visual Studio Code:

Live Server - za predogled HTML strani znotraj Visual Studio Code

Copilot - za pomoč pri hitrejšem pisanju kode

📂 Vsaka lekcija vsebuje:

neobvezno skicirno zapiskovanje
neobvezni dodatni video
ogrevalni kviz pred lekcijo
pisno lekcijo
za lekcije na osnovi projektov, korak za korakom vodiče za izdelavo projekta
preverjanje znanja
izziv
dodatno branje
nalogo
kviz po lekciji

Opomba o kvizih: Vsi kvizi so shranjeni v mapi Quiz-app, skupaj 48 kvizov s po tremi vprašanji vsak. Na voljo so tukaj, aplikacijo za kvize lahko zaženete lokalno ali pa jo namestite v Azure; sledite navodilom v mapi quiz-app.

🗃️ Lekcije

	Ime projekta	Poučevani koncepti	Cilji učenja	Povezana lekcija	Avtor
01	Začetek	Uvod v programiranje in orodja poklica	Spoznajte osnovna načela večine programskih jezikov in programsko opremo, ki pomaga profesionalnim razvijalcem pri delu	Uvod v programske jezike in orodja poklica	Jasmine
02	Začetek	Osnove GitHub, vključno z delom v timu	Kako uporabljati GitHub v vašem projektu, kako sodelovati z drugimi na izvorni kodi	Uvod v GitHub	Floor
03	Začetek	Dostopnost	Spoznajte osnove dostopnosti spletnih strani	Osnove dostopnosti	Christopher
04	Osnove JS	Tipi podatkov v JavaScript	Osnove tipov podatkov v JavaScript	Tipi podatkov	Jasmine
05	Osnove JS	Funkcije in metode	Spoznajte funkcije in metode za upravljanje s tokom logike aplikacije	Funkcije in metode	Jasmine in Christopher
06	Osnove JS	Odločitve v JS	Naučite se ustvarjati pogoje v kodi z uporabo metod odločanja	Ustvarjanje odločitev	Jasmine
07	Osnove JS	Polja in zanke	Računajte z podatki z uporabo polj in zank v JavaScript	Polja in zanke	Jasmine
08	Terrarij	HTML v praksi	Zgradite HTML za ustvarjanje spletnega terarija, osredotočite se na postavitev layouta	Uvod v HTML	Jen
09	Terrarij	CSS v praksi	Zgradite CSS za oblikovanje spletnega terarija, osredotočite se na osnove CSS in prilagoditev strani	Uvod v CSS	Jen
10	Terrarij	JavaScript closures, manipulacija DOM	Zgradite JavaScript za delovanje terarija kot vmesnik za povleci-in-spusti, osredotočite se na closures in manipulacijo DOM	JavaScript closures, manipulacija DOM	Jen
11	Igra tipkanja	Izdelava igre tipkanja	Naučite se uporabljati dogodke tipkovnice za upravljanje logike vaše JavaScript aplikacije	Dogodkovno programiranje	Christopher
12	Zeleni brskalnik razširitev	Delo z brskalniki	Spoznajte delovanje brskalnikov, njihovo zgodovino in kako sestaviti prve elemente razširitve brskalnika	O brskalnikih	Jen
13	Zeleni brskalnik razširitev	Izdelava obrazca, klic API in shranjevanje spremenljivk v lokalno shrambo	Pripravite JavaScript elemente razširitve brskalnika za poklic API z uporabo spremenljivk shranjenih v lokalni shrambi	API-ji, obrazci in lokalna shramba	Jen
14	Zeleni brskalnik razširitev	Ozadni procesi v brskalniku, spletna učinkovitost	Uporabite ozadne procese brskalnika za upravljanje ikone razširitve; spoznajte spletno učinkovitost in nekatere optimizacije	Ozadna opravila in učinkovitost	Jen
15	Igra vesolja	Naprednejši razvoj iger z JavaScript	Spoznajte dediščino s pomočjo razredov in kompozicije ter vzorec Pub/Sub, v pripravi za izdelavo igre	Uvod v napreden razvoj iger	Chris
16	Igra vesolja	Risanje na platno	Spoznajte Canvas API, ki se uporablja za risanje elementov na zaslon	Risanje na platno	Chris
17	Igra vesolja	Premikanje elementov po zaslonu	Spoznajte, kako elementi pridobijo gibanje z uporabo kartezičnih koordinat in Canvas API	Premikanje elementov	Chris
18	Igra vesolja	Detekcija trkov	Naredite, da se elementi trčijo in reagirajo med seboj z uporabo pritiskov tipk ter zagotovite funkcijo ohlajevanja za boljšo zmogljivost igre	Detekcija trkov	Chris
19	Igra vesolja	Vodenje točk	Izvedite matematične izračune na podlagi statusa in zmogljivosti igre	Vodenje točk	Chris
20	Igra vesolja	Zaključevanje in ponovni zagon igre	Spoznajte, kako zaključiti in ponovno zagnati igro, vključno s čiščenjem sredstev in ponastavitvijo vrednosti spremenljivk	Pogoj za zaključek	Chris
21	Bančniška aplikacija	HTML predloge in poti v spletni aplikaciji	Naučite se ustvariti ogrodje arhitekture večstranske spletne strani z uporabo usmerjanja in HTML predlog	HTML predloge in poti	Yohan
22	Bančniška aplikacija	Izdelava obrazca za prijavo in registracijo	Spoznajte izdelavo obrazcev in upravljanje z validacijskimi postopki	Obrazci	Yohan
23	Bančniška aplikacija	Metode pridobivanja in uporabe podatkov	Kako podatki tečejo v in iz vaše aplikacije, kako jih pridobiti, shraniti in odstraniti	Podatki	Yohan
24	Bančniška aplikacija	Koncepti upravljanja stanja	Naučite se, kako vaša aplikacija shrani stanje in kako ga upravljati programersko	Upravljanje stanja	Yohan
25	Browser/VScode Koda	Delo z VScode	Naučite se uporabljati urejevalnik kode	Uporaba urejevalnika kode VScode	Chris
26	AI asistenti	Delo z umetno inteligenco	Naučite se zgraditi lastnega AI asistenta	Projekt AI asistenta	Chris

🏫 Pedagogika

Naš kurikulum je zasnovan z dvema ključnima pedagoškima načeloma v mislih:

učenje na osnovi projektov
pogosti kvizi

Program uči osnove JavaScripta, HTML-ja in CSS-ja, pa tudi najnovejša orodja in tehnike, ki jih danes uporabljajo spletni razvijalci. Študenti bodo imeli priložnost pridobiti praktične izkušnje z izdelavo igre tipkanja, virtualnega terarija, okolju prijazne razširitve brskalnika, igre v stilu vesoljskih napadalcev in bančne aplikacije za podjetja. Ob koncu serije bodo študenti pridobili trdno razumevanje spletnega razvoja.

🎓 Prve lekcije tega kurikuluma lahko opravite kot pot učenja na Microsoft Learn!

Z zagotavljanjem, da vsebina sovpada s projekti, je proces učenja bolj privlačen za študente in bo povečal zadrževanje konceptov. Prav tako smo napisali več začetnih lekcij o osnovah JavaScript, ki uvajajo koncepte, povezane z videom iz zbirke video vadnic "Serija za začetnike na: JavaScript", katere avtorji so prispevali k temu kurikulumu.

Poleg tega kviz z nizko stopnjo tveganja pred razredom usmerja namen študenta k učenju teme, medtem ko drugi kviz po razredu zagotavlja nadaljnje zadrževanje znanja. Ta kurikulum je zasnovan tako, da je fleksibilen in zabaven ter ga je mogoče opraviti v celoti ali delno. Projekti se začnejo majhni in postajajo na koncu 12-tedenskega cikla vse bolj kompleksni.

Čeprav smo namerno izpustili uvajanje JavaScript ogrodij, da se osredotočimo na osnovne veščine, potrebne kot spletni razvijalec, preden sprejmemo ogrodje, je dober naslednji korak pri dokončanju tega kurikuluma učenje o Node.js prek druge zbirke videov: "Serija za začetnike na: Node.js".

Obiščite naše Pravila obnašanja in Prispevanje smernice. Veselimo se vaših konstruktivnih povratnih informacij!

🧭 Dostop brez povezave

To dokumentacijo lahko zaženete brez povezave z uporabo Docsify. Forkajte to repozitorij, namestite Docsify na vaš lokalni računalnik in nato v korenski mapi repozitorija vnesite docsify serve. Spletna stran bo na voljo na vratih 3000 na vašem lokalnem strežniku: localhost:3000.

📘 PDF

PDF vseh lekcij najdete tukaj.

🎒 Drugi tečaji

Naša ekipa ustvarja tudi druge tečaje! Oglejte si:

LangChain

Azure / Edge / MCP / Agentje

Serija generativne umetne inteligence

Osnovno učenje

Serija Copilot

Pomoč

Če zataknete ali imate kakršnakoli vprašanja glede razvoja AI aplikacij, se pridružite drugim učečim in izkušenim razvijalcem v razpravah o MCP. To je podporna skupnost, kjer so vprašanja dobrodošla in se znanje brezplačno deli.

Če imate povratne informacije o izdelku ali naletite na napake med razvojem, obiščite:

Licenca

Ta repozitorij je licenciran pod licenco MIT. Za več informacij glejte datoteko LICENSE.

Opozarilo: Ta dokument je bil preveden z uporabo storitve za avtomatski prevod Co-op Translator. Čeprav si prizadevamo za natančnost, upoštevajte, da lahko avtomatizirani prevodi vsebujejo napake ali nepravilnosti. Izvirni dokument v njegovem izvirnem jeziku velja za avtoritativni vir. Za pomembne informacije priporočamo strokoven človeški prevod. Nismo odgovorni za morebitna nesporazume ali napačne interpretacije, ki izhajajo iz uporabe tega prevoda.

32 KiB Raw Blame History