Web-Dev-For-Beginners/translations/hr

Razvoj weba za početnike - Nastavni plan

Naučite osnove web razvoja kroz naš sveobuhvatni 12-tjedni tečaj kojeg vode Microsoft Cloud Advocatei. Svaka od 24 lekcije detaljno obrađuje JavaScript, CSS i HTML kroz praktične projekte poput terarija, proširenja za preglednike i svemirskih igara. Uključite se u kvizove, rasprave i praktične zadatke. Unaprijedite svoje vještine i optimizirajte usvajanje znanja pomoću naše učinkovite pedagoške metode temeljenje na projektima. Započnite svoje programersko putovanje već danas!

Pridružite se Azure AI Foundry Discord zajednici

Slijedite ove korake da biste započeli s korištenjem ovih resursa:

1. Forkajte repozitorij: Kliknite
2. Klonirajte repozitorij: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Pridružite se Azure AI Foundry Discordu i upoznajte stručnjake i kolege developere

🌐 Podrška za više jezika

Podržano putem GitHub akcija (Automatski i uvijek ažurirano)

Arabic | Bengali | Bulgarian | Burmese (Myanmar) | Chinese (Simplified) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Macau) | Chinese (Traditional, Taiwan) | Croatian | Czech | Danish | Dutch | Estonian | Finnish | French | German | Greek | Hebrew | Hindi | Hungarian | Indonesian | Italian | Japanese | Kannada | Korean | Lithuanian | Malay | Malayalam | Marathi | Nepali | Nigerian Pidgin | Norwegian | Persian (Farsi) | Polish | Portuguese (Brazil) | Portuguese (Portugal) | Punjabi (Gurmukhi) | Romanian | Russian | Serbian (Cyrillic) | Slovak | Slovenian | Spanish | Swahili | Swedish | Tagalog (Filipino) | Tamil | Telugu | Thai | Turkish | Ukrainian | Urdu | Vietnamese

Radije klonirati lokalno?

Ovaj repozitorij uključuje više od 50 prijevoda što značajno povećava veličinu preuzimanja. Za kloniranje bez prijevoda, koristite 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):

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"

Ovo vam daje sve što vam treba za dovršetak tečaja s puno bržim preuzimanjem.

Ako želite da budu podržani dodatni jezici za prijevod, oni su navedeni ovdje

🧑‍🎓 Jeste li student?

Posjetite Student Hub stranicu gdje ćete pronaći resurse za početnike, studentske pakete pa čak i načine kako dobiti besplatni certifikat. Ovo je stranica koju želite označiti i povremeno provjeravati jer mjesečno mijenjamo sadržaje.

📣 Objavljeno - Novi izazovi uz GitHub Copilot Agent mode!

Dodani su novi izazovi, potražite "GitHub Copilot Agent Challenge 🚀" u većini poglavlja. To je novi izazov koji možete dovršiti koristeći GitHub Copilot i Agent mode. Ako niste ranije koristili Agent mode, on ne samo da generira tekst već može i kreirati i uređivati datoteke, izvršavati naredbe i još mnogo toga.

📣 Objavljeno - Novi projekt za izgradnju korištenjem generativne AI

Upravo dodat novi AI Assistant projekt, pogledajte projekt

📣 Objavljeno - Novi nastavni plan o generativnoj AI za JavaScript upravo je objavljen

Ne propustite naš novi nastavni plan o generativnoj AI!

Posjetite https://aka.ms/genai-js-course za početak!

• Lekcije pokrivaju sve od osnova do RAG-a.
• Interakcija s povijesnim likovima kroz GenAI i našu prateću aplikaciju.
• Zabavno i zanimljivo pripovijedanje, putovat ćete kroz vrijeme!

Svaka lekcija uključuje zadatak za dovršiti, provjeru znanja i izazov za učenje tema poput:

• Promptanje i prompt inženjering
• Generiranje tekstualnih i slikovnih aplikacija
• Pretraživačke aplikacije

Posjetite https://aka.ms/genai-js-course za početak!

🌱 Početak

Nastavnici, uključili smo neke prijedloge kako koristiti ovaj nastavni plan. Voljeli bismo vaše povratne informacije na našem forumu za rasprave!

Učenici, za svaku lekciju započnite s pred-lecture kvizom, zatim pročitajte predavanje, dovršite različite aktivnosti i provjerite svoje razumijevanje pomoću post-lecture kviza.

Za povećanje svog iskustva učenja, povezujte se s kolegama i radite projekte zajedno! Poticanje rasprava je u našem forumu za rasprave gdje je naš tim moderatora dostupan za odgovaranje na vaša pitanja.

Za daljnje obrazovanje, toplo preporučujemo istraživanje Microsoft Learn za dodatne materijale za učenje.

📋 Postavljanje vašeg okruženja

Ovaj nastavni plan ima spremno razvojno okruženje! Kada započnete, možete odabrati pokretanje nastavnog plana u Codespaceu (okruženje bazirano na pregledniku bez potrebe za instalacijama), ili lokalno na vašem računalu koristeći tekstualni uređivač poput Visual Studio Code.

Kreirajte svoj repozitorij

Kako biste jednostavno spremili svoj rad, preporučuje se da kreirate vlastitu kopiju ovog repozitorija. To možete učiniti klikom na gumb Use this template na vrhu stranice. Time će se u vašem GitHub računu kreirati novi repozitorij s kopijom nastavnog plana.

Slijedite ove korake:

1. Forkajte repozitorij: Kliknite na gumb "Fork" u gornjem desnom kutu ove stranice.
2. Klonirajte repozitorij: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Pokretanje nastavnog plana u Codespaceu

U vašoj kopiji ovog repozitorija kliknite na gumb Code i odaberite Open with Codespaces. Time će se kreirati novi Codespace u kojem ćete raditi.

Pokretanje nastavnog plana lokalno na vašem računalu

Da biste ovaj nastavni plan pokrenuli lokalno na računalu, trebat će vam tekstualni uređivač, preglednik i alat za naredbenu liniju. Naša prva lekcija, Uvod u programske jezike i alate, provest će vas kroz različite opcije za svaki od ovih alata kako biste odabrali što vam najviše odgovara.

Naša preporuka je da koristite Visual Studio Code kao uređivač koji također ima ugrađeni Terminal. Visual Studio Code možete preuzeti ovdje.

1. Klonirajte vaš repozitorij na računalo. To možete učiniti klikom na gumb Code i kopiranjem URL-a:

   CodeSpace

   Zatim otvorite Terminal unutar Visual Studio Code i pokrenite sljedeću naredbu, zamjenjujući <your-repository-url> s URL-om koji ste upravo kopirali:

   git clone <your-repository-url>
   

2. Otvorite mapu u Visual Studio Code. To možete učiniti klikom na File > Open Folder i odabirom mape koju ste upravo klonirali.

Preporučeni dodaci za Visual Studio Code:

• Live Server - za pregled HTML stranica unutar Visual Studio Codea
• Copilot - za pomoć pri bržem pisanju koda

📂 Svaka lekcija uključuje:

• neobaveznu skicu
• neobavezni dodatni video
• kviz za zagrijavanje prije lekcije
• pisanu lekciju
• za lekcije temeljene na projektima, korak-po-korak vodiče za izgradnju projekta
• provjere znanja
• izazov
• dodatno čitanje
• zadatak
• kviz nakon lekcije

Napomena o kvizovima: Svi kvizovi su u mapi Quiz-app, ukupno 48 kvizova s po tri pitanja. Dostupni su ovdje; aplikacija kviza može se pokrenuti lokalno ili implementirati u Azure; slijedite upute u mapi quiz-app.

🗃️ Lekcije

	Naziv projekta	Koncepti koji se podučavaju	Ciljevi učenja	Povezana lekcija	Autor
01	Početak rada	Uvod u programiranje i alate trgovine	Naučite osnovne temelje iza većine programskih jezika i o softveru koji pomaže profesionalnim programerima u njihovom radu	Uvod u programske jezike i alate	Jasmine
02	Početak rada	Osnove GitHub-a, uključuje rad u timu	Kako koristiti GitHub u vašem projektu, kako surađivati s drugima na bazi koda	Uvod u GitHub	Floor
03	Početak rada	Pristupačnost	Naučite osnove pristupačnosti weba	Osnove pristupačnosti	Christopher
04	Osnove JS	JavaScript tipovi podataka	Osnove tipova podataka u JavaScriptu	Tipovi podataka	Jasmine
05	Osnove JS	Funkcije i metode	Naučite o funkcijama i metodama za upravljanje tokom logike aplikacije	Funkcije i metode	Jasmine i Christopher
06	Osnove JS	Donošenje odluka u JS	Naučite kako kreirati uvjete u vašem kodu koristeći metode za donošenje odluka	Donošenje odluka	Jasmine
07	Osnove JS	Nizovi i petlje	Radite s podacima koristeći nizove i petlje u JavaScriptu	Nizovi i petlje	Jasmine
08	Terrarij	HTML u praksi	Izgradite HTML za online terarij, fokusirajući se na izradu rasporeda	Uvod u HTML	Jen
09	Terrarij	CSS u praksi	Izgradite CSS za stiliziranje online terarija, fokusirajući se na osnove CSS-a uključujući responsivni dizajn stranice	Uvod u CSS	Jen
10	Terrarij	JavaScript closures, manipulacija DOM-om	Izgradite JavaScript koji omogućava funkcionalnost terarija kao povuci-i-ispusti sučelja, fokusirajući se na closures i DOM	JavaScript closures, manipulacija DOM-om	Jen
11	Igra tipkanja	Izradite igru tipkanja	Naučite koristiti događaje tipkovnice za upravljanje logikom vaše JavaScript aplikacije	Programiranje vođeno događajima	Christopher
12	Ekstenzija za zeleno pregledavanje	Rad s preglednicima	Naučite kako preglednici rade, njihovu povijest i kako izgraditi prve elemente ekstenzije preglednika	O preglednicima	Jen
13	Ekstenzija za zeleno pregledavanje	Izrada obrasca, pozivanje API-ja i pohrana varijabli u lokalnu pohranu	Izradite JavaScript elemente vaše ekstenzije za preglednik za pozivanje API-ja koristeći varijable pohranjene u lokalnu pohranu	API-ji, obrasci i lokalna pohrana	Jen
14	Ekstenzija za zeleno pregledavanje	Pozadinski procesi u pregledniku, web performanse	Koristite pozadinske procese preglednika za upravljanje ikonom ekstenzije; naučite o web performansama i nekim optimizacijama	Pozadinski zadaci i performanse	Jen
15	Igra u svemiru	Naprednija izrada igara s JavaScriptom	Naučite o nasljeđivanju koristeći i klase i kompoziciju te Pub/Sub obrascu, kao pripremu za izradu igre	Uvod u naprednu izradu igara	Chris
16	Igra u svemiru	Crtanje na platnu	Naučite o Canvas API-ju, koji se koristi za crtanje elemenata na zaslonu	Crtanje na platnu	Chris
17	Igra u svemiru	Pomicanje elemenata po zaslonu	Otkrijte kako elementi mogu dobiti gibanje koristeći kartezijanske koordinate i Canvas API	Pomicanje elemenata	Chris
18	Igra u svemiru	Detekcija sudara	Neka se elementi sudaraju i međusobno reagiraju korištenjem pritisaka tipki i izvedite funkciju cooldown za osiguranje performansi igre	Detekcija sudara	Chris
19	Igra u svemiru	Vođenje rezultata	Izvršite matematičke izračune temeljene na statusu igre i izvedbi	Vođenje rezultata	Chris
20	Igra u svemiru	Završetak i ponovno pokretanje igre	Naučite o završavanju i ponovnom pokretanju igre, uključujući čišćenje resursa i resetiranje vrijednosti varijabli	Uvjet završetka	Chris
21	Bankarska aplikacija	HTML predlošci i rute u web aplikaciji	Naučite kako napraviti arhitekturu višestranične web stranice koristeći rutiranje i HTML predloške	HTML predlošci i rute	Yohan
22	Bankarska aplikacija	Izrada obrasca za prijavu i registraciju	Naučite o izradi obrazaca i rukovanju procedurama validacije	Obrasci	Yohan
23	Bankarska aplikacija	Metode dohvaćanja i korištenja podataka	Kako podaci ulaze i izlaze iz vaše aplikacije, kako ih dohvatiti, pohraniti i odbaciti	Podaci	Yohan
24	Bankarska aplikacija	Koncepti upravljanja stanjem	Naučite kako vaša aplikacija zadržava stanje i kako ga upravljati programatski	Upravljanje stanjem	Yohan
25	Browser/VScode Code	Rad s VScode	Naučite kako koristiti uređivač koda	Korištenje VScode uređivača	Chris
26	AI asistenti	Rad s AI	Naučite kako izgraditi vlastitog AI asistenta	AI projekt asistenta	Chris

🏫 Pedagogija

Naš kurikulum je dizajniran s dvije ključne pedagoške smjernice:

• učenje temeljeno na projektima
• učestali kvizovi

Program uči osnove JavaScripta, HTML-a i CSS-a, kao i najnovije alate i tehnike koje koriste današnji web programeri. Studenti će imati priliku razviti praktično iskustvo izradom igre tipkanja, virtualnog terarija, ekološki prihvatljive proširenje za preglednik, igre u stilu space invadera i bankarske aplikacije za poduzeća. Na kraju serije, studenti će imati čvrsto razumijevanje web razvoja.

🎓 Prve lekcije ovog kurikuluma možete proći kao Learn Path na Microsoft Learn!

Osiguravanjem podudarnosti sadržaja s projektima, proces je angažiraniji za studente i zadržavanje koncepata će biti poboljšano. Također smo napisali nekoliko uvodnih lekcija o osnovama JavaScripta za upoznavanje s konceptima, uparene s videom iz zbirke video tutorijala "Početnička serija za: JavaScript", od kojih su neki autori doprinijeli ovom kurikulumu.

Osim toga, kviz s niskim ulozima prije sata usmjerava namjeru učenika prema učenju teme, dok drugi kviz nakon predavanja osigurava dodatno zadržavanje. Ovaj kurikulum je dizajniran da bude fleksibilan i zabavan te može se pohađati u cjelini ili djelomično. Projekti počinju mali i postaju sve složeniji do kraja 12-tjednog ciklusa.

Iako smo namjerno izbjegavali uvođenje JavaScript frameworka kako bismo se koncentrirali na osnovne vještine potrebne kao web programer prije usvajanja frameworka, dobar sljedeći korak u dovršetku ovog kurikuluma bilo bi učenje o Node.js putem druge zbirke videozapisa: "Početnička serija za: Node.js".

Posjetite naše smjernice Kodeksa ponašanja i Doprinos. Dobrodošli su vaši konstruktivni komentari!

🧭 Pristup izvan mreže

Ovu dokumentaciju možete pokrenuti izvan mreže koristeći Docsify. Forkajte ovaj repozitorij, instalirajte Docsify na svoje lokalno računalo, a zatim u korijenskoj mapi ovog repozitorija upišite docsify serve. Web stranica će se poslužiti na portu 3000 na vašem localhostu: localhost:3000.

📘 PDF

PDF svih lekcija možete pronaći ovdje.

🎒 Drugi tečajevi

Naš tim proizvodi i druge tečajeve! Pogledajte:

LangChain

Azure / Edge / MCP / Agents

---

Serija Generativne AI

---

Osnovno učenje

---

Serija Copilot

Dobivanje pomoći

Ako zapnete ili imate bilo kakvih pitanja o izradi AI aplikacija, pridružite se ostalim polaznicima i iskusnim developerima u raspravama o MCP-u. To je podržavajuća zajednica gdje su pitanja dobrodošla, a znanje se slobodno dijeli.

Ako imate povratne informacije o proizvodu ili prijavite greške tijekom izrade, posjetite:

Licenca

Ovo spremište licencirano je pod MIT licencom. Pogledajte datoteku LICENSE za više informacija.

---

Odricanje od odgovornosti: Ovaj dokument je preveden pomoću AI usluge za prevođenje Co-op Translator. Iako nastojimo osigurati točnost, imajte na umu da automatski prijevodi mogu sadržavati pogreške ili netočnosti. Izvorni dokument na izvornom jeziku treba smatrati autoritativnim izvorom. Za važne informacije preporučuje se profesionalni ljudski prijevod. Ne snosimo odgovornost za bilo kakva nesporazuma ili pogrešna tumačenja koja proizlaze iz korištenja ovog prijevoda.