chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes)

update-translations
localizeflow[bot] 5 months ago
parent 15108895d8
commit 1a4604a17f

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-20T16:22:13+00:00", "translation_date": "2026-04-24T12:18:10+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "hr" "language_code": "hr"
}, },
@ -516,8 +516,8 @@
"language_code": "hr" "language_code": "hr"
}, },
"README.md": { "README.md": {
"original_hash": "b885c87c7544109b78d6684daad6cba6", "original_hash": "b1766b45123e043ef2c72612f28b86dd",
"translation_date": "2026-04-06T16:56:27+00:00", "translation_date": "2026-04-24T12:10:20+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "hr" "language_code": "hr"
}, },
@ -564,8 +564,8 @@
"language_code": "hr" "language_code": "hr"
}, },
"lesson-template/README.md": { "lesson-template/README.md": {
"original_hash": "0494be70ad7fadd13a8c3d549c23e355", "original_hash": "ce2f64fd0d518f0500fc082b97c1e662",
"translation_date": "2025-08-27T22:44:06+00:00", "translation_date": "2026-04-24T12:10:31+00:00",
"source_file": "lesson-template/README.md", "source_file": "lesson-template/README.md",
"language_code": "hr" "language_code": "hr"
}, },

@ -2,27 +2,27 @@
## Pregled projekta ## Pregled projekta
Ovo je repozitorij nastavnog programa za podučavanje osnova web razvoja početnicima. Nastavni plan i program je sveobuhvatan tečaj u trajanju od 12 tjedana koji su razvili Microsoft Cloud Advocates, a sadrži 24 praktične lekcije koje pokrivaju JavaScript, CSS i HTML. Ovo je repozitorij s obrazovnim planom i programom za podučavanje osnova web razvoja početnicima. Plan i program je sveobuhvatan tečaj u trajanju od 12 tjedana koji su razvili Microsoft Cloud Advocates, sadrži 24 praktične lekcije koje pokrivaju JavaScript, CSS i HTML.
### Ključne komponente ### Ključne komponente
- **Nastavni sadržaj**: 24 strukturirane lekcije organizirane u module temeljene na projektima - **Obrazovni sadržaj**: 24 strukturirane lekcije organizirane u module temeljene na projektima
- **Praktični projekti**: Terrarij, Igra tipkanja, Proširenje za preglednik, Svemirska igra, Bankarska aplikacija, Code Editor i AI Chat asistent - **Praktični projekti**: Terrarij, Igra tipkanja, Proširenje preglednika, Svemirska igra, Bankovna aplikacija, Uređivač koda i AI pomoćnik za chat
- **Interaktivni kvizovi**: 48 kvizova sa po 3 pitanja svaki (procjena prije i nakon lekcije) - **Interaktivni kvizovi**: 48 kvizova s po 3 pitanja (procjena prije i nakon lekcije)
- **Višestruka podrška jezika**: Automatski prijevodi na 50+ jezika putem GitHub Actions - **Višejezična podrška**: Automatski prijevodi na više od 50 jezika putem GitHub Actions
- **Tehnologije**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (za AI projekte) - **Tehnologije**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (za AI projekte)
### Arhitektura ### Arhitektura
- Edukativni repozitorij sa strukturom baziranom na lekcijama - Obrazovni repozitorij s lekcijski organiziranom strukturom
- Svaka mapa lekcije sadrži README, primjere koda i rješenja - Svaka mapa lekcije sadrži README, primjere koda i rješenja
- Samostalni projekti u posebnim direktorijima (quiz-app, razni projektni lekcijski direktoriji) - Samostalni projekti u zasebnim direktorijima (quiz-app, razni projektni lekcijski folderi)
- Sustav prevođenja pomoću GitHub Actions (co-op-translator) - Sustav prijevoda preko GitHub Actions (co-op-translator)
- Dokumentacija poslužena putem Docsify i dostupna kao PDF - Dokumentacija poslužena putem Docsify i dostupna kao PDF
## Komande za postavljanje ## Komande za postavljanje
Ovaj repozitorij je primarno namijenjen za konzumaciju edukativnog sadržaja. Za rad s određenim projektima: Ovaj repozitorij prvenstveno služi za konzumaciju obrazovnog sadržaja. Za rad s određenim projektima:
### Postavljanje glavnog repozitorija ### Postavljanje glavnog repozitorija
@ -31,7 +31,7 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Postavljanje Quiz aplikacije (Vue 3 + Vite) ### Postavljanje Quiz Aplikacije (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
@ -41,22 +41,22 @@ npm run build # Izgradi za produkciju
npm run lint # Pokreni ESLint npm run lint # Pokreni ESLint
``` ```
### Bankarski projekt API (Node.js + Express) ### API projekta banke (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Pokreni API poslužitelj npm start # Pokreni API server
npm run lint # Pokreni ESLint npm run lint # Pokreni ESLint
npm run format # Formatiraj s Prettierom npm run format # Formatiraj s Prettier
``` ```
### Projekti proširenja za preglednik ### Projekti proširenja preglednika
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Slijedite upute za učitavanje ekstenzija specifičnih za preglednik # Slijedite upute za učitavanje proširenja specifične za preglednik
``` ```
### Projekti svemirske igre ### Projekti svemirske igre
@ -67,42 +67,42 @@ npm install
# Otvorite index.html u pregledniku ili koristite Live Server # Otvorite index.html u pregledniku ili koristite Live Server
``` ```
### Chat projekt (Python Backend) ### Projekt chata (Python Backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Postavi varijablu okoline GITHUB_TOKEN # Postavite varijablu okoline GITHUB_TOKEN
python api.py python api.py
``` ```
## Razvojni tijek rada ## Radni tok razvoja
### Za suradnike na sadržaju ### Za suradnike na sadržaju
1. **Forkajte repozitorij** na svoj GitHub račun 1. **Forkajte repozitorij** na svoj GitHub račun
2. **Klonirajte svoj fork** lokalno 2. **Klonirajte svoj fork** lokalno
3. **Napravite novu granu** za svoje promjene 3. **Kreirajte novu granu** za svoje izmjene
4. Izvršite promjene u sadržaju lekcija ili primjerima koda 4. Izmijenite sadržaj lekcija ili primjere koda
5. Testirajte sve izmjene koda u odgovarajućim projektnim direktorijima 5. Testirajte kod u relevantnim projektnim direktorijima
6. Pošaljite pull requestove u skladu s uputama za doprinose 6. Pošaljite pull requestove prema smjernicama za doprinos
### Za učenike ### Za učenike
1. Forkajte ili klonirajte repozitorij 1. Forkajte ili klonirajte repozitorij
2. Navigirajte kroz direktorije lekcija redom 2. Krenite redom kroz mape lekcija
3. Čitajte README datoteke za svaku lekciju 3. Pročitajte README datoteke za svaku lekciju
4. Završite kvizove prije lekcija na https://ff-quizzes.netlify.app/web/ 4. Riješite pred-lekcijske kvizove na https://ff-quizzes.netlify.app/web/
5. Riješite primjere koda u mapama lekcija 5. Prođite kroz primjere koda u mapama lekcija
6. Završite zadatke i izazove 6. Riješite zadatke i izazove
7. Polažite kvizove nakon lekcija 7. Riješite post-lekcijske kvizove
### Živi razvoj ### Razvoj uživo
- **Dokumentacija**: Pokrenite `docsify serve` u rootu (port 3000) - **Dokumentacija**: Pokrenite `docsify serve` u korijenu (port 3000)
- **Quiz aplikacija**: Pokrenite `npm run dev` u direktoriju quiz-app - **Quiz aplikacija**: Pokrenite `npm run dev` u mapi quiz-app
- **Projekti**: Koristite VS Code Live Server ekstenziju za HTML projekte - **Projekti**: Koristite VS Code Live Server ekstenziju za HTML projekte
- **API projekti**: Pokrenite `npm start` u odgovarajućim API direktorijima - **API projekti**: Pokrenite `npm start` u odgovarajućim API mapama
## Upute za testiranje ## Upute za testiranje
@ -110,43 +110,43 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Provjeri probleme sa stilom koda npm run lint # Provjerite za probleme s stilom koda
npm run build # Provjeri uspješnost izgradnje npm run build # Provjerite je li izgradnja uspješna
``` ```
### Testiranje Bank API-ja ### Testiranje Bank API-ja
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Provjeri probleme sa stilom koda npm run lint # Provjerite probleme sa stilom koda
node server.js # Provjeri da li se poslužitelj pokreće bez grešaka node server.js # Provjerite pokreće li se poslužitelj bez pogrešaka
``` ```
### Opći pristup testiranju ### Opći pristup testiranju
- Ovo je edukativni repozitorij bez sveobuhvatnih automatskih testova - Ovo je obrazovni repozitorij bez opsežnih automatiziranih testova
- Ručno testiranje fokusira se na: - Manualno testiranje usmjereno na:
- Primjere koda koji se izvršavaju bez pogrešaka - Primjeri koda rade bez grešaka
- Ispravno funkcioniranje linkova u dokumentaciji - Linkovi u dokumentaciji funkcioniraju ispravno
- Uspješnu gradnju projekata - Projekti se mogu uspješno izgraditi
- Slijedjenje najboljih praksi u primjerima - Primjeri slijede najbolje prakse
### Provjere prije slanja ### Provjere prije predaje
- Pokrenite `npm run lint` u direktorijima s package.json - Pokrenite `npm run lint` u mapama koje sadrže package.json
- Provjerite valjanost markdown linkova - Provjerite valjanost markdown linkova
- Testirajte primjere koda u pregledniku ili Node.js - Testirajte primjere koda u pregledniku ili Node.js-u
- Provjerite da prijevodi održavaju pravilnu strukturu - Provjerite da prijevodi zadržavaju ispravnu strukturu
## Smjernice za stil kodiranja ## Smjernice za stil koda
### JavaScript ### JavaScript
- Koristite modernu ES6+ sintaksu - Koristite modernu ES6+ sintaksu
- Slijedite standardne ESLint konfiguracije iz projekata - Slijedite standardne ESLint konfiguracije u projektima
- Koristite smisleno imenovanje varijabli i funkcija radi jasnoće za učenike - Koristite smisleni nazive varijabli i funkcija za jasnoću učenja
- Dodajte komentare koji objašnjavaju koncepte - Dodajte komentare koji objašnjavaju koncepte za učenike
- Formatirajte kod koristeći Prettier gdje je konfigurirano - Formatirajte pomoću Prettier tamo gdje je konfigurirano
### HTML/CSS ### HTML/CSS
@ -157,69 +157,69 @@ node server.js # Provjeri da li se poslužitelj pokreće bez grešaka
### Python ### Python
- Pridržavajte se PEP 8 smjernica - PEP 8 smjernice za stil
- Jasni, edukativni primjeri koda - Jasni, obrazovni primjeri koda
- Tipizacije tamo gdje pomažu učenju - Tipizacija gdje je korisno za učenje
### Markdown dokumentacija ### Markdown dokumentacija
- Jasna hijerarhija naslova - Jasna hijerarhija naslova
- Code blokovi s označenim jezikom - Blokovi koda s označenim jezikom
- Linkovi na dodatne resurse - Linkovi na dodatne resurse
- Screenshoti i slike u mapama `images/` - Screenshoti i slike u `images/` direktorijima
- Alt tekst za slike radi pristupačnosti - Alt tekst za slike radi pristupačnosti
### Organizacija datoteka ### Organizacija datoteka
- Lekcije numerirane sekvencijalno (1-getting-started-lessons, 2-js-basics, itd.) - Lekcije numerički označene (1-getting-started-lessons, 2-js-basics itd.)
- Svaki projekt ima direktorije `solution/` i često `start/` ili `your-work/` - Svaki projekt ima `solution/` i često `start/` ili `your-work/` direktorije
- Slike se nalaze u lekcijski specifičnim mapama `images/` - Slike pohranjenje u lekcijski specifičnim `images/` mapama
- Prijevodi u strukturi `translations/{language-code}/` - Prijevodi u strukturi `translations/{language-code}/`
## Gradnja i implementacija ## Izgradnja i implementacija
### Postavljanje Quiz aplikacije (Azure Static Web Apps) ### Implementacija Quiz aplikacije (Azure Static Web Apps)
Quiz aplikacija je konfigurirana za implementaciju na Azure Static Web Apps: Quiz-app je konfiguriran za Azure Static Web Apps implementaciju:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Stvara mapu dist/ npm run build # Stvara dist/ mapu
# Implementira putem GitHub Actions workflow-a pri pushanju na main # Deploya putem GitHub Actions workflowa pri pushanju na main
``` ```
Konfiguracija Azure Static Web Apps: Konfiguracija Azure Static Web Apps:
- **Lokacija aplikacije**: `/quiz-app` - **Lokacija aplikacije**: `/quiz-app`
- **Lokacija izlaza**: `dist` - **Izlazna lokacija**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Radni tok**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Generiranje PDF dokumentacije ### Generiranje PDF dokumentacije
```bash ```bash
npm install # Instalirajte docsify-to-pdf npm install # Instaliraj docsify-to-pdf
npm run convert # Generirajte PDF iz docsa npm run convert # Generiraj PDF iz docsa
``` ```
### Dokumentacija Docsify ### Docsify dokumentacija
```bash ```bash
npm install -g docsify-cli # Instalirajte Docsify globalno npm install -g docsify-cli # Instalirajte Docsify globalno
docsify serve # Poslužite na localhost:3000 docsify serve # Poslužite na localhost:3000
``` ```
### Gradnje specifične za projekte ### Izgradnja specifična za projekte
Svaki projektni direktorij može imati vlastiti proces gradnje: Svaki projektni direktorij može imati vlastiti postupak izgradnje:
- Vue projekti: `npm run build` kreira produkcijske bundleove - Vue projekti: `npm run build` stvara produkcijske pakete
- Statički projekti: bez koraka gradnje, direktna usluga datoteka - Statički projekti: nema koraka izgradnje, datoteke se poslužuju direktno
## Smjernice za pull requestove ## Smjernice za pull requestove
### Format naslova ### Format naslova
Koristite jasne, opisne naslove koji označavaju područje promjene: Koristite jasne, opisne naslove koji navode područje izmjene:
- `[Quiz-app] Dodaj novi kviz za lekciju X` - `[Quiz-app] Dodaj novi kviz za lekciju X`
- `[Lesson-3] Ispravi tipfelere u terrarium projektu` - `[Lesson-3] Ispravi tipfeler u terrarium projektu`
- `[Translation] Dodaj španjolski prijevod za lekciju 5` - `[Translation] Dodaj španjolski prijevod za lekciju 5`
- `[Docs] Ažuriraj upute za postavljanje` - `[Docs] Ažuriraj upute za postavljanje`
@ -228,12 +228,12 @@ Koristite jasne, opisne naslove koji označavaju područje promjene:
Prije slanja PR-a: Prije slanja PR-a:
1. **Kvaliteta koda**: 1. **Kvaliteta koda**:
- Pokrenite `npm run lint` u pogođenim projektnim direktorijima - Pokrenite `npm run lint` u zahvaćenim projektnim mapama
- Ispravite sve lint greške i upozorenja - Ispravite sve linting greške i upozorenja
2. **Verifikacija gradnje**: 2. **Verifikacija izgradnje**:
- Pokrenite `npm run build` ako je primjenjivo - Pokrenite `npm run build` ako je primjenjivo
- Osigurajte da nema grešaka u gradnji - Osigurajte da nema pogrešaka pri izgradnji
3. **Provjera linkova**: 3. **Provjera linkova**:
- Testirajte sve markdown linkove - Testirajte sve markdown linkove
@ -242,27 +242,27 @@ Prije slanja PR-a:
4. **Pregled sadržaja**: 4. **Pregled sadržaja**:
- Provjerite pravopis i gramatiku - Provjerite pravopis i gramatiku
- Osigurajte da su primjeri koda točni i edukativni - Osigurajte da su primjeri koda točni i edukativni
- Provjerite da prijevodi čuvaju izvorno značenje - Provjerite da prijevodi zadržavaju izvorno značenje
### Zahtjevi za doprinos ### Zahtjevi za doprinos
- Prihvatite Microsoft CLA (automatska provjera pri prvom PR-u) - Prihvatite Microsoft CLA (automatizirana provjera kod prvog PR-a)
- Slijedite [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Slijedite [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Pogledajte [CONTRIBUTING.md](./CONTRIBUTING.md) za detaljne upute - Pogledajte [CONTRIBUTING.md](./CONTRIBUTING.md) za detaljne smjernice
- U opisu PR-a navedite brojeve povezanih issuea ako ih ima - U opisu PR-a navedite brojeve povezanih issueova ako ih ima
### Proces pregleda ### Proces pregleda
- PR-ove pregledavaju održavatelji i zajednica - PR-ovi pregledavaju održavatelji i zajednica
- Prioritet je jasnoća edukativnog sadržaja - Prioritet je obrazovna jasnoća
- Primjeri koda trebaju slijediti trenutne najbolje prakse - Primjeri koda trebaju slijediti trenutne najbolje prakse
- Prijevodi se pregledavaju radi točnosti i kulturne prikladnosti - Prijevodi se pregledavaju zbog točnosti i prikladnosti za ciljanu kulturu
## Sustav prevođenja ## Sustav prijevoda
### Automatizirani prijevod ### Automatski prijevod
- Koristi GitHub Actions s co-op-translator workflowom - Koristi GitHub Actions s co-op-translator radnim tokom
- Automatski prevodi na 50+ jezika - Automatski prevodi na 50+ jezika
- Izvorne datoteke u glavnim direktorijima - Izvorne datoteke u glavnim direktorijima
- Prevedene datoteke u direktorijima `translations/{language-code}/` - Prevedene datoteke u direktorijima `translations/{language-code}/`
@ -270,13 +270,13 @@ Prije slanja PR-a:
### Dodavanje ručnih poboljšanja prijevoda ### Dodavanje ručnih poboljšanja prijevoda
1. Pronađite datoteku u `translations/{language-code}/` 1. Pronađite datoteku u `translations/{language-code}/`
2. Napravite poboljšanja pazeći na očuvanje strukture 2. Napravite poboljšanja pri čuvanju strukture
3. Osigurajte ispravnost funkcionalnosti primjera koda 3. Osigurajte da primjeri koda ostanu funkcionalni
4. Testirajte eventualni lokalizirani sadržaj kvizova 4. Testirajte lokalizirani kviz sadržaj
### Metapodaci prijevoda ### Metapodaci prijevoda
Prevedene datoteke sadrže metapodatkovni header: Prevedene datoteke uključuju zaglavlje s metapodacima:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Otklanjanje pogrešaka i rješavanje problema ## Debugiranje i rješavanje problema
### Česti problemi ### Uobičajeni problemi
**Quiz aplikacija ne želi startati**: **Quiz aplikacija ne uspijeva pokrenuti se**:
- Provjerite verziju Node.js (preporučeno v14+) - Provjerite verziju Node.js (preporučeno v14+)
- Izbrišite `node_modules` i `package-lock.json`, pokrenite `npm install` ponovno - Izbrišite `node_modules` i `package-lock.json`, ponovo pokrenite `npm install`
- Provjerite sukobe portova (default: Vite koristi port 5173) - Provjerite konflikte portova (zadano: Vite koristi port 5173)
**API server se ne pokreće**: **API server se ne pokreće**:
- Provjerite zadovoljava li Node.js minimalnu verziju (node >=10) - Provjerite zadovoljava li verzija Node.js minimum (node >=10)
- Provjerite je li port zauzet - Provjerite koristi li već netko port
- Osigurajte da su sve ovisnosti instalirane s `npm install` - Osigurajte da su sve ovisnosti instalirane s `npm install`
**Proširenje za preglednik se ne učitava**: **Proširenje preglednika se ne učitava**:
- Provjerite ispravnost manifest.json formata - Provjerite da je manifest.json ispravno formatiran
- Provjerite konzolu preglednika za greške - Provjerite konzolu preglednika za greške
- Slijedite upute za instalaciju proširenja specifične za preglednik - Slijedite upute za instalaciju specifične za preglednik
**Problemi s Python chat projektom**: **Problemi s Python chat projektom**:
- Provjerite je li instaliran paket OpenAI: `pip install openai` - Provjerite je li paket OpenAI instaliran: `pip install openai`
- Provjerite je li GITHUB_TOKEN varijabla okruženja postavljena - Provjerite da je postavljena varijabla okoline GITHUB_TOKEN
- Provjerite dozvole pristupa za GitHub Models - Provjerite dozvole pristupa GitHub modelima
**Docsify ne poslužuje dokumente**: **Docsify ne poslužuje dokumente**:
- Instalirajte docsify-cli globalno: `npm install -g docsify-cli` - Instalirajte docsify-cli globalno: `npm install -g docsify-cli`
- Pokrenite iz root direktorija repozitorija - Pokrenite iz korijena repozitorija
- Provjerite postoji li `docs/_sidebar.md` - Provjerite postojanje datoteke `docs/_sidebar.md`
### Savjeti za razvojno okruženje ### Savjeti za razvojno okruženje
- Koristite VS Code s Live Server ekstenzijom za HTML projekte - Koristite VS Code s Live Server ekstenzijom za HTML projekte
- Instalirajte ESLint i Prettier ekstenzije za dosljedno formatiranje - Instalirajte ESLint i Prettier ekstenzije za dosljedno formatiranje
- Koristite DevTools u pregledniku za debug JavaScripta - Koristite DevTools u pregledniku za debugiranje JavaScript-a
- Za Vue projekte instalirajte Vue DevTools ekstenziju za preglednik - Za Vue projekte instalirajte Vue DevTools ekstenziju za preglednik
### Razmatranja performansi ### Performanse
- Veliki broj prevedenih datoteka (50+ jezika) uzrokuje velike klonove - Velik broj prevedenih datoteka (50+ jezika) čini cjelokupne klonove velikima
- Koristite shallow clone ako radite samo na sadržaju: `git clone --depth 1` - Koristite shallow clone ako radite samo na sadržaju: `git clone --depth 1`
- Isključite prijevode iz pretraživanja kad radite na sadržaju na engleskom - Isključite prijevode iz pretraživanja dok radite na engleskom sadržaju
- Procesi gradnje mogu biti spori pri prvom pokretanju (npm install, Vite build) - Postupci izgradnje mogu biti spori pri prvom pokretanju (npm install, Vite build)
## Sigurnosna razmatranja ## Sigurnosni čimbenici
### Varijable okruženja ### Varijable okoline
- API ključevi se nikad ne bi smjeli komitirati u repozitorij - API ključevi se nikada ne smiju pohranjivati u repozitorij
- Koristite `.env` datoteke (već navedene u `.gitignore`) - Koristite `.env` datoteke (već u `.gitignore`)
- Dokumentirajte potrebne varijable okruženja u README-ima projekata - Dokumentirajte potrebne varijable okoline u README datotekama projekata
### Python projekti ### Python projekti
- Koristite virtualna okruženja: `python -m venv venv` - Koristite virtualna okruženja: `python -m venv venv`
- Održavajte ovisnosti ažurnima - Održavajte ovisnosti ažuriranima
- GitHub tokeni trebaju imati minimalne potrebne dozvole - GitHub tokeni trebaju imati minimalne potrebne dozvole
### Pristup GitHub Models ### Pristup GitHub modelima
- Potrebni su Personal Access Tokens (PAT) za GitHub modele - Potrebni su Personal Access Tokeni (PAT) za GitHub modele
- Tokeni trebaju biti pohranjeni kao varijable okruženja - Tokeni se trebaju pohranjivati kao varijable okoline
- Nikad nemojte komitirati tokene ili vjerodajnice - Nikada ne commitajte tokene ili vjerodajnice
## Dodatne napomene ## Dodatne bilješke
### Ciljana publika ### Ciljna publika
- Potpuni početnici u web razvoju - Potpuni početnici u web razvoju
- Studenti i samostalni učenici - Studenti i samouki polaznici
- Nastavnici koji koriste nastavne planove u učionicama - Nastavnici koji koriste plan i program u učionicama
- Sadržaj je osmišljen za pristupačnost i postupno stjecanje vještina - Sadržaj dizajniran za pristupačnost i postupno stjecanje vještina
### Pedagoška filozofija ### Obrazovna filozofija
- Pristup učenja baziran na projektima - Pristup učenju kroz projekte
- Česte provjere znanja (kvizovi) - Česte provjere znanja (kvizovi)
- Praktične vježbe kodiranja - Praktične vježbe kodiranja
- Primjeri iz stvarnog svijeta - Primjeri iz stvarnog svijeta
- Fokus na temelje prije okvira - Fokus na osnove prije okvira
### Održavanje repozitorija ### Održavanje repozitorija
- Aktivna zajednica učenika i suradnika - Aktivna zajednica učenika i suradnika
- Redovne nadogradnje ovisnosti i sadržaja - Redovna ažuriranja ovisnosti i sadržaja
- Problemi i diskusije praćeni od strane održavatelja - Problemi i rasprave nadgledaju održavatelji
- Automatska ažuriranja prijevoda putem GitHub Actions - Automatska ažuriranja prijevoda putem GitHub Actions
### Povezani resursi ### Povezani resursi
- [Microsoft Learn moduli](https://docs.microsoft.com/learn/) - [Microsoft Learn moduli](https://docs.microsoft.com/learn/)
- [Student Hub resursi](https://docs.microsoft.com/learn/student-hub/) - [Student Hub resursi](https://docs.microsoft.com/learn/student-hub/)
- Preporučen GitHub Copilot za učenike: [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) preporučeno za učenike
- Dodatni tečajevi: Generativni AI, Data Science, ML, IoT kurikulumi dostupni - Dodatni tečajevi: Generativni AI, znanost o podacima, ML, IoT planovi i programi
### Rad s određenim projektima ### Rad s određenim projektima
Za detaljne upute o pojedinačnim projektima, pogledajte README datoteke u: Za detaljne upute o pojedinačnim projektima pogledajte README datoteke u:
- `quiz-app/README.md` - Vue 3 aplikacija kviza - `quiz-app/README.md` - Vue 3 aplikacija za kvizove
- `7-bank-project/README.md` - Bankarska aplikacija s autentikacijom - `7-bank-project/README.md` - Bankovna aplikacija s autentifikacijom
- `5-browser-extension/README.md` - Razvoj proširenja za preglednik - `5-browser-extension/README.md` - Razvoj proširenja preglednika
- `6-space-game/README.md` - Razvoj igre bazirane na canvasu - `6-space-game/README.md` - Razvoj igre na canvasu
- `9-chat-project/README.md` - Projekt AI chat asistenta - `9-chat-project/README.md` - AI pomoćnik za chat
### Struktura Monorepo repozitorija ### Struktura monorepoa
Iako nije tradicionalni monorepo, repozitorij sadrži više nezavisnih projekata: Iako nije tradicionalni monorepo, ovaj repozitorij sadrži više neovisnih projekata:
- Svaka lekcija je samostalna - Svaka lekcija je samostalna
- Projekti ne dijele ovisnosti - Projekti ne dijele ovisnosti
- Rad na pojedinačnim projektima bez utjecaja na druge - Radite na pojedinačnim projektima bez utjecaja na druge
- Klonirajte cijeli repozitorij za potpuno iskustvo nastavnog programa - Klonirajte cijeli repozitorij za cjelokupno iskustvo plana i programa
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Odricanje od odgovornosti**: **Izjava o odricanju od odgovornosti**:
Ovaj dokument je preveden pomoću AI usluge za prijevod [Co-op Translator](https://github.com/Azure/co-op-translator). Iako težimo točnosti, molimo imajte na umu da automatski prijevodi mogu sadržavati pogreške ili netočnosti. Izvorni dokument na njegovom izvornom jeziku treba smatrati autoritativnim izvorom. Za važne informacije preporučuje se profesionalni ljudski prijevod. Ne snosimo odgovornost za bilo kakve nesporazume ili kriva tumačenja koja proizlaze iz korištenja ovog prijevoda. Ovaj je dokument preveden pomoću AI usluge prevođenja [Co-op Translator](https://github.com/Azure/co-op-translator). Iako nastojimo postići točnost, imajte na umu da automatski prijevodi mogu sadržavati greške ili netočnosti. Izvorni dokument na izvornom jeziku treba se smatrati autoritativnim izvorištem. Za kritične informacije preporučuje se profesionalni ljudski prijevod. Nismo odgovorni za bilo kakva nesporazuma ili pogrešna tumačenja koja proizlaze iz korištenja ovog prijevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -10,29 +10,29 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Web development za početnike - Nastavni plan # Web razvoj za početnike - Nastavni plan
Naučite osnove web razvoja s našim opsežnim tečajem od 12 tjedana koji vode Microsoft Cloud zagovaratelji. Svaka od 24 lekcija detaljno obrađuje JavaScript, CSS i HTML kroz praktične projekte kao što su terariji, proširenja preglednika i igre u svemiru. Uključite se u kvizove, rasprave i praktične zadatke. Poboljšajte svoje vještine i optimizirajte zadržavanje znanja našom učinkovitošću pedagoškog pristupa zasnovanog na projektima. Započnite svoje kodiranje danas! Naučite osnove web razvoja uz naš sveobuhvatni 12-tjedni tečaj koji vode Microsoft Cloud zagovornici. Svaka od 24 lekcije detaljno obrađuje JavaScript, CSS i HTML kroz praktične projekte poput terarija, ekstenzija za preglednik i svemirskih igara. Sudjelujte u kvizovima, raspravama i praktičnim zadacima. Poboljšajte svoje vještine i optimizirajte zadržavanje znanja pomoću naše učinkovite pedagoške metode temeljene na projektima. Započnite svoje programersko putovanje danas!
Pridružite se Azure AI Foundry Discord zajednici Pridružite se Azure AI Foundry Discordu i upoznajte stručnjake i kolege developere.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Slijedite ove korake za početak korištenja ovih resursa: Slijedite ove korake kako biste započeli koristiti ove resurse:
1. **Razvucite spremište**: Kliknite [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Forkajte repozitorij**: Kliknite [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Klonirajte spremište**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 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 programere**](https://discord.com/invite/ByRwuEEgH4) 3. [**Pridružite se Azure AI Foundry Discordu i upoznajte stručnjake i kolege developere**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Podrška za više jezika ### 🌐 Podrška za više jezika
#### Podržano putem GitHub akcije (Automatski i uvijek ažurno) #### Podržano putem GitHub akcije (Automatski i uvijek ažurirano)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](./README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](./README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Radije lokalno klonirati?** > **Želite li klonirati lokalno?**
> >
> Ovo spremište uključuje prevode na 50+ jezika što znatno povećava veličinu preuzimanja. Za kloniranje bez prijevoda, koristite sparse checkout: > 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:** > **Bash / macOS / Linux:**
> ```bash > ```bash
@ -48,44 +48,44 @@ Slijedite ove korake za početak korištenja ovih resursa:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> Ovo vam daje sve što je potrebno za dovršavanje tečaja uz mnogo brže preuzimanje. > Ovo vam pruža sve što je potrebno za dovršetak tečaja uz znatno brže preuzimanje.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ako želite dodati podršku za dodatne jezike, popis podržanih jezika nalazi se [ovdje](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Ako želite dodatne prijevode, podržani jezici su navedeni ovdje. [ovdje](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Jeste li student?_ #### 🧑‍🎓 _Jeste li student?_
Posjetite [**Student Hub stranicu**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) gdje ćete pronaći resurse za početnike, studentske pakete pa čak i načine za dobivanje besplatnog vaučera za certifikat. Ovo je stranica koju biste trebali označiti i povremeno provjeravati jer redovito mijenjamo sadržaj. Posjetite [**Student Hub stranicu**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) gdje ćete pronaći resurse za početnike, studentske pakete i čak načine kako za dobiti besplatnu potvrdu. Ovo je stranica koju želite označiti i povremeno provjeravati jer se sadržaj redovito mijenja.
### 📣 Najava - Novi izazovi u GitHub Copilot Agent modu za dovršiti! ### 📣 Najava - Novi izazovi u GitHub Copilot Agent načinu rada!
Dodani su novi izazovi, pogledajte "GitHub Copilot Agent Challenge 🚀" u većini poglavlja. To je novi izazov koji trebate dovršiti koristeći GitHub Copilot i Agent mod. Ako do sada niste koristili Agent mod, on ne samo da može generirati tekst, već i stvarati i uređivati datoteke, pokretati naredbe i više. Dodani su novi izazovi, potražite "GitHub Copilot Agent Challenge 🚀" u većini poglavlja. To je novi izazov koji trebate dovršiti koristeći GitHub Copilot i Agent način rada. Ako do sada niste koristili Agent način, on nije samo za generiranje teksta već može i kreirati te uređivati datoteke, izvršavati naredbe i još mnogo toga.
### 📣 Najava - _Novi projekt za izgraditi koristeći Generativnu AI_ ### 📣 Najava - _Novi projekt za izgradnju uz Generativnu AI_
Novi AI Assistant projekt upravo dodan, pogledajte [projekt](./9-chat-project/README.md) Dodali smo novi AI Assistant projekt, pogledajte [projekt](./9-chat-project/README.md)
### 📣 Najava - _Novi Nastavni plan_ o Generativnoj AI za JavaScript upravo je objavljen ### 📣 Najava - _Novi Nastavni plan_ za Generativnu AI za JavaScript je upravo objavljen
Ne propustite naš novi nastavni plan o Generativnoj AI! Ne propustite naš novi kurikulum za Generativnu AI!
Posjetite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za početak! Posjetite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za početak!
![Background](../../translated_images/hr/background.148a8d43afde5730.webp) ![Background](../../translated_images/hr/background.148a8d43afde5730.webp)
- Lekcije koje pokrivaju sve od osnova do RAG-a. - Lekcije koje pokrivaju sve od osnova do RAG-a.
- Interakcija s povijesnim likovima koristeći GenAI i našu aplikaciju suputnicu. - Interakcija s povijesnim likovima koristeći GenAI i našu prateću aplikaciju.
- Zabavan i zanimljiv narativ, putovat ćete kroz vrijeme! - Zabavna i zanimljiva pripovijest, putovat ćete kroz vrijeme!
![character](../../translated_images/hr/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/hr/character.5c0dd8e067ffd693.webp)
Svaka lekcija uključuje zadatak za dovršiti, provjeru znanja i izazov koji vas vodi kroz teme kao što su: Svaka lekcija uključuje zadatak za dovršiti, provjeru znanja i izazov koji vas vodi u učenju tema poput:
- Promptanje i inženjering prompta - Promptiranje i inženjering prompta
- Generiranje tekstualnih i slikovnih aplikacija - Generiranje aplikacija za tekst i slike
- Pretraživačke aplikacije - Aplikacije za pretraživanje
Posjetite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za početak! Posjetite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za početak!
@ -93,37 +93,37 @@ Posjetite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za po
## 🌱 Početak rada ## 🌱 Početak rada
> **Nastavnici**, uključili smo [neke prijedloge](for-teachers.md) kako koristiti ovaj nastavni plan. Voljeli bismo vaše povratne informacije [u našem forumu za raspravu](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Nastavnici**, uključili smo [neke prijedloge](for-teachers.md) o tome kako koristiti ovaj nastavni plan. Voljeli bismo dobiti vaše povratne informacije [u našem forumu za rasprave](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Učeći](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, za svaku lekciju započnite s predpredavanjem kvizom i nastavite s čitanjem materijala predavanja, dovršavanjem raznih aktivnosti i provjerite svoje razumijevanje s postpredavačkim kvizom. **[Učenici](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, za svaku lekciju započnite s predpredavanjem kvizom, a zatim nastavite čitanjem nastavnog materijala, dovršite različite aktivnosti i provjerite svoje razumijevanje putem kviza nakon predavanja.
Kako biste poboljšali svoje iskustvo učenja, povežite se sa svojim vršnjacima da zajedno radite na projektima! Rasprave su poticane na našem [forum za raspravu](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) gdje će naš tim moderatora biti dostupan za odgovore na vaša pitanja. Za bolje iskustvo učenja, povežite se sa svojim kolegama radi zajedničkog rada na projektima! Rasprave su poticane na našem [forum za rasprave](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) gdje će tim moderatora biti dostupni za odgovore na vaša pitanja.
Za daljnje obrazovanje, toplo preporučujemo istraživanje [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) za dodatne materijale za učenje. Za daljnje obrazovanje, toplo preporučujemo istraživanje [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) za dodatne materijale za učenje.
### 📋 Postavljanje vašeg okruženja ### 📋 Postavljanje vašeg okruženja
Ovaj nastavni plan ima razvojno okruženje spremno za upotrebu! Kad započnete, možete odabrati za pokretanje nastavnog plana u [Codespaceu](https://github.com/features/codespaces/) (_okruženje temeljeno na pregledniku, bez potrebe za instalacijama_), ili lokalno na vašem računalu koristeći uređivač teksta kao što je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Ovaj nastavni plan ima spremno razvojno okruženje! Kad započnete, možete odabrati pokretanje kurikuluma u [Codespaceu](https://github.com/features/codespaces/) (_okruženju u pregledniku bez potrebe za instalacijom_), ili lokalno na vašem računalu koristeći uređivač teksta poput [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Izradite svoje spremište #### Kreirajte svoj repozitorij
Kako biste si olakšali spremanje vašeg rada, preporučuje se da napravite vlastitu kopiju ovog spremišta. To možete napraviti klikom na gumb **Use this template** na vrhu stranice. Time ćete stvoriti novo spremište na vašem GitHub računu s kopijom nastavnog plana. Kako biste lakše spremili svoj rad, preporuča se da napravite svoju kopiju ovog repozitorija. To možete učiniti klikom na gumb **Use this template** na vrhu stranice. Ovo će stvoriti novi repozitorij na vašem GitHub računu s kopijom nastavnog plana.
Slijedite ove korake: Slijedite ove korake:
1. **Razvucite spremište**: Kliknite na gumb "Fork" u gornjem desnom kutu ove stranice. 1. **Forkajte repozitorij**: Kliknite na gumb "Fork" u gornjem desnom kutu ove stranice.
2. **Klonirajte spremište**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klonirajte repozitorij**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Pokretanje nastavnog plana u Codespaceu #### Pokretanje kurikuluma u Codespaceu
U svojoj kopiji ovog spremišta koju ste napravili, kliknite na gumb **Code** i odaberite **Open with Codespaces**. To će stvoriti novi Codespace u kojem možete raditi. U svojoj kopiji repozitorija koju ste napravili, kliknite gumb **Code** i odaberite **Open with Codespaces**. Ovo će stvoriti novi Codespace za rad.
![Codespace](../../translated_images/hr/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/hr/createcodespace.0238bbf4d7a8d955.webp)
#### Pokretanje nastavnog plana lokalno na vašem računalu #### Pokretanje kurikuluma lokalno na vašem računalu
Za pokretanje ovog nastavnog plana lokalno na vašem računalu, potreban vam je uređivač teksta, preglednik i alat naredbene linije. Naša prva lekcija, [Uvod u programske jezike i alate struke](../../1-getting-started-lessons/1-intro-to-programming-languages), pokazat će vam različite opcije za svaki od ovih alata kako biste mogli odabrati ono što vam najbolje odgovara. Za pokretanje kurikuluma lokalno na vašem računalu trebat će vam uređivač teksta, preglednik i alat naredbenog retka. Naša prva lekcija, [Uvod u programske jezike i alate](../../1-getting-started-lessons/1-intro-to-programming-languages), vodi vas kroz različite opcije za svaki od ovih alata kako biste mogli odabrati ono što vam najviše odgovara.
Naša preporuka je korištenje [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kao uređivača, koji također ima ugrađeni [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code možete preuzeti [ovdje](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Naša preporuka je korištenje [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kao uređivača, koji ima ugrađeni [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code možete preuzeti [ovdje](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Klonirajte svoj repozitorij na svoje računalo. To možete učiniti klikom na gumb **Code** i kopiranjem URL-a: 1. Klonirajte svoj repozitorij na računalo. To možete učiniti klikom na gumb **Code** i kopiranjem URL-a:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
@ -133,148 +133,148 @@ Naša preporuka je korištenje [Visual Studio Code](https://code.visualstudio.co
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Otvorite mapu u Visual Studio Code-u. To možete učiniti klikom na **File** > **Open Folder** i odabirom mape koju ste upravo klonirali. 2. Otvorite mapu u Visual Studio Codeu. To možete učiniti klikom na **File** > **Open Folder** i odabirom mape koju ste upravo klonirali.
> Preporučeni Visual Studio Code dodaci: > Preporučeni Visual Studio Code dodaci:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - za pregled HTML stranica unutar Visual Studio Code-a > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - za pregled HTML stranica unutar Visual Studio Codea
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - za pomoć pri bržem pisanju koda > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - za brže pisanje koda
## 📂 Svaka lekcija uključuje: ## 📂 Svaka lekcija uključuje:
- opcionalni sketchnote - opcionalnu skicu
- opcionalni dodatni video - opcionlani dodatni video
- kviz za zagrijavanje prije lekcije - kviz za zagrijavanje prije lekcije
- pisanu lekciju - pisanu lekciju
- za lekcije temeljene na projektima, vodiče korak-po-korak o izradi projekta - za lekcije temeljene na projektima, detaljne vodiče za izgradnju projekta
- provjere znanja - provjere znanja
- izazov - izazov
- dodatnu literaturu - dodatno čitanje
- zadatak - zadatak
- [kviz nakon lekcije](https://ff-quizzes.netlify.app/web/) - [kviz nakon lekcije](https://ff-quizzes.netlify.app/web/)
> **Napomena o kvizovima**: Svi kvizovi nalaze se u mapi Quiz-app, ukupno 48 kvizova s po tri pitanja. Dostupni su [ovdje](https://ff-quizzes.netlify.app/web/); aplikacija za kviz može se pokrenuti lokalno ili postaviti na Azure; slijedite upute u mapi `quiz-app`. > **Napomena o kvizovima**: Svi kvizovi se nalaze u mapi Quiz-app, ukupno 48 kvizova sa po tri pitanja. Dostupni su [ovdje](https://ff-quizzes.netlify.app/web/), aplikacija za kviz se može pokrenuti lokalno ili implementirati na Azure; slijedite upute u mapi `quiz-app`.
## 🗃️ Lekcije ## 🗃️ Lekcije
| | Naziv projekta | Pojmovi koji se uče | Ciljevi učenja | Povezana lekcija | Autor | | | Naziv projekta | Pojmovi koji se podučavaju | Ciljevi učenja | Povezana lekcija | Autor |
| :-: | :--------------------------------------------------------: | :------------------------------------------------------------------------: | ------------------------------------------------------------------------------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :--------------------------------------------------------: | :------------------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Početak rada | Uvod u programiranje i alati struke | Naučite osnovne osnove većine programskih jezika i o softveru koji pomaže profesionalnim programerima u njihovom radu | [Uvod u programske jezike i alate struke](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Početak | Uvod u programiranje i alati trgovine | Naučite osnovne temeljne pojmove većine programskih jezika i o softveru koji pomaže profesionalnim programerima u njihovom radu | [Uvod u programske jezike i alate trgovine](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Početak rada | Osnove GitHuba, uključujući rad u timu | Kako koristiti GitHub u svom projektu, kako surađivati s drugima na kodnoj bazi | [Uvod u GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Početak | Osnove GitHub-a, uključuje rad u timu | Kako koristiti GitHub u svom projektu, kako surađivati s drugima na bazi koda | [Uvod u GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Početak rada | Pristupačnost | Naučite osnove web pristupačnosti | [Osnove pristupačnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Početak | Pristupačnost | Naučite osnove web pristupačnosti | [Osnove pristupačnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Osnove JS | JavaScript tipovi podataka | Osnove JavaScript tipova podataka | [Tipovi podataka](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | Osnove JS | Tipovi podataka u JavaScriptu | Osnove tipova podataka u JavaScriptu | [Tipovi podataka](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Osnove JS | Funkcije i metode | Učite o funkcijama i metodama za upravljanje logikom aplikacije | [Funkcije i metode](./2-js-basics/2-functions-methods/README.md) | Jasmine i Christopher | | 05 | Osnove JS | Funkcije i metode | Naučite o funkcijama i metodama za upravljanje logikom aplikacije | [Funkcije i metode](./2-js-basics/2-functions-methods/README.md) | Jasmine i Christopher |
| 06 | Osnove JS | Donošenje odluka s JS | Naučite kako kreirati uvjete u svom kodu koristeći metode donošenja odluka | [Donošenje odluka](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | Osnove JS | Donošenje odluka s JS | Naučite kako stvarati uvjete u svom kodu koristeći metode donošenja odluka | [Donošenje odluka](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Osnove JS | Nizovi i petlje | Rad s podacima korištenjem nizova i petlji u JavaScriptu | [Nizovi i petlje](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | Osnove JS | Nizovi i petlje | Rad s podacima koristeći nizove i petlje u JavaScriptu | [Nizovi i petlje](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarij](./3-terrarium/solution/README.md) | HTML u praksi | Izgradite HTML za online terarij, fokusirajući se na izradu rasporeda | [Uvod u HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarij](./3-terrarium/solution/README.md) | HTML u praksi | Izgradite HTML za izradu online terarija, s naglaskom na izgradnju izgleda | [Uvod u HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarij](./3-terrarium/solution/README.md) | CSS u praksi | Izgradite CSS za stiliziranje online terarija, fokusirajući se na osnove CSS-a uključujući prilagodbu stranice | [Uvod u CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarij](./3-terrarium/solution/README.md) | CSS u praksi | Izgradite CSS za stiliziranje online terarija, s naglaskom na osnove CSS-a uključujući prilagođavanje stranice za različite uređaje | [Uvod u CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarij](./3-terrarium/solution/README.md) | JavaScript zatvaranja, manipulacija DOM-om | Izradite JavaScript da terarij funkcionira kao sučelje za povlačenje i ispuštanje, fokusirajući se na zatvaranja i manipulaciju DOM-a | [JavaScript zatvaranja, manipulacija DOM-om](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarij](./3-terrarium/solution/README.md) | JavaScript zatvaranja, manipulacija DOM-om | Izgradite JavaScript kako bi terarij funkcionirao kao sučelje za povlačenje i ispuštanje, s naglaskom na zatvaranja i manipulaciju DOM-om | [JavaScript zatvaranja, manipulacija DOM-om](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Igra tipkanja](./4-typing-game/solution/README.md) | Izgradnja igre tipkanja | Naučite kako koristiti događaje tipkovnice za upravljanje logikom vaše JavaScript aplikacije | [Programiranje vođeno događajima](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Igra tipkanja](./4-typing-game/solution/README.md) | Izgradnja igre tipkanja | Naučite kako koristiti događaje tipkovnice za upravljanje logikom vaše JavaScript aplikacije | [Programiranje vođeno događajima](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Rad s preglednicima | Naučite kako preglednici rade, njihovu povijest i kako napraviti osnove proširenja za preglednik | [O preglednicima](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Rad s preglednicima | Naučite kako preglednici rade, njihovu povijest i kako napraviti osnovne elemente proširenja preglednika | [O preglednicima](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Izrada forme, pozivanje API-ja i pohranjivanje varijabli u lokalnu pohranu | Izradite JavaScript elemente za vaše proširenje preglednika za pozivanje API-ja koristeći varijable pohranjene u lokalnoj pohrani | [API, forme i lokalna pohrana](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Izgradnja obrasca, pozivanje API-ja i pohrana varijabli u lokalnu pohranu | Izgradite JavaScript elemente svog proširenja preglednika za pozivanje API-ja koristeći varijable pohranjene u lokalnu pohranu | [API-ji, obrasci i lokalna pohrana](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Pozadinski procesi u pregledniku, web performanse | Koristite pozadinske procese preglednika za upravljanje ikonom proširenja; naučite o web performansama i nekim optimizacijama | [Pozadinski zadaci i performanse](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Zeleni proširenje preglednika](./5-browser-extension/solution/README.md) | Pozadinski procesi u pregledniku, web performanse | Koristite pozadinske procese preglednika za upravljanje ikonama proširenja; naučite o web performansama i nekim optimizacijama za poboljšanje učinka | [Pozadinski zadaci i performanse](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Igra u svemiru](./6-space-game/solution/README.md) | Napredniji razvoj igara s JavaScriptom | Naučite o nasljeđivanju koristeći klase i kompoziciju kao i Pub/Sub obrazac, kao pripremu za izgradnju igre | [Uvod u napredni razvoj igara](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Igra svemira](./6-space-game/solution/README.md) | Napredniji razvoj igara s JavaScriptom | Naučite o nasljeđivanju koristeći i klase i kompoziciju te Pub/Sub obrazac, u pripremi za izradu igre | [Uvod u napredni razvoj igara](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Igra u svemiru](./6-space-game/solution/README.md) | Crtanje na platnu | Naučite o Canvas API-ju koji se koristi za crtanje elemenata na zaslonu | [Crtanje na platnu](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Igra svemira](./6-space-game/solution/README.md) | Crtanje na canvasu | Naučite o Canvas API-ju, koji se koristi za iscrtavanje elemenata na zaslonu | [Crtanje na canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Igra u svemiru](./6-space-game/solution/README.md) | Pomicanje elemenata po zaslonu | Saznajte kako elementi mogu dobiti pokret koristeći kartezijanske koordinate i Canvas API | [Pomicanje elemenata](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Igra svemira](./6-space-game/solution/README.md) | Pomicanje elemenata po zaslonu | Otkrijte kako elementi mogu dobiti gibanje koristeći kartezijanske koordinate i Canvas API | [Pomicanje elemenata](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Igra u svemiru](./6-space-game/solution/README.md) | Detekcija sudara | Omogućite da se elementi sudaraju i međusobno reagiraju koristeći tipke te pružite funkciju hladnog vremena radi performansi | [Detekcija sudara](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Igra svemira](./6-space-game/solution/README.md) | Detekcija sudara | Neka se elementi sudaraju i reagiraju jedni na druge koristeći pritiske tipki i pružite funkciju hlađenja radi osiguranja performansi igre | [Detekcija sudara](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Igra u svemiru](./6-space-game/solution/README.md) | Vođenje rezultata | Izvršite matematičke izračune na temelju statusa i performansi igre | [Vođenje rezultata](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Igra svemira](./6-space-game/solution/README.md) | Vođenje rezultata | Izvršite matematičke izračune na temelju statusa i učinka igre | [Vođenje rezultata](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Igra u svemiru](./6-space-game/solution/README.md) | Završavanje i ponovno pokretanje igre | Naučite o završavanju i ponovnom pokretanju igre, uključujući čišćenje resursa i resetiranje varijabli | [Uvjeti završetka](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Igra svemira](./6-space-game/solution/README.md) | Završavanje 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](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | HTML predlošci i rute u web aplikaciji | Naučite kako napraviti kostur arhitekture višestranične web stranice koristeći routanje i HTML predloške | [HTML predlošci i rute](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | HTML predlošci i rute u web aplikaciji | Naučite kako stvoriti osnovu arhitekture višestranih web stranica koristeći rutiranje i HTML predloške | [HTML predlošci i rute](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Izgradnja forme za prijavu i registraciju | Naučite o izradi formi i postupanju s rutama validacije | [Forme](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Izgradnja obrasca za prijavu i registraciju | Naučite o izgradnji obrazaca i rukovanju rutinama provjere podataka | [Obrasci](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Metode dohvaćanja i korištenja podataka | Kako podaci ulaze u aplikaciju i izlaze iz nje, kako ih dohvatiti, pohraniti i ukloniti | [Podaci](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Metode dohvaćanja i korištenja podataka | Kako podaci ulaze i izlaze iz vaše aplikacije, kako ih dohvatiti, spremiti i ukloniti | [Podaci](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Koncepti upravljanja stanjem | Naučite kako vaša aplikacija zadržava stanje i kako ga programatski upravljati | [Upravljanje stanjem](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Koncepti upravljanja stanjem | Naučite kako vaša aplikacija zadržava stanje i kako njime upravljati programatski | [Upravljanje stanjem](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Code preglednik/VScode](../../8-code-editor) | Rad s VScode | Naučite koristiti uređivač koda | [Korištenje VScode uređivača koda](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Preglednik/Kôd VScode](../../8-code-editor) | Rad s VScode | Naučite kako koristiti uređivač koda| [Korištenje uređivača koda VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI asistenti](./9-chat-project/README.md) | Rad s umjetnom inteligencijom | Naučite kako izraditi vlastitog AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris | | 26 | [AI asistenti](./9-chat-project/README.md) | Rad s umjetnom inteligencijom | Naučite kako izgraditi vlastitog AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogija ## 🏫 Pedagogija
Naš kurikulum je osmišljen s dva ključna pedagoška principa na umu: Naš nastavnički program je osmišljen s dva ključna pedagoška principa na umu:
* učenje temeljeno na projektima * učenje temeljem projekata
* česti kvizovi * česti kvizovi
Program podučava osnove JavaScript-a, HTML-a i CSS-a, kao i najnovije alate i tehnike koje koriste današnji web programeri. Studenti će imati priliku steći praktično iskustvo izradom igre tipkanja, virtualnog terarija, ekološki prihvatljivog proširenja za preglednike, igre u stilu space-invadera i bankovne aplikacije za poduzeća. Na kraju serije, studenti će imati solidno razumijevanje web razvoja. Program podučava osnove JavaScripta, HTML-a i CSS-a, kao i najnovije alate i tehnike koje danas koriste web programeri. Polaznici će imati priliku steći praktično iskustvo izradom igre tipkanja, virtualnog terarija, ekološki prihvatljivog proširenja preglednika, igre u stilu invazije svemira i bankarske aplikacije za tvrtke. Do kraja serije studenti će imati solidno razumijevanje razvoja weba.
> 🎓 Prve lekcije ovog kurikuluma možete pohađati kao [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn! > 🎓 Prve lekcije ovog nastavnog plana možete slijediti kao [Stazu učenja](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
Osiguravanjem usklađenosti sadržaja s projektima proces je zanimljiviji za studente i povećava zadržavanje pojmova. Također smo napisali nekoliko početnih lekcija o osnovama JavaScript-a kako bismo uveli koncepte, uparene s videozapisom iz kolekcije "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", od kojih su neki autori pridonijeli ovom kurikulumu. Osiguravanjem usklađenosti sadržaja s projektima, proces učenja postaje zanimljiviji za učenike i pojačava zadržavanje pojmova. Također smo napisali nekoliko osnovnih lekcija iz JavaScripta za uvođenje pojmova, upareno s videom iz zbirke "[Serija za početnike u: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", od kojih su neki autori doprinijeli ovom nastavnom programu.
Uz to, nizak-rizik kviz prije nastave postavlja namjeru studenta za učenje teme, dok drugi kviz nakon nastave osigurava dodatno zadržavanje. Ovaj je kurikulum dizajniran da bude fleksibilan i zabavan te se može pohađati u cijelosti ili djelomično. Projekti počinju jednostavno, a do kraja 12-tjednog ciklusa postaju sve složeniji. Osim toga, kviz s malim ulozima prije nastave postavlja namjeru učenika prema učenju teme, dok drugi kviz nakon nastave osigurava dodatno zadržavanje znanja. Ovaj kurikulum je dizajniran da bude fleksibilan i zabavan te se može pohađati u cijelosti ili djelomično. Projekti počinju jednostavni i postaju sve složeniji do kraja 12-tjednog ciklusa.
Iako smo namjerno izbjegavali uvođenje JavaScript okvira da bismo se usredotočili na osnovne vještine potrebne kao web programer prije usvajanja okvira, dobar sljedeći korak nakon završetka ovog kurikuluma bio bi naučiti o Node.js kroz drugu kolekciju videozapisa: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". Dok smo namjerno izbjegavali uvođenje JavaScript okvira kako bismo se usredotočili na osnovne vještine potrebne web programeru prije usvajanja okvira, dobar sljedeći korak u završetku ovog kurikuluma bilo bi učenje o Node.js putem druge zbirke videa: "[Serija za početnike u: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Posjetite naše smjernice [Kodeksa ponašanja](CODE_OF_CONDUCT.md) i [Doprinos](CONTRIBUTING.md). Veselimo se vašim konstruktivnim povratnim informacijama! > Posjetite naše smjernice [Kodeksa ponašanja](CODE_OF_CONDUCT.md) i [Doprinošenja](CONTRIBUTING.md). Rado ćemo primiti vaše konstruktivne povratne informacije!
## 🧭 Pristup bez interneta ## 🧭 Offline pristup
Ovu dokumentaciju možete prikazati offline koristeći [Docsify](https://docsify.js.org/#/). Forkajte ovaj repozitorij, [instalirajte Docsify](https://docsify.js.org/#/quickstart) na svoje lokalno računalo, i zatim u korijenskoj mapi ovog repozitorija upišite `docsify serve`. Web stranica će biti poslužena na portu 3000 na vašem localhostu: `localhost:3000`. Ovu dokumentaciju možete pokrenuti offline koristeći [Docsify](https://docsify.js.org/#/). Forkajte ovaj repozitorij, [instalirajte Docsify](https://docsify.js.org/#/quickstart) na svoje lokalno računalo, a zatim u korijenskoj mapi ovog repozitorija unesite `docsify serve`. Web stranica će se poslužiti na portu 3000 na vašem localhostu: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF svih lekcija može se pronaći [ovdje](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). PDF svih lekcija možete pronaći [ovdje](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Ostali Tečajevi ## 🎒 Ostali tečajevi
Naš tim proizvodi i druge tečajeve! Pogledajte: Naš tim izrađuje i druge tečajeve! Pogledajte:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![LangChain4j za početnike](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js za početnike](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain za početnike](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Agenti ### Azure / Edge / MCP / Agents
[![AZD za početnike](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Edge AI za početnike](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP za početnike](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI Agenti za početnike](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) [![AI Agents for Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Serija Generativnog AI ### Serija Generativne AI
[![Generativni AI za početnike](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) [![Generative AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
--- ---
### Osnovno učenje ### Osnovno učenje
[![ML za početnike](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Data Science za početnike](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI za početnike](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Cybersecurity za početnike](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Cybersecurity for Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Web razvoj za početnike](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Web Dev for Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT za početnike](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT for Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![XR razvoj za početnike](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR Development for Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Serija Copilot ### Serija Copilot
[![Copilot za AI uparenog programiranja](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot za C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot Avantura](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Dobivanje pomoći ## Dobivanje pomoći
Ako zapnete ili imate pitanja o izradi AI aplikacija, pridružite se drugim učenicima i iskusnim programerima u raspravama o MCP-u. To je podržavajuća zajednica u kojoj su pitanja dobrodošla, a znanje se slobodno dijeli. Ako zapnete ili imate bilo kakvih pitanja o izradi AI aplikacija, pridružite se kolegama učenicima i iskusnim programerima u raspravama o MCP-u. To je podržavajuća zajednica gdje su pitanja dobrodošla i znanje se slobodno dijeli.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Ako imate povratne informacije o proizvodu ili greške tijekom izrade, posjetite: Ako imate povratne informacije o proizvodu ili primijetite greške tijekom izrade, posjetite:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
## Licenca ## Licenca
Ovaj repozitorij licenciran je pod MIT licencom. Pogledajte datoteku [LICENSE](../../LICENSE) za više informacija. Ovaj repozitorij licenciran je pod MIT licencom. Za više informacija pogledajte datoteku [LICENSE](../../LICENSE).
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Odricanje od odgovornosti**: **Odricanje od odgovornosti**:
Ovaj dokument je preveden pomoću AI prevoditeljskog servisa [Co-op Translator](https://github.com/Azure/co-op-translator). Iako težimo točnosti, imajte na umu da automatski prijevodi mogu sadržavati pogreške ili netočnosti. Izvorni dokument na izvornom jeziku treba smatrati službenim izvorom. Za kritične informacije preporučuje se profesionalni ljudski prijevod. Ne snosimo odgovornost za bilo kakva nesporazuma ili pogrešne interpretacije koje proizlaze iz korištenja ovog prijevoda. Ovaj dokument preveden je pomoću AI usluge za prijevod [Co-op Translator](https://github.com/Azure/co-op-translator). Iako težimo točnosti, imajte na umu da automatski prijevodi mogu sadržavati pogreške ili netočnosti. Izvornik dokumenta na izvornom jeziku treba smatrati autoritativnim izvorom. Za kritične informacije preporučuje se profesionalni ljudski prijevod. Nismo odgovorni za bilo kakva nesporazumevanja ili pogrešne interpretacije koje proizađu iz korištenja ovog prijevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -1,56 +1,79 @@
# [Tema lekcije] # Tema lekcije
![Umetnite video ovdje](../../../lesson-template/video-url) ## 🎥 Video
## [Kviz prije predavanja](../../../lesson-template/quiz-url) > Dodajte ugrađeni video ili poveznicu na lekciju ovdje.
[Opišite što ćemo naučiti] ---
## Kviz prije predavanja
> Dodajte poveznicu na kviz ovdje kada bude dostupan.
---
Dajte kratak pregled onoga što će učenici naučiti u ovoj lekciji.
---
### Uvod ### Uvod
Opišite što će biti obuhvaćeno Dajte kratak uvod koji opisuje što će biti obrađeno u ovoj lekciji.
> Bilješke > Bilješke
---
### Preduvjeti ### Preduvjeti
Koji koraci su trebali biti obuhvaćeni prije ove lekcije? Navedite pojmove ili teme s kojima bi učenici trebali biti upoznati prije početka ove lekcije.
---
### Priprema ### Priprema
Pripremni koraci za početak ove lekcije Navedite korake postavljanja ili alate potrebne prije početka lekcije.
--- ---
[Prođite kroz sadržaj u blokovima] ### Sadržaj
Koračajte kroz sadržaj lekcije u strukturiranim odjeljcima.
---
## [Tema 1] ## Tema 1
### Zadatak: ### Zadatak:
Radite zajedno kako biste postupno unaprijedili svoj kodni repozitorij i izgradili projekt sa zajedničkim kodom: Radite zajedno kako biste postupno unaprijedili svoju bazu koda za izgradnju projekta s dijeljenim kodom:
```html ```html
code blocks code blocks
``` ```
✅ Provjera znanja - iskoristite ovaj trenutak za proširenje znanja učenika otvorenim pitanjima ✅ Provjera znanja
Iskoristite ovaj trenutak za produbljivanje znanja učenika putem otvorenih pitanja.
## [Tema 2] ## Tema 2
## Tema 3
## [Tema 3] 🚀 Izazov
Dodajte suradnički izazov za učenike kako bi unaprijedili projekt.
🚀 Izazov: Dodajte izazov za učenike kako bi surađivali u razredu na unapređenju projekta Opcionalno: Dodajte snimku zaslona sučelja dovršene lekcije ako je prikladno.
Opcionalno: dodajte snimku zaslona korisničkog sučelja dovršene lekcije ako je prikladno ## Kviz nakon predavanja
## [Kviz nakon predavanja](../../../lesson-template/quiz-url) Dodajte poveznicu na kviz ovdje nakon završetka lekcije.
## Pregled i samostalno učenje ## Pregled i samostalno učenje
**Rok za zadatak [MM/GG]**: [Naziv zadatka](assignment.md) **Zadatak do [MM/GG]**: [Naziv zadatka](assignment.md)
--- ---
**Odricanje od odgovornosti**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
Ovaj dokument je preveden pomoću AI usluge za prevođenje [Co-op Translator](https://github.com/Azure/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 ključne informacije preporučuje se profesionalni prijevod od strane ljudskog prevoditelja. Ne preuzimamo odgovornost za bilo kakve nesporazume ili pogrešne interpretacije koje proizlaze iz korištenja ovog prijevoda. **Izjava o odricanju odgovornosti**:
Ovaj dokument je preveden pomoću AI prevoditeljskog servisa [Co-op Translator](https://github.com/Azure/co-op-translator). Iako težimo točnosti, imajte na umu da automatski prijevodi mogu sadržavati pogreške ili netočnosti. Izvorni dokument na izvornom jeziku smatra se službenim i autoritativnim izvorom. Za važne informacije preporučuje se profesionalni ljudski prijevod. Ne snosimo odgovornost za bilo kakva nesporazuma ili kriva tumačenja proizašla iz korištenja ovog prijevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-20T16:23:49+00:00", "translation_date": "2026-04-24T12:19:38+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "sl" "language_code": "sl"
}, },
@ -516,8 +516,8 @@
"language_code": "sl" "language_code": "sl"
}, },
"README.md": { "README.md": {
"original_hash": "b885c87c7544109b78d6684daad6cba6", "original_hash": "b1766b45123e043ef2c72612f28b86dd",
"translation_date": "2026-04-06T16:58:40+00:00", "translation_date": "2026-04-24T12:15:27+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "sl" "language_code": "sl"
}, },
@ -564,8 +564,8 @@
"language_code": "sl" "language_code": "sl"
}, },
"lesson-template/README.md": { "lesson-template/README.md": {
"original_hash": "0494be70ad7fadd13a8c3d549c23e355", "original_hash": "ce2f64fd0d518f0500fc082b97c1e662",
"translation_date": "2025-08-27T22:44:13+00:00", "translation_date": "2026-04-24T12:15:39+00:00",
"source_file": "lesson-template/README.md", "source_file": "lesson-template/README.md",
"language_code": "sl" "language_code": "sl"
}, },

@ -2,46 +2,46 @@
## Pregled projekta ## Pregled projekta
To je učni učni načrt za poučevanje osnov spletnega razvoja za začetnike. Učni načrt je obsežen 12-tedenski tečaj, ki so ga razvili Microsoft Cloud Advocates, in vsebuje 24 praktičnih lekcij o JavaScriptu, CSS in HTML. To je izobraževalni kurikulum repozitorij za poučevanje osnov spletnega razvoja začetnikom. Kurikulum je obsežen 12-tedenski tečaj, razvit s strani Microsoft Cloud Advocates, ki vsebuje 24 praktičnih lekcij, ki zajemajo JavaScript, CSS in HTML.
### Ključne sestavine ### Ključne komponente
- **Izobraževalna vsebina**: 24 strukturiranih lekcij, organiziranih v modulih na osnovi projektov - **Izobraževalna vsebina**: 24 strukturiranih lekcij, organiziranih v modulih, temelječih na projektih
- **Praktični projekti**: Terarij, Tipkovniška igra, Razširitev brskalnika, Vesoljska igra, Bančna aplikacija, Urejevalnik kode in AI klepetalni pomočnik - **Praktični projekti**: Terrarium, igra tipkanja, razširitev brskalnika, igra v vesolju, bančna aplikacija, urejevalnik kode in AI klepetalni pomočnik
- **Interaktivni kvizi**: 48 kvizov s 3 vprašanji vsak (pred in po lekciji) - **Interaktivni kvizi**: 48 kvizov s po 3 vprašanji (pred/po lekciji)
- **Podpora za več jezikov**: Avtomatizirani prevodi za več kot 50 jezikov preko GitHub Actions - **Večjezična podpora**: Samodejni prevodi za več kot 50 jezikov preko GitHub Actions
- **Tehnologije**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (za AI projekte) - **Tehnologije**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (za AI projekte)
### Arhitektura ### Arhitektura
- Učni skladišče z strukturo na osnovi lekcij - Izobraževalni repozitorij z organizacijo po lekcijah
- Vsaka mapa lekcije vsebuje README, primere kode in rešitve - Vsaka mapa lekcije vsebuje README, primeri kode in rešitve
- Samostojni projekti v ločenih imenikih (quiz-app, različni lekcijski projekti) - Samostojni projekti v ločenih imenikih (quiz-app, različni projekti lekcij)
- Sistem za prevajanje z uporabo GitHub Actions (co-op-translator) - Sistem prevajanja z GitHub Actions (co-op-translator)
- Dokumentacija, postrežena preko Docsify in dostopna kot PDF - Dokumentacija strežena preko Docsify in dostopna kot PDF
## Ukazi za nastavitev ## Ukazi za nastavitev
To skladišče je primarno namenjeno za uživanje izobraževalne vsebine. Za delo z določenimi projekti: Ta repozitorij je namenjen predvsem za porabo izobraževalne vsebine. Za delo s specifičnimi projekti:
### Nastavitev glavnega skladišča ### Glavna nastavitev repozitorija
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Nastavitev Quiz App (Vue 3 + Vite) ### Nastavitev Quiz Aplikacije (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Zaženi razvojni strežnik npm run dev # Začni razvojni strežnik
npm run build # Zgradi za produkcijo npm run build # Sestavi za proizvodnjo
npm run lint # Zaženi ESLint npm run lint # Zaženi ESLint
``` ```
### API projekta Banka (Node.js + Express) ### API bančnega projekta (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
@ -51,15 +51,15 @@ npm run lint # Zaženi ESLint
npm run format # Oblikuj s Prettierjem npm run format # Oblikuj s Prettierjem
``` ```
### Projekti razširitev brskalnika ### Projekti razširitve brskalnika
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Upoštevajte navodila za nalaganje razširitev, specifična za brskalnik # Sledite navodilom za nalaganje razširitve, specifičnim za brskalnik
``` ```
### Projekti vesoljske igre ### Projekti igre v vesolju
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
@ -67,7 +67,7 @@ npm install
# Odprite index.html v brskalniku ali uporabite Live Server # Odprite index.html v brskalniku ali uporabite Live Server
``` ```
### Projekt klepeta (Python Backend) ### Klepetalni projekt (Python backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
@ -78,120 +78,120 @@ python api.py
## Razvojni potek dela ## Razvojni potek dela
### Za prispevatele vsebine ### Za prispevne vsebine
1. **Razvezi skladišče (fork)** v svoj GitHub račun 1. **Razveji repozitorij (fork)** na svoj GitHub račun
2. **Kloniraj svoj fork** lokalno 2. **Kloniraj svoj fork** lokalno
3. **Ustvari nov podal (branch)** za svoje spremembe 3. **Ustvari novo vejo** za spremembe
4. Naredi spremembe v vsebini lekcij ali primerih kode 4. Naredi spremembe vsebine lekcije ali primerov kode
5. Testiraj spremembe kode v ustreznih mapah projektov 5. Preizkusi spremembe kode v ustreznih mapah projektov
6. Pošlji pull requeste v skladu z navodili za prispevanje 6. Pošlji pull request po navodilih za prispevke
### Za učence ### Za učence
1. Razvezi ali kloniraj skladišče 1. Razveji ali kloniraj repozitorij
2. Pomakni se zaporedno skozi mape lekcij 2. Pomikaj se po lekcijah zaporedoma
3. Preberi README datoteke za vsako lekcijo 3. Preberi README datoteke za vsako lekcijo
4. Reši predlečnične kvize na https://ff-quizzes.netlify.app/web/ 4. Reši pred-kvizove na https://ff-quizzes.netlify.app/web/
5. Delaj skozi primere kode v mapah lekcij 5. Delo z jeziki primeri v mapah lekcij
6. Dokončaj naloge in izzive 6. Opravi naloge in izzive
7. Reši postlečnične kvize 7. Reši post-kvizove
### Živ razvoj ### Živi razvoj
- **Dokumentacija**: Zaženi `docsify serve` v korenu projekta (port 3000) - **Dokumentacija**: Zaženi `docsify serve` v korenski mapi (port 3000)
- **Quiz App**: Zaženi `npm run dev` v mapi quiz-app - **Quiz App**: Zaženi `npm run dev` v mapi quiz-app
- **Projekti**: Uporabi razširitev VS Code Live Server za HTML projekte - **Projekti**: Uporabi VS Code Live Server razširitev za HTML projekte
- **API projekti**: Zaženi `npm start` v ustreznih API mapah - **API Projekti**: Zaženi `npm start` v ustreznih API mapah
## Navodila za testiranje ## Navodila za testiranje
### Testiranje Quiz App ### Testiranje Quiz Aplikacije
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Preveri težave s slogom kode npm run lint # Preveri težave s slogom kode
npm run build # Preveri, ali je gradnja uspešna npm run build # Preveri, ali je sestavljanje uspešno
``` ```
### Testiranje Bank API ### Testiranje Bank API
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Preveri težave s slogom kode npm run lint # Preverite težave s slogom kode
node server.js # Preveri, ali strežnik zažene brez napak node server.js # Preverite, ali se strežnik zažene brez napak
``` ```
### Splošni pristop k testiranju ### Splošni pristop testiranja
- To je učni repozitorij brez celovitega avtomatskega testiranja - To je izobraževalni repozitorij brez obsežnih avtomatiziranih testov
- Ročno testiranje se osredotoča na: - Ročno testiranje se osredotoča na:
- Primeri kode tečejo brez napak - Primeri kode tečejo brez napak
- Povezave v dokumentaciji delujejo pravilno - Povezave v dokumentaciji delujejo pravilno
- Projekti se uspešno zgradijo - Projekti se uspešno zgradijo
- Primeri sledijo najboljšim praksam - Primeri sledijo najboljšim praksam
### Preverjanje pred oddajo ### Preverjanje pred oddajo
- Zaženi `npm run lint` v mapah z datoteko package.json - Zaženi `npm run lint` v mapah z datoteko package.json
- Preveri veljavnost povezav v markdownu - Preveri, da so povezave v markdownu veljavne
- Testiraj primere kode v brskalniku ali Node.js - Testiraj primere kode v brskalniku ali Node.js
- Preveri, da prevodi ohranjajo pravilno strukturo - Preveri, da prevodi ohranjajo pravilno strukturo
## Smernice za stil kode ## Smernice za stil kode
### JavaScript ### JavaScript
- Uporaba sodobne sintakse ES6+ - Uporabi sodobno ES6+ sintakso
- Sledenje standardnim ESLint konfiguracijam, podanim v projektih - Upoštevaj standardne ESLint konfiguracije v projektih
- Uporaba pomenljivih imen spremenljivk in funkcij za lažje razumevanje - Uporabi smiselna imena spremenljivk in funkcij za jasnost izobraževanja
- Dodajanje komentarjev za pojasnitev konceptov za učence - Dodaj komentarje za razlago konceptov učencem
- Formatiranje z uporabo Prettier kjer je konfigurirano - Formatiraj z orodjem Prettier, kjer je nastavljeno
### HTML/CSS ### HTML/CSS
- Semantični elementi HTML5 - Semantični HTML5 elementi
- Principi odzivnega oblikovanja - Načela odzivnega oblikovanja
- Jasne konvencije poimenovanja razredov - Jasne konvencije imen razredov
- Komentarji, ki pojasnjujejo CSS tehnike za učence - Komentarji za razlago CSS tehnik učencem
### Python ### Python
- Slediti smernicam sloga PEP 8 - Smernice stila PEP 8
- Jasni, izobraževalni primeri kode - Jasni, izobraževalni primeri kode
- Tipiziranje (type hints) kjer je koristno za učenje - Tipne namige, kjer pomagajo pri učenju
### Dokumentacija v Markdownu ### Dokumentacija v Markdownu
- Jasna hierarhija naslovov - Jasna hierarhija naslovov
- Bloki kode z navedbo jezika - Bloki kode z določitvijo jezika
- Povezave do dodatnih virov - Povezave do dodatnih virov
- Posnetki zaslona in slike v mapah `images/` - Posnetki zaslona in slike v mapah `images/`
- Alt besedilo za slike zaradi dostopnosti - Alt besedilo za slike za dostopnost
### Organizacija datotek ### Organizacija datotek
- Lekcije označene zaporedno (1-getting-started-lessons, 2-js-basics itd.) - Lekcije zaporedno številčene (1-getting-started-lessons, 2-js-basics itd.)
- Vsak projekt ima mape `solution/` in pogosto `start/` ali `your-work/` - Vsak projekt ima `solution/` in pogosto tudi `start/` ali `your-work/` mape
- Slike so shranjene v lekcijsko specifičnih mapah `images/` - Slike shranjene v lekcijsko specifičnih mapah `images/`
- Prevodi v strukturi `translations/{jezikovna-koda}/` - Prevodi v strukturi `translations/{language-code}/`
## Sestavljanje in nameščanje ## Gradnja in nameščanje
### Namestitev Quiz App (Azure Static Web Apps) ### Namestitev Quiz Aplikacije (Azure Static Web Apps)
quiz-app je konfiguriran za nameščanje v Azure Static Web Apps: quiz-app je konfiguriran za nameščanje v Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Ustvari mapo dist/ npm run build # Ustvari mapo dist/
# Izvede namestitev prek GitHub Actions poteka ob potisku na main # Izvedba z GitHub Actions potekom dela ob pushu na main
``` ```
Konfiguracija Azure Static Web Apps: Konfiguracija Azure Static Web Apps:
- **Lokacija aplikacije**: `/quiz-app` - **Lokacija aplikacije**: `/quiz-app`
- **Izhodna lokacija**: `dist` - **Izhodna lokacija**: `dist`
- **Delovni tok**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Potek dela**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Generiranje PDF dokumentacije ### Generiranje PDF dokumentacije
@ -204,79 +204,79 @@ npm run convert # Ustvari PDF iz docs
```bash ```bash
npm install -g docsify-cli # Namestite Docsify globalno npm install -g docsify-cli # Namestite Docsify globalno
docsify serve # Strežnik na localhost:3000 docsify serve # Postrezi na localhost:3000
``` ```
### Gradnje specifične za projekte ### Gradnje za posamezne projekte
Vsaka mapa projekta lahko ima lasten postopek gradnje: Vsaka projektna mapa ima lahko svoj postopek gradnje:
- Vue projekti: `npm run build` ustvari produkcijske pakete - Vue projekti: `npm run build` ustvari produkcijske pakete
- Statični projekti: brez koraka gradnje, postreže se datoteke neposredno - Statični projekti: Brez koraka gradnje, neposredno strežemo datoteke
## Smernice za pull requeste ## Smernice za Pull Requeste
### Oblika naslova ### Oblika naslova
Uporabi jasne, opisne naslove, ki označujejo področje spremembe: Uporabi jasne in opisne naslove, ki označujejo področje spremembe:
- `[Quiz-app] Dodaj nov kviz za lekcijo X` - `[Quiz-app] Dodaj nov kviz za lekcijo X`
- `[Lesson-3] Popravi tipkarsko napako v projektu terarij` - `[Lesson-3] Popravi tipkarsko napako v projektu terrarium`
- `[Translation] Dodaj španski prevod za lekcijo 5` - `[Translation] Dodaj španski prevod za lekcijo 5`
- `[Docs] Posodobi navodila za nastavitev` - `[Docs] Posodobi navodila za nastavitev`
### Zahtevani pregledi ### Zahtevani pregledi
Pred oddajo PR: Pred oddajo PR:
1. **Kakovost kode**: 1. **Kakovost kode**:
- Zaženi `npm run lint` v prizadetih projektnih mapah - Zaženi `npm run lint` v prizadetih projektnih mapah
- Odpravi vse napake in opozorila linterja - Odpravi vse napake in opozorila pri lintingu
2. **Preverjanje gradnje**: 2. **Preverjanje gradnje**:
- Zaženi `npm run build` če je potrebno - Zaženi `npm run build`, če je potrebno
- Prepričaj se, da ni napak pri gradnji - Poskrbi, da ni napak pri gradnji
3. **Preverjanje povezav**: 3. **Validacija povezav**:
- Testiraj vse markdown povezave - Preizkusi vse markdown povezave
- Preveri delovanje referenc slik - Preveri delovanje referenc slik
4. **Pregled vsebine**: 4. **Pregled vsebine**:
- Preveri pravopis in slovnico - Preveri pravopis in slovnico
- Zagotovi, da so primeri kode pravilni in poučni - Zagotovi, da so primeri kode pravilni in izobraževalni
- Preveri, da prevodi ohranjajo originalni pomen - Preveri, da prevodi ohranjajo prvotni pomen
### Zahteve za prispevanje ### Zahteve za prispevke
- Strinjanje z Microsoft CLA (avtomatizirana kontrola ob prvem PR) - Strinjanje z Microsoft CLA (avtomatizirana preveritev ob prvem PR)
- Sledenje [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Sledenje [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Glej [CONTRIBUTING.md](./CONTRIBUTING.md) za podrobna navodila - Podrobna pravila so v [CONTRIBUTING.md](./CONTRIBUTING.md)
- Navedi številke issue-ov v opisu PR, če je primerno - V opisu PR navedi številke izdaj, če je relevantno
### Pregledni postopek ### Postopek pregleda
- PR-je pregledajo vzdrževalci in skupnost - PR pregledujejo vzdrževalci in skupnost
- Prioriteta je izobraževalna jasnost - Prioriteta je jasnost izobraževalne vsebine
- Primeri kode sledijo najboljšim trenutnim praksam - Primeri kode morajo slediti trenutnim najboljšim praksam
- Prevodi se pregledajo za natančnost in kulturno ustreznost - Prevodi se pregledajo za točnost in kulturno primernost
## Sistem prevajanja ## Sistem prevajanja
### Avtomatizirani prevod ### Samodejni prevod
- Uporablja GitHub Actions z delovnim tokom co-op-translator - Uporablja GitHub Actions z delovnim tokom co-op-translator
- Samodejno prevaja v več kot 50 jezikov - Samodejno prevaja v več kot 50 jezikov
- Izvorne datoteke so v glavnih direktorijih - Izvorne datoteke v glavnih mapah
- Prevedene datoteke v `translations/{jezikovna-koda}/` - Prevedene datoteke v `translations/{language-code}/` mapah
### Dodajanje ročnih izboljšav prevodov ### Dodajanje ročnih izboljšav prevodov
1. Najdi datoteko v `translations/{jezikovna-koda}/` 1. Poišči datoteko v `translations/{language-code}/`
2. Naredi izboljšave, ob ohranitvi strukture 2. Naredi izboljšave ob ohranitvi strukture
3. Poskrbi, da primeri kode ostanejo funkcionalni 3. Poskrbi, da primeri kode ostanejo funkcionalni
4. Testiraj lokalizirano vsebino kvizov 4. Testiraj vso lokalizirano vsebino kvizov
### Metapodatki prevodov ### Metapodatki prevodov
Prevedene datoteke vključujejo meta glavo: Prevedene datoteke vsebujejo glavo z metapodatki:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -288,121 +288,121 @@ CO_OP_TRANSLATOR_METADATA:
} }
--> -->
``` ```
## Razhroščevanje in odpravljanje težav ## Odpravljanje napak in reševanje težav
### Pogoste težave ### Pogoste težave
**Quiz app ne zažene**: **Quiz app se ne zažene**:
- Preveri verzijo Node.js (priporočena v14+) - Preveri verzijo Node.js (priporočeno v14+)
- Izbriši `node_modules` in `package-lock.json`, ponovno zaženi `npm install` - Izbriši `node_modules` in `package-lock.json`, ponovno zaženi `npm install`
- Preveri morebitne konflikte vrat (privzeto: Vite uporablja port 5173) - Preveri konflikte portov (privzeto: Vite uporablja port 5173)
**API strežnik se ne zažene**: **API strežnik se ne zažene**:
- Preveri verzijo Node.js (node >=10) - Preveri, da je verzija Node.js zadostna (node >=10)
- Preveri, če je port že v uporabi - Preveri, če je port že v uporabi
- Poskrbi, da so vse odvisnosti nameščene z `npm install` - Poskrbi, da so vse odvisnosti nameščene z `npm install`
**Razširitev brskalnika se ne naloži**: **Razširitev brskalnika se ne naloži**:
- Preveri, da je manifest.json pravilno oblikovan - Preveri, da je manifest.json pravilno oblikovan
- Preveri konzolo brskalnika za napake - Preveri napake v konzoli brskalnika
- Sledi navodilom za namestitev specifičnim za brskalnik - Sledi navodilom za nameščanje razširitev za določen brskalnik
**Težave s projektom klepeta v Pythonu**: **Težave s Python klepetalnim projektom**:
- Namesti paket OpenAI: `pip install openai` - Poskrbi, da je paket OpenAI nameščen: `pip install openai`
- Preveri, da je okoljska spremenljivka GITHUB_TOKEN nastavljena - Preveri, da je okoljska spremenljivka GITHUB_TOKEN nastavljena
- Preveri dovoljenja za dostop do GitHub modelov - Preveri dovoljenja za dostop do GitHub modelov
**Docsify ne postreže dokumentacije**: **Docsify ne streže dokumentacije**:
- Namesti docsify-cli globalno: `npm install -g docsify-cli` - Namesti docsify-cli globalno: `npm install -g docsify-cli`
- Zaženi v korenski mapi skladišča - Zaženi iz korenske mape repozitorija
- Preveri obstoj `docs/_sidebar.md` - Preveri, da `docs/_sidebar.md` obstaja
### Nasveti za razvojno okolje ### Nasveti za razvojno okolje
- Uporabljaj VS Code z razširitvijo Live Server za HTML projekte - Uporabi VS Code z Live Server razširitvijo za HTML projekte
- Namesti razširitve ESLint in Prettier za skladno oblikovanje - Namesti ESLint in Prettier razširitve za dosledno oblikovanje
- Uporabljaj DevTools brskalnika za razhroščevanje JavaScript-a - Uporabi brskalniška razvojna orodja za odpravljanje napak v JavaScriptu
- Za Vue projekte namesti Vue DevTools brskalniško razširitev - Za Vue projekte namesti Vue DevTools brskalniško razširitev
### Upoštevanje zmogljivosti ### Premisleki o zmogljivosti
- Veliko število prevedenih datotek (več kot 50 jezikov) pomeni velike polne klone - Veliko število prevedenih datotek (više kot 50 jezikov) pomeni velike kloniranja
- Uporabi plitki klon, če delaš le na vsebini: `git clone --depth 1` - Uporabi plitev klon, če delaš le z vsebino: `git clone --depth 1`
- Izključi prevode iz iskanj, ko delaš na angleški vsebini - Izključi prevode iz iskanj, ko delaš na angleški vsebini
- Procesi gradnje so lahko počasnejši ob prvem zagonu (npm install, Vite build) - Procesi gradnje so lahko počasni ob prvem izvajanju (npm install, Vite build)
## Varnostni vidiki ## Varnostni premisleki
### Okoljske spremenljivke ### Okoljske spremenljivke
- Ključi API ne smejo biti nikoli vključeni v repozitorij - API ključi nikoli ne smejo biti v repozitoriju
- Uporabljaj `.env` datoteke (že vključene v `.gitignore`) - Uporabi `.env` datoteke (že vključene v `.gitignore`)
- Dokumentiraj potrebne okoljske spremenljivke v README-jih projektov - Dokumentiraj zahtevane okoljske spremenljivke v README projektov
### Python projekti ### Python projekti
- Uporabljaj virtualna okolja: `python -m venv venv` - Uporabi virtualna okolja: `python -m venv venv`
- Posodabljaj odvisnosti - Ohrani odvisnosti posodobljene
- GitHub tokeni naj imajo minimalne potrebne pravice - GitHub tokeni naj imajo minimalne potrebne pravice
### Dostop do GitHub modelov ### Dostop do GitHub modelov
- Za GitHub modele so potrebni osebni dostopni tokeni (PAT) - Potrebni so osebni dostopni tokeni (PAT) za GitHub modele
- Tokeni morajo biti shranjeni kot okoljske spremenljivke - Tokeni naj bodo shranjeni kot okoljske spremenljivke
- Tokenov ali poverilnic nikoli ne vključi v repozitorij - Nikoli ne komitiraj tokenov ali poverilnic
## Dodatne opombe ## Dodatne opombe
### Ciljna publika ### Ciljna publika
- Popolni začetniki v spletni razvoj - Popolni začetniki v spletnem razvoju
- Študenti in samouki - Študenti in samouki
- Učitelji, ki uporabljajo učni načrt v razredih - Učitelji, ki uporabljajo kurikulum v učilnicah
- Vsebina je zasnovana za dostopnost in postopno gradnjo veščin - Vsebina je zasnovana za dostopnost in postopno gradnjo veščin
### Izobraževalna filozofija ### Izobraževalna filozofija
- Pristop učenja na osnovi projektov - Pristop učenja preko projektov
- Pogoste preveritve znanja (kvizi) - Pogoste preveritve znanja (kvizi)
- Praktične vaje programiranja - Praktične vaje s kodiranjem
- Primeri uporabe iz realnega sveta - Primeri uporabe v resničnem svetu
- Osredotočenost na osnove pred ogrodji - Osredotočenost na osnove pred ogrodji
### Vzdrževanje skladišča ### Vzdrževanje repozitorija
- Aktivna skupnost učencev in prispevajočih - Aktivna skupnost učencev in prispevnikov
- Redne posodobitve odvisnosti in vsebine - Redne posodobitve odvisnosti in vsebine
- Vzdrževalci nadzorujejo težave in razprave - Izzivi in razprave nadzirani s strani vzdrževalcev
- Prevodi se posodabljajo avtomatsko preko GitHub Actions - Posodobitve prevodov avtomatizirane preko GitHub Actions
### Sorodni viri ### Sorodni viri
- [Moduli Microsoft Learn](https://docs.microsoft.com/learn/) - [Microsoft Learn moduli](https://docs.microsoft.com/learn/)
- [Viri Student Hub](https://docs.microsoft.com/learn/student-hub/) - [Student Hub viri](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) priporočeno za učence - Priporočeno za učence: [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot)
- Dodatni tečaji: Generativna AI, Data Science, ML, IoT učni načrti na voljo - Dodatni tečaji: Generativna AI, podatkovna znanost, ML, IoT kurikuli
### Delo z določenimi projekti ### Delo s specifičnimi projekti
Za podrobna navodila o posameznih projektih glej README datoteke v: Za podrobna navodila glede posameznih projektov glej README datoteke v:
- `quiz-app/README.md` - Vue 3 aplikacija kviza - `quiz-app/README.md` - Vue 3 kviz aplikacija
- `7-bank-project/README.md` - Bančna aplikacija z avtentikacijo - `7-bank-project/README.md` - Bančna aplikacija z avtentikacijo
- `5-browser-extension/README.md` - Razvoj razširitve brskalnika - `5-browser-extension/README.md` - Razvoj razširitve brskalnika
- `6-space-game/README.md` - Razvoj igre na platnu (Canvas) - `6-space-game/README.md` - Razvoj igre na platnu (canvas)
- `9-chat-project/README.md` - Projekt AI klepetalnega pomočnika - `9-chat-project/README.md` - AI klepetalni pomočnik
### Struktura monorepo ### Struktura monorepa
Čeprav ni tradicionalni monorepo, to skladišče vsebuje več samostojnih projektov: Čeprav ni klasični monorepo, ta repozitorij vsebuje več neodvisnih projektov:
- Vsaka lekcija je samostojna - Vsaka lekcija je samostojna
- Projekti ne delijo odvisnosti - Projekti ne delijo odvisnosti
- Delo na posameznih projektih brez vpliva na druge - Delo na posameznih projektih brez vpliva na ostale
- Kloniraj celotno skladišče za celotno učni izkušnjo - Kloniraj celoten repozitorij za celotno kurikulum izkušnjo
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Omejitev odgovornosti**: **Omejitev odgovornosti**:
Ta dokument je bil preveden z uporabo storitve za prevajanje z umetno inteligenco [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za točnost, vas opozarjamo, da avtomatizirani prevodi lahko vsebujejo napake ali netočnosti. Izvirni dokument v njegovem izvirnem jeziku je treba obravnavati kot avtoritativni vir. Za ključne informacije priporočamo strokovni človeški prevod. Nismo odgovorni za morebitna nesporazume ali nepravilne interpretacije, ki izhajajo iz uporabe tega prevoda. Ta dokument je bil preveden z uporabo storitve za AI prevajanje [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za natančnost, prosimo, upoštevajte, da avtomatizirani prevodi lahko vsebujejo napake ali netočnosti. Izvirni dokument v njegovem izvirnem jeziku je treba šteti za avtoritativni vir. Za ključne informacije je priporočljivo uporabiti strokovni človeški prevod. Nismo odgovorni za morebitna nesporazume ali napačne interpretacije, ki izhajajo iz uporabe tega prevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -1,38 +1,21 @@
[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) # Spletni razvoj za začetnike - učni načrt
[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) Naučite se osnov spletnega razvoja s 12-tedenskim podrobnim tečajem, ki ga pripravljajo Microsoft Cloud Advocates. Vsaj ena od 24 lekcij poglobi znanje JavaScripta, CSS in HTML skozi praktične projekte, kot so terariji, razširitve brskalnika in vesoljske igre. Vključite se v kvize, razprave in praktične naloge. Izboljšajte svoje sposobnosti in optimizirajte zadrževanje znanja s pomočjo naše učinkovite projektno usmerjene pedagogike. Začnite svojo kodo danes!
[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) Pridružite se Discord kanalu Azure AI Foundry in spoznajte strokovnjake ter druge razvijalce.
# Spletni razvoj za začetnike učni načrt
Naučite se osnov spletnega razvoja z našim obsežnim 12-tedenskim tečajem, ki ga vodijo Microsoft Cloud Advocates. Vsaka izmed 24 lekcij poglobi znanje JavaScript-a, CSS-a in HTML-a skozi praktične projekte, kot so terariji, razširitve za brskalnike in vesoljske igre. Vključuje kvize, razprave in praktične naloge. Izboljšajte svoje spretnosti in optimizirajte zadrževanje znanja z našo učinkovito pedagoško metodo, ki temelji na projektih. Začnite svojo kodojersko pot še danes!
Pridružite se skupnosti Azure AI Foundry Discord
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Sledite tem korakom, da začnete uporabljati te vire: Sledite tem korakom, da začnete uporabljati te vire:
1. **Razvezi repozitorij**: Kliknite [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Razvejite repozitorij**: Kliknite [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Klonirajte repozitorij**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klonirajte repozitorij**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Pridružite se Discordu Azure AI Foundry in spoznajte strokovnjake ter druge razvijalce**](https://discord.com/invite/ByRwuEEgH4) 3. [**Pridružite se Azure AI Foundry Discord kanalu in spoznajte strokovnjake ter druge razvijalce**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Podpora več jezikov ### 🌐 Podpora za več jezikov
#### Podprto prek GitHub Action (avtomatizirano in vedno posodobljeno) #### Podprto preko GitHub akcije (samodejno in vedno ažurno)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](./README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Raje klonirate lokalno?** > **Raje klonirate lokalno?**
> >
> Ta repozitorij vsebuje več kot 50 prevodov jezikov, kar znatno poveča velikost prenosa. Če želite klonirati brez prevodov, uporabite sparse checkout: > Ta repozitorij vključuje več kot 50 prevodov, kar znatno poveča velikost prenosa. Za kloniranje brez prevodov uporabite sparse checkout:
> >
> **Bash / macOS / Linux:** > **Bash / macOS / Linux:**
> ```bash > ```bash
@ -48,92 +31,78 @@ Sledite tem korakom, da začnete uporabljati te vire:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> Tako boste imeli vse, kar potrebujete za dokončanje tečaja z veliko hitrejšim prenosom. > Tako boste dobili vse, kar potrebujete, da zaključite tečaj, z veliko hitrejšim prenosom.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Če želite, da so podprti dodatni jeziki prevodov, so navedeni [tukaj](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) **Če želite dodatne prevode, so podprti jeziki tu. [tukaj](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
#### 🧑‍🎓 _Si študent?_ #### 🧑‍🎓 _Ste študent?_
Obišči [**stran študentskega središča**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kjer najdeš začetne vire, študentske pakete in celo načine, kako pridobiti brezplačen potrdilni bon. To je stran, ki jo želiš shraniti med zaznamke in jo občasno preverjati, saj mesečno menjamo vsebino. Obiščite [**Student Hub stran**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kjer boste našli vire za začetnike, študentske pakete in celo možnosti za brezplačni certifikatni kupon. To je stran, ki si jo želite shraniti med zaznamke in redno preverjati, saj vsebine mesečno osvežujemo.
### 📣 Napoved nove izzive načinov GitHub Copilot Agenta za dokončanje! ### 📣 Obvestilo - Novi izzivi režima GitHub Copilot Agent za dokončanje!
Dodan je nov izziv, poišči "GitHub Copilot Agent Challenge 🚀" v večini poglavij. To je nov izziv, ki ga moraš dokončati z uporabo GitHub Copilot-a in načina Agent. Če prej nisi uporabljal načina Agent, je ta zmožen ne samo generirati besedilo, ampak tudi ustvarjati in urejati datoteke, izvajati ukaze in več. Dodali smo nov izziv, poiščite "GitHub Copilot Agent Challenge 🚀" v večini poglavij. To je nov izziv, ki ga dokončate z uporabo GitHub Copilot in režima Agent. Če režima Agent še niste uporabljali, zmore ne le generirati besedilo, ampak tudi ustvarjati in urejati datoteke, izvajati ukaze in več.
### 📣 Napoved _nov projekt za gradnjo z generativno AI_ ### 📣 Obvestilo - _Nov projekt za izdelavo z uporabo Generativne AI_
Novi AI Assistant projekt je pravkar dodan, poglej [projekt](./9-chat-project/README.md) Novo projekt AI asistenta je pravkar dodan, poglejte [projekt](./9-chat-project/README.md)
### 📣 Napoved _nov učni načrt_ o generativni AI za JavaScript je pravkar izšel ### 📣 Obvestilo - _Novi učni načrt_ o Generativni AI za JavaScript je pravkar izdan
Ne zamudite naš novi učni načrt o generativni AI! Ne zamudite našega novega učnega načrta o Generativni AI!
Obišči [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), da začneš! Obiščite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) za začetek!
![Background](../../translated_images/sl/background.148a8d43afde5730.webp) Vsaka lekcija vsebuje nalogo za dokončanje, preverjanje znanja in izziv, ki vas vodi pri učenju tem, kot so:
- Uporaba navodil in inženiring navodil
- Lekcije pokrivajo vse od osnov do RAG (retrieval-augmented generation).
- Interakcija z zgodovinskimi osebami preko GenAI in naše spremljevalne aplikacije.
- Zabavno in privlačno pripovedovanje zgodb, kot da potuješ skozi čas!
![character](../../translated_images/sl/character.5c0dd8e067ffd693.webp)
Vsaka lekcija vključuje nalogo za dokončanje, preverjanje znanja in izziv, ki te vodi pri učenju tem kot so:
- Uporaba pozivov in inženiring pozivov
- Generiranje aplikacij za besedilo in slike - Generiranje aplikacij za besedilo in slike
- Aplikacije za iskanje - Iskalne aplikacije
Obišči [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), da začneš!
Obiščite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) in začnite!
## 🌱 Začetek ## 🌱 Začetek
> **Učitelji**, vključili smo [nekaj predlogov](for-teachers.md), kako uporabljati ta učni načrt. Veseli bomo vaših povratnih informacij [v našem forumu za razprave](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Učitelji**, vključili smo [nekaj predlogov](for-teachers.md), kako uporabiti ta učni načrt. Z veseljem sprejemamo vaše povratne informacije [na našem forumu za razprave](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Učenci](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, za vsako lekcijo začnite s predavanjem in kvizom ter nadaljujte z branjem predavanjskega gradiva, izpolnjevanjem različnih aktivnosti in preverjanjem razumevanja s kvizom po predavanju. **[Učenci](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, za vsako lekcijo začnite s predpredavanjsko vajo in sledite gradivu predavanja, opravite različne dejavnosti in preverite svoje razumevanje s po-predavanjsko vajo.
Za izboljšanje učenja se povežite s sovrstniki in skupaj delajte na projektih! Razprave so dobrodošle v našem [diskusijskem forumu](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kjer vam bodo na voljo naši moderatorji za odgovore na vaša vprašanja. Za izboljšanje vaše učne izkušnje se povežite s sovrstniki in skupaj delajte na projektih! Razprave so spodbujene v našem [forumu za razprave](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kjer je naša ekipa moderatorjev na voljo za vaša vprašanja.
Za nadaljnje izobraževanje močno priporočamo raziskovanje [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) za dodatne študijske materiale. Za nadaljnjo izobrazbo priporočamo raziskovanje [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) za dodatne študijske materiale.
### 📋 Namestitev razvojnega okolja ### 📋 Nastavitev vašega okolja
Ta učni načrt že ima pripravljeno razvojno okolje! Ko začnete, se lahko odločite, ali boste učni načrt izvajali v [Codespace](https://github.com/features/codespaces/) (_okolje, ki deluje v brskalniku in ne zahteva namestitev_), ali lokalno na svojem računalniku z urejevalnikom besedila, kot je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Ta učni načrt že vsebuje razvojno okolje! Ko začnete, lahko izberete zagon učnega načrta v [Codespace](https://github.com/features/codespaces/) (_brskalniško okolje brez potrebe po namestitvi_), ali lokalno na svojem računalniku z urejevalnikom besedil, kot je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Ustvarite svoj repozitorij #### Ustvarite svoj repozitorij
Da boste lahko enostavno shranjevali svoje delo, vam priporočamo, da ustvarite svojo kopijo tega repozitorija. To lahko storite tako, da kliknete gumb **Uporabi ta predlogo** na vrhu strani. To bo ustvarilo nov repozitorij v vašem GitHub računu s kopijo učnega načrta. Da boste lahko zlahka shranjevali svoje delo, je priporočljivo, da ustvarite svojo kopijo tega repozitorija. To lahko naredite s klikom na gumb **Use this template** zgoraj na strani. S tem se bo ustvaril nov repozitorij na vašem GitHub računu s kopijo učnega načrta.
Sledite tem korakom: Sledite tem korakom:
1. **Razvezi repozitorij**: Kliknite na gumb "Razvezi" (Fork) zgoraj desno na tej strani. 1. **Razvejite repozitorij**: Kliknite na gumb "Fork" v zgornjem desnem kotu te strani.
2. **Klonirajte repozitorij**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klonirajte repozitorij**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Izvajanje učnega načrta v Codespace #### Zagon učnega načrta v Codespace
V svoji kopiji tega repozitorija, ki ste jo ustvarili, kliknite gumb **Code** in izberite **Open with Codespaces**. To bo ustvarilo nov Codespace za delo. V svoji kopiji tega repozitorija, ki ste jo ustvarili, kliknite na gumb **Code** in izberite **Open with Codespaces**. Tako boste ustvarili nov Codespace, v katerem boste delali.
![Codespace](../../translated_images/sl/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/sl/createcodespace.0238bbf4d7a8d955.webp)
#### Izvajanje učnega načrta lokalno na svojem računalniku #### Zagon učnega načrta lokalno na vašem računalniku
Za izvajanje tega učnega načrta lokalno na svojem računalniku boste potrebovali urejevalnik besedila, brskalnik in orodje ukazne vrstice. Naša prva lekcija, [Uvod v programske jezike in orodja stroke](../../1-getting-started-lessons/1-intro-to-programming-languages), vas bo vodila skozi različne možnosti za vsako od teh orodij, da izberete, kaj vam najbolj ustreza.
Priporočamo uporabo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kot urejevalnika, ki ima tudi vgrajen [terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code lahko prenesete [tukaj](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Za zagon tega učnega načrta lokalno na računalniku boste potrebovali urejevalnik besedil, brskalnik in orodje ukazne vrstice. Naša prva lekcija, [Uvod v programske jezike in orodja](../../1-getting-started-lessons/1-intro-to-programming-languages), vas bo popeljala skozi različne možnosti za vsako od teh orodij, da izberete tisto, kar vam najbolj ustreza.
1. Klonirajte svoj repozitorij na svoj računalnik. To lahko storite tako, da kliknete na gumb **Code** in kopirate URL: Priporočamo uporabo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kot urejevalnika, ki ima tudi vgrajen [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code lahko prenesete [tukaj](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Klonirajte svoj repozitorij na svoj računalnik. To lahko storite s klikom na gumb **Code** in kopiranjem URL-ja:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Nato odprite [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) v [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) in zaženite naslednji ukaz, pri čemer zamenjajte `<your-repository-url>` z URL-jem, ki ste ga pravkar kopirali: Nato odprite [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) znotraj [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) in zaženite naslednji ukaz, pri čemer `<your-repository-url>` zamenjate z URL-jem, ki ste ga pravkar kopirali:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Odprite mapo v Visual Studio Code. To lahko storite tako, da kliknete **File** > **Open Folder** in izberete mapo, ki ste jo pravkar klonirali. 2. Odprite mapo v Visual Studio Code. To lahko storite s klikom na **File** > **Open Folder** in izbiro mape, ki ste jo pravkar klonirali.
> Priporočene razširitve Visual Studio Code: > Priporočene razširitve Visual Studio Code:
@ -143,71 +112,72 @@ Priporočamo uporabo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_i
## 📂 Vsaka lekcija vključuje: ## 📂 Vsaka lekcija vključuje:
- neobvezno skiciranje - neobvezno skicirkno beležko
- neobvezni dodatni video - neobvezni dodatni video
- ogrevalni kviz pred lekcijo - predhodni kviz za ogrevanje pred lekcijo
- pisno lekcijo - pisno lekcijo
- pri lekcijah, temelječih na projektih, vodnike korak za korakom za izdelavo projekta - za projektno usmerjene lekcije, vodnike korak za korakom za izdelavo projekta
- preverjanja znanja - preverjanja znanja
- izziv - izziv
- dodatno branje - dodatno branje
- nalogo - nalogo
- [kviz po lekciji](https://ff-quizzes.netlify.app/web/) - [kviz po lekciji](https://ff-quizzes.netlify.app/web/)
> **Opomba o kvizih**: Vsi kvizi so zbrani v mapi Quiz-app, skupaj 48 kvizov s po tremi vprašanji. Na voljo so [tukaj](https://ff-quizzes.netlify.app/web/), kviz aplikacijo lahko zaženete lokalno ali objavite na Azure; sledite navodilom v mapi `quiz-app`. > **Opomba o kvizih**: Vsi kvizi so shranjeni v mapi Quiz-app, skupaj 48 kvizov s po tremi vprašanji. Na voljo so [tukaj](https://ff-quizzes.netlify.app/web/), kviz aplikacijo je mogoče zagnati lokalno ali jo namestiti na Azure; sledite navodilom v mapi `quiz-app`.
## 🗃️ Lekcije ## 🗃️ Lekcije
| | Ime projekta | Poučeni koncepti | Cilji učenja | Povezana lekcija | Avtor | | | Ime projekta | Proučevani koncepti | Cilji učenja | Povezana lekcija | Avtor |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :------------------------------------------------------: | :------------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------: | :--------------------: |
| 01 | Začetek | Uvod v programiranje in orodja poklica | Naučite se osnov, na katerih temeljijo večina programskih jezikov, in o programski opremi, ki pomaga profesionalnim razvijalcem | [Uvod v programske jezike in orodja poklica](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Začetek | Uvod v programiranje in osnovna orodja | Spoznajte osnovne temelje večine programskih jezikov in programske opreme, ki pomaga profesionalnim razvijalcem opravljati delo | [Uvod v programske jezike in orodja](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Začetek | Osnove GitHub, vključuje delo v ekipi | Kako uporabljati GitHub v svojem projektu, kako sodelovati z drugimi na kodi | [Uvod v GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Začetek | Osnove GitHub-a, delo v skupini | Kako uporabljati GitHub v svojem projektu, kako sodelovati z drugimi na kodi | [Uvod v GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Začetek | Dostopnost | Naučite se osnov spletne dostopnosti | [Osnove dostopnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Začetek | Dostopnost | Naučite se osnov spletne dostopnosti | [Osnove dostopnosti](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Osnove | Tipi podatkov v JavaScript | Osnove tipov podatkov v JavaScript | [Tipi podatkov](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | Osnove JS | Podatkovni tipi v JavaScript | Osnove podatkovnih tipov v JavaScript | [Podatkovni tipi](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Osnove | Funkcije in metode | Naučite se o funkcijah in metodah za upravljanje logike aplikacije | [Funkcije in metode](./2-js-basics/2-functions-methods/README.md) | Jasmine in Christopher | | 05 | Osnove JS | Funkcije in metode | Spoznajte funkcije in metode za upravljanje logike aplikacije | [Funkcije in metode](./2-js-basics/2-functions-methods/README.md) | Jasmine in Christopher |
| 06 | JS Osnove | Sprejemanje odločitev v JS | Naučite se, kako ustvariti pogoje v kodi z uporabo metod odločanja | [Sprejemanje odločitev](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | Osnove JS | Sprejemanje odločitev z JS | Naučite se ustvarjati pogoje v kodi z uporabo metod odločanja | [Sprejemanje odločitev](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Osnove | Tabele in zanke | Delo s podatki z uporabo tabel in zank v JavaScript | [Tabele in zanke](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | Osnove JS | Polja in zanke | Delo s podatki z uporabo polj in zank v JavaScript | [Polja in zanke](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarij](./3-terrarium/solution/README.md) | HTML v praksi | Zgradite HTML za ustvarjanje spletnega terrarija, osredotočite se na izdelavo postavitve | [Uvod v HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML v praksi | Ustvarite HTML za spletni terarij, osredotočite se na izdelavo postavitve | [Uvod v HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarij](./3-terrarium/solution/README.md) | CSS v praksi | Naredite CSS za oblikovanje spletnega terrarija, osredotočite se na osnove CSS in odzivno oblikovanje strani | [Uvod v CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS v praksi | Ustvarite CSS za oblikovanje spletnega terarija, osredotočite se na osnove CSS in odzivnost strani | [Uvod v CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarij](./3-terrarium/solution/README.md) | JavaScript sklope, manipulacija DOM | Naredite JavaScript, da bo terrarij deloval kot vmesnik za povleci/spusti, osredotočite se na sklope in manipulacijo DOM | [JavaScript sklope, manipulacija DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript closures, manipulacija DOM | Izdelajte JavaScript za delovanje terarija z vmesnikom povleci-in-spusti, osredotočeno na closures in manipulacijo DOM | [JavaScript closures, manipulacija DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Igra tipkanja](./4-typing-game/solution/README.md) | Izdelava igre tipkanja | Naučite se uporabljati dogodke tipkovnice za upravljanje logike vaše JavaScript aplikacije | [Dogodkovno usmerjeno programiranje](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Typing Game](./4-typing-game/solution/README.md) | Izdelava igre tipkanja | Naučite se uporabljati dogodke tipkovnice za upravljanje logike vaše JavaScript aplikacije | [Programiranje na podlagi dogodkov](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Zeleni brskalnik dodatek](./5-browser-extension/solution/README.md) | Delo z brskalniki | Naučite se, kako brskalniki delujejo, njihova zgodovina in kako pripraviti prve elemente brskalniškega dodatka | [O brskalnikih](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Zeleni brskalniški vtičnik](./5-browser-extension/solution/README.md) | Delo z brskalniki | Naučite se, kako brskalniki delujejo, njihovo zgodovino in kako pripraviti prvi elemente brskalniškega vtičnika | [O brskalnikih](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Zeleni brskalnik dodatek](./5-browser-extension/solution/README.md) | Izdelava obrazca, klic API-ja in shranjevanje spremenljivk v lokalno shrambo | Naredite JavaScript elemente vašega brskalniškega dodatka za klic API-ja, ki uporablja spremenljivke shranjene v lokalni shrambi | [API-ji, obrazci in lokalna shramba](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Zeleni brskalniški vtičnik](./5-browser-extension/solution/README.md) | Gradnja obrazca, klic API-ja in shranjevanje spremenljivk v lokalno shrambo | Izdelajte JavaScript elemente brskalniškega vtičnika za klic API-ja z uporabo spremenljivk, shranjenih v lokalni shrambi | [API, obrazci in lokalna shramba](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Zeleni brskalnik dodatek](./5-browser-extension/solution/README.md) | Ozadinski procesi v brskalniku, spletna zmogljivost | Uporabite ozadinske procese brskalnika za upravljanje ikone dodatka; spoznajte spletno zmogljivost in nekatere optimizacije | [Ozadna opravila in zmogljivost](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Zeleni brskalniški vtičnik](./5-browser-extension/solution/README.md) | Ozadnji procesi v brskalniku, spletna zmogljivost | Uporabite ozadnje procese brskalnika za upravljanje ikone vtičnika; spoznajte spletno zmogljivost in nekatere optimizacije | [Ozadna opravila in zmogljivost](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Igra vesolja](./6-space-game/solution/README.md) | Naprednejši razvoj iger z JavaScript | Naučite se o dedovanju z uporabo razredov in kompozicije ter o vzorcu Pub/Sub, kot priprava na izdelavo igre | [Uvod v napredni razvoj iger](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Igra v vesolju](./6-space-game/solution/README.md) | Naprednejši razvoj iger z JavaScript | Spoznajte dedovanje z uporabo razredov in sestave ter vzorec Pub/Sub, v pripravah na izdelavo igre | [Uvod v napredni razvoj iger](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Igra vesolja](./6-space-game/solution/README.md) | Risanje na platno | Spoznajte Canvas API, ki se uporablja za risanje elementov na zaslon | [Risanje na platno](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Igra v vesolju](./6-space-game/solution/README.md) | Risanje na platno | Spoznajte Canvas API, ki se uporablja za risanje elementov na zaslon | [Risanje na platno](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Igra vesolja](./6-space-game/solution/README.md) | Premikanje elementov po zaslonu | Spoznajte, kako lahko elementi pridobijo gibanje z uporabo kartiznih koordinat in Canvas API | [Premikanje elementov](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Igra v vesolju](./6-space-game/solution/README.md) | Premikanje elementov po zaslonu | Odkrijte, kako lahko elementi pridobijo gibanje z uporabo kartezičnih koordinat in Canvas API-ja | [Premikanje elementov](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Igra vesolja](./6-space-game/solution/README.md) | Zaznavanje trkov | Poskrbite, da se elementi trkajo in odzivajo drug na drugega s pritiski tipk in dodajte funkcijo za ohlajanje za boljšo zmogljivost igre | [Zaznavanje trkov](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Igra v vesolju](./6-space-game/solution/README.md) | Zaznavanje trkov | Naredite, da elementi trkajo in medsebojno reagirajo z uporabo pritiskov tipk in zagotovite funkcijo ohlajevanja za večjo zmogljivost igre | [Zaznavanje trkov](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Igra vesolja](./6-space-game/solution/README.md) | Vodenje rezultatov | Izvedite matematične izračune na podlagi stanja in zmogljivosti igre | [Vodenje rezultatov](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Igra v vesolju](./6-space-game/solution/README.md) | Beleženje rezultatov | Izvedite matematične izračune glede na stanje in uspešnost igre | [Beleženje rezultatov](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Igra vesolja](./6-space-game/solution/README.md) | Zaključevanje in ponovni zagon igre | Spoznajte, kako zaključiti in znova zagnati igro, vključno s čiščenjem sredstev in ponastavitvijo vrednosti spremenljivk | [Pogoj za zaključek](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Igra v vesolju](./6-space-game/solution/README.md) | Zaključek in ponovni začetek igre | Spoznajte zaključek in ponovni začetek igre, vključno s čiščenjem virov in ponastavitvijo vrednosti spremenljivk | [Pogoj zaključka](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Bančna aplikacija](./7-bank-project/solution/README.md) | HTML predloge in poti v spletni aplikaciji | Naučite se ustvariti osnovno arhitekturo večstranične spletne strani z uporabo poti in HTML predlog | [HTML predloge in poti](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | HTML predloge in poti v spletni aplikaciji | Naučite se ustvariti ogrodje večstranske spletne strani z uporabo usmerjanja in HTML predlog | [HTML predloge in poti](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Bančna aplikacija](./7-bank-project/solution/README.md) | Izdelava prijavnega in registracijskega obrazca | Naučite se izdelovati obrazce in upravljati validacijske rutine | [Obrazci](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Izdelava obrazca za prijavo in registracijo | Spoznajte izdelavo obrazcev in obravnavo validacijskih rutin | [Obrazci](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Bančna aplikacija](./7-bank-project/solution/README.md) | Metode pridobivanja in uporabe podatkov | Kako podatki tečejo v in iz vaše aplikacije, kako jih pridobiti, shraniti in odstraniti | [Podatki](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Metode pridobivanja in uporabe podatkov | Kako podatki tečejo v in iz vaše aplikacije, kako jih pridobiti, shraniti in odstraniti | [Podatki](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Bančna aplikacija](./7-bank-project/solution/README.md) | Koncepti upravljanja stanja | Naučite se, kako vaša aplikacija ohranja stanje in kako ga programsko upravljati | [Upravljanje stanja](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Bankarska aplikacija](./7-bank-project/solution/README.md) | Koncepti upravljanja stanja | Naučite se, kako vaša aplikacija ohranja stanje in kako ga programsko upravljati | [Upravljanje stanja](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Brskalnik/VScode Koda](../../8-code-editor) | Delo z VScode | Naučite se uporabljati urejevalnik kode | [Uporaba VScode urejevalnika kode](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Koda brskalnika/VScode](../../8-code-editor) | Delo z VScode | Naučite se uporabljati urejevalnik kode | [Uporaba urejevalnika VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI asistenti](./9-chat-project/README.md) | Delo z umetno inteligenco | Naučite se izdelati svojega AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris | | 26 | [AI asistenti](./9-chat-project/README.md) | Delo z umetno inteligenco | Naučite se izdelati svojega AI asistenta | [Projekt AI asistenta](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogika ## 🏫 Pedagogika
Naš učni načrt je zasnovan z dvema ključnima pedagoškima načeloma: Naš kurikulum je oblikovan z dvema ključnima pedagoškima načeloma v mislih:
* učenje, usmerjeno v projekte * učenje na podlagi projektov
* pogosti kvizi * pogosti kvizi
Program uči osnove JavaScript, HTML in CSS ter najnovejša orodja in tehnike, ki jih uporabljajo današnji spletni razvijalci. Učenci bodo imeli priložnost pridobiti praktične izkušnje z izdelavo igre tipkanja, virtualnega terrarija, okolju prijaznega brskalniškega dodatka, igre v slogu Space Invaders in bančne aplikacije za podjetja. Ob koncu serije bodo udeleženci pridobili trdno razumevanje spletnega razvoja. Program uči osnove JavaScript, HTML in CSS, pa tudi najnovejša orodja in tehnike, ki jih uporabljajo sodobni spletni razvijalci. Študenti bodo imeli priložnost pridobiti praktične izkušnje z izdelavo igre tipkanja, virtualnega terarija, okolju prijaznega brskalniškega vtičnika, igre v slogu vesoljskih osvajačev in bančne aplikacije za podjetja. Ob koncu serije bodo pridobili trdno razumevanje spletnega razvoja.
> 🎓 Prve lekcije tega kurikuluma lahko opravite kot [učno pot](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
> 🎓 Prve lekcije tega učnega načrta lahko opravite kot [Pot učenja](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn! Z zagotavljanjem usklajenosti vsebine s projekti je proces za študente bolj zanimiv, prav tako se izboljša zadrževanje konceptov. Poleg tega smo napisali več uvodnih lekcij o osnovah JavaScript, ki uvajajo pojme, povezane z videoposnetkom iz zbirke "[Serija za začetnike: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", katere avtorji so prispevali k temu kurikulumu.
S tem, ko vsebina sovpada s projekti, je proces za učence bolj zanimiv in krepi zapomnitev konceptov. Prav tako smo napisali več začetnih lekcij o osnovah JavaScript-a, ki uvajajo koncepte, skupaj z videoposnetkom iz zbirke "[Serija za začetnike: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", katere avtorji so prispevali k temu učnemu načrtu. Poleg tega nizkorizični kviz pred razredom usmerja namen študenta k učenju teme, medtem ko drugi kviz po pouku zagotavlja nadaljnjo zadržnost. Ta kurikulum je zasnovan kot prilagodljiv in zabaven ter ga je mogoče opraviti v celoti ali delno. Projekti se začnejo majhni in postopoma postajajo bolj zapleteni do konca 12-tedenskega cikla.
Poleg tega nizkobetno kviz pred razredom usmeri pozornost študenta na učenje teme, medtem ko drugi kviz po razredu zagotovi dodatno pomnjenje. Ta učni načrt je zasnovan tako, da je prilagodljiv in zabaven, ter ga je mogoče opraviti v celoti ali delno. Projekti so na začetku majhni in postajajo po 12-tedenskem ciklu vse bolj kompleksni. Čeprav smo namerno izpustili uvajanje ogrodij JavaScript, da bi se osredotočili na osnovne veščine, potrebne kot spletni razvijalec pred uporabo ogrodja, je dober naslednji korak po dokončanju tega kurikuluma učenje Node.js preko druge zbirke videoposnetkov: "[Serija za začetnike: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Čeprav smo namerno opustili uvajanje JavaScript okvirov, da se osredotočimo na osnovne spretnosti, potrebne kot spletni razvijalec pred uporabo okvira, bi bil dober naslednji korak za zaključek tega učnega načrta učenje o Node.js preko druge video zbirke: "[Serija za začetnike: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". > Oglejte si naše smernice [Kodeksa ravnanja](CODE_OF_CONDUCT.md) in [Prispevkov](CONTRIBUTING.md). Veselimo se vaših konstruktivnih povratnih informacij!
> Oglejte si naše [Pravila obnašanja](CODE_OF_CONDUCT.md) in [Prispevanje](CONTRIBUTING.md). Veselimo se vaših konstruktivnih povratnih informacij!
## 🧭 Dostop brez povezave ## 🧭 Dostop brez povezave
To dokumentacijo lahko zaženete brez povezave z uporabo [Docsify](https://docsify.js.org/#/). Razvejajte ta repozitorij, [namestite Docsify](https://docsify.js.org/#/quickstart) na svojem lokalnem računalniku, nato pa v korenski mapi tega repozitorija vnesite `docsify serve`. Spletna stran bo dostopna na vratih 3000 na vašem lokalnem računalniku: `localhost:3000`. To dokumentacijo lahko uporabljate brez povezave z uporabo [Docsify](https://docsify.js.org/#/). Razvežite ta repozitorij, [namestite Docsify](https://docsify.js.org/#/quickstart) na svojo lokalno napravo, nato pa v osnovni mapi tega repozitorija vnesite `docsify serve`. Spletna stran bo na voljo na vratih 3000 na vašem lokalnem računalniku: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF vseh lekcij lahko najdete [tukaj](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). PDF vseh lekcij lahko najdete [tukaj](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
@ -215,7 +185,7 @@ PDF vseh lekcij lahko najdete [tukaj](https://microsoft.github.io/Web-Dev-For-Be
## 🎒 Drugi tečaji ## 🎒 Drugi tečaji
Naša ekipa pripravlja še druge tečaje! Oglejte si: Naša ekipa pripravlja tudi druge tečaje! Oglejte si:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
@ -224,56 +194,56 @@ Naša ekipa pripravlja še druge tečaje! Oglejte si:
[![LangChain za začetnike](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain za začetnike](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Agentje ### Azure / Edge / MCP / Agenti
[![AZD za začetnike](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![AZD za začetnike](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Edge AI za začetnike](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI za začetnike](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP za začetnike](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP za začetnike](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI agenti za začetnike](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) [![AI Agent za začetnike](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Generativni AI serija ### Serija Generativna AI
[![Generativni AI za začetnike](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generativna AI za začetnike](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generativna AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) [![Generativna AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[![Generativni AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) [![Generativna AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
--- ---
### Osnovno učenje ### Osnovno učenje
[![ML za začetnike](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![ML za začetnike](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Podatkovna znanost za začetnike](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Podatkovne znanosti za začetnike](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI za začetnike](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI za začetnike](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Kibernetska varnost za začetnike](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Kibernetska varnost za začetnike](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Spletni razvoj za začetnike](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Spletni razvoj za začetnike](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT za začetnike](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT za začetnike](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![Razvoj XR za začetnike](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR razvoj za začetnike](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Copilot serija ### Serija Copilot
[![Copilot za AI programiranje v paru](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot za AI vzporedno programiranje](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot za C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot za C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot avantura](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot avantura](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Iskanje pomoči ## Iskanje pomoči
Če se zataknete ali imate kakršnakoli vprašanja o ustvarjanju AI aplikacij. Pridružite se drugim učencem in izkušenim razvijalcem v razpravah o MCP. To je podpirajoča skupnost, kjer so vprašanja dobrodošla in se znanje prosto deli. Če naletite na težave ali imate vprašanja o ustvarjanju AI aplikacij, se pridružite drugim učencem in izkušenim razvijalcem v razpravah o MCP. To je podpirajoča skupnost, kjer so vprašanja dobrodošla in kjer se znanje prosto deli.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Če imate povratne informacije o izdelku ali napake med ustvarjanjem, obiščite: Če imate povratne informacije o izdelku ali naletite na napake med razvojem, obiščite:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
## Licenca ## Licenca
Ta repozitorij je licenciran pod licenco MIT. Za več informacij glejte datoteko [LICENSE](../../LICENSE). To skladišče je licencirano pod licenco MIT. Za več informacij glejte datoteko [LICENSE](../../LICENSE).
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Omejitev odgovornosti**: **Omejitev odgovornosti**:
Ta dokument je bil preveden z uporabo AI prevajalske storitve [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za natančnost, upoštevajte, da lahko avtomatizirani prevodi vsebujejo napake ali netočnosti. Izvirni dokument v izvirnem jeziku velja za avtoritativni vir. Za kritične informacije priporočamo strokovni človeški prevod. Ne odgovarjamo za morebitne nesporazume ali napačne interpretacije, ki izhajajo iz uporabe tega prevoda. Ta dokument je bil preveden z uporabo AI prevajalske storitve [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za natančnost, upoštevajte, da lahko avtomatizirani prevodi vsebujejo napake ali netočnosti. Izvirni dokument v njegovem izvirnem jeziku je treba obravnavati kot glavni vir. Za ključne informacije priporočamo strokovni človeški prevod. Nismo odgovorni za morebitna nesporazumevanja ali napačne razlage, ki izhajajo iz uporabe tega prevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -1,56 +1,79 @@
# [Tema lekcije] # Tema lekcije
![Vstavi video tukaj](../../../lesson-template/video-url) ## 🎥 Video
## [Pred-predavanje kviz](../../../lesson-template/quiz-url) > Dodajte vgrajeno video ali povezavo do lekcije tukaj.
[Opis, kaj bomo spoznali] ---
## Predpredavalni kviz
> Dodajte povezavo do kviza tukaj, ko bo na voljo.
---
Podajte kratek pregled, kaj se bodo študenti naučili v tej lekciji.
---
### Uvod ### Uvod
Opis, kaj bo zajeto v tej lekciji Podajte kratki uvod, ki opisuje, kaj bo zajeto v tej lekciji.
> Opombe > Opombe
### Predpogoji ---
### Predpogoj
Kateri koraki bi morali biti zaključeni pred to lekcijo? Naštejte pojme ali teme, s katerimi naj bi študenti že bili seznanjeni pred začetkom te lekcije.
---
### Priprava ### Priprava
Pripravljalni koraki za začetek te lekcije Naštejte vse korake nastavitev ali orodja, potrebna pred začetkom lekcije.
--- ---
[Korak za korakom skozi vsebino] ### Vsebina
Korak za korakom predstavite vsebino lekcije v strukturiranih odsekih.
---
## [Tema 1] ## Tema 1
### Naloga: ### Naloga:
Sodelujte pri postopnem izboljševanju svoje kode, da zgradite projekt s skupno kodo: Sodelujte, da postopoma izboljšate svojo kodo in zgradite projekt z deljeno kodo:
```html ```html
code blocks code blocks
``` ```
✅ Preverjanje znanja - izkoristite ta trenutek za razširitev znanja študentov z odprtimi vprašanji ✅ Preverjanje znanja
Izkoristite ta trenutek, da razširite znanje študentov z odprtimi vprašanji.
## [Tema 2] ## Tema 2
## Tema 3
## [Tema 3] 🚀 Izziv
Dodajte skupinski izziv za študente, da izboljšajo projekt.
🚀 Izziv: Dodajte izziv, na katerem študenti sodelujejo v razredu, da izboljšajo projekt Neobvezno: Dodajte posnetek zaslona dokončane uporabniške izkušnje lekcije, če je primerno.
Neobvezno: dodajte posnetek zaslona dokončanega uporabniškega vmesnika lekcije, če je primerno ## Po predavanju kviz
## [Po-predavanje kviz](../../../lesson-template/quiz-url) Dodajte tukaj povezavo do kviza po zaključku lekcije.
## Pregled in samostojno učenje ## Pregled in samostojno učenje
**Rok za oddajo [MM/YY]**: [Ime naloge](assignment.md) **Rok oddaje [MM/LL]**: [Ime naloge](assignment.md)
--- ---
**Omejitev odgovornosti**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
Ta dokument je bil preveden z uporabo storitve za prevajanje z umetno inteligenco [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za natančnost, vas prosimo, da upoštevate, da lahko avtomatizirani prevodi vsebujejo napake ali netočnosti. Izvirni dokument v njegovem maternem jeziku je treba obravnavati kot avtoritativni vir. Za ključne informacije priporočamo profesionalni človeški prevod. Ne prevzemamo odgovornosti za morebitna nesporazumevanja ali napačne razlage, ki bi nastale zaradi uporabe tega prevoda. **Omejitev odgovornosti**:
Ta dokument je bil preveden z uporabo AI prevajalske storitve [Co-op Translator](https://github.com/Azure/co-op-translator). Čeprav si prizadevamo za natančnost, prosimo, upoštevajte, da avtomatizirani prevodi lahko vsebujejo napake ali netočnosti. Izvirni dokument v maternem jeziku je treba šteti kot pooblaščeni vir. Za ključne informacije priporočamo strokovni človeški prevod. Nismo odgovorni za morebitna nesporazume ali napačne interpretacije, ki izhajajo iz uporabe tega prevoda.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-20T16:20:52+00:00", "translation_date": "2026-04-24T12:17:01+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "sr" "language_code": "sr"
}, },
@ -516,8 +516,8 @@
"language_code": "sr" "language_code": "sr"
}, },
"README.md": { "README.md": {
"original_hash": "b885c87c7544109b78d6684daad6cba6", "original_hash": "b1766b45123e043ef2c72612f28b86dd",
"translation_date": "2026-04-06T16:54:36+00:00", "translation_date": "2026-04-24T12:07:58+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "sr" "language_code": "sr"
}, },
@ -564,8 +564,8 @@
"language_code": "sr" "language_code": "sr"
}, },
"lesson-template/README.md": { "lesson-template/README.md": {
"original_hash": "0494be70ad7fadd13a8c3d549c23e355", "original_hash": "ce2f64fd0d518f0500fc082b97c1e662",
"translation_date": "2025-08-28T10:22:46+00:00", "translation_date": "2026-04-24T12:08:10+00:00",
"source_file": "lesson-template/README.md", "source_file": "lesson-template/README.md",
"language_code": "sr" "language_code": "sr"
}, },

@ -2,27 +2,27 @@
## Преглед пројекта ## Преглед пројекта
Ово је репозиторијум едукативног курикулума за подучавање основа веб развоја почетницима. Курикулум је свеобухватан курс у трајању од 12 недеља, развијен од стране Microsoft Cloud Advocates-а, који садржи 24 практичне лекције које обухватају JavaScript, CSS и HTML. Ово је репозиторијум образовног курикулума за подучавање основа веб развоја почетницима. Курикулум је свеобухватан курс од 12 недеља који су развили Microsoft Cloud Advocates, и садржи 24 практична часа покривајући JavaScript, CSS и HTML.
### Кључне компоненте ### Кључне компоненте
- **Едукативни садржај**: 24 структурисане лекције организоване у модуле засноване на пројектима - **Образовни садржај**: 24 структурирана часа организована у модуле засноване на пројектима
- **Практични пројекти**: Терраријум, Игра куцања, Прегледачки екстензија, Свемирска игра, Банкарска апликација, Уређивач кода и AI чат асистент - **Практични пројекти**: Терраријум, Typing Game, Browser Extension, Space Game, Banking App, Code Editor и AI Chat Assistant
- **Интерактивни квизови**: 48 квизова са по 3 питања (пре/после лекције) - **Интерактивни квизови**: 48 квизова са по 3 питања (процена пре и после часа)
- **Подршка за више језика**: Аутоматизовани преводи за више од 50 језика преко GitHub Actions - **Подршка за више језика**: Аутоматски преводи за 50+ језика преко GitHub Actions
- **Технолошки стек**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (за AI пројекте) - **Технологије**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (за AI пројекте)
### Архитектура ### Архитектура
- Едукативни репозиторијум са структуром заснованом на лекцијама - Образовни репозиторијум са структуром базираном на часовима
- Свако говорно место садржи README, примере кода и решења - Свакa фасцикла часа садржи README, примере кода и решења
- Самостални пројекти у посебним директивама (quiz-app, разни пројекти лекција) - Самостални пројекти у засебним фасциклама (quiz-app, различити пројекти часова)
- Систем превођења користећи GitHub Actions (co-op-translator) - Систем превођења користећи GitHub Actions (co-op-translator)
- Документација се сервира преко Docsify и доступна је као PDF - Документација служена преко Docsify-а и доступна као PDF
## Команде за подешавање ## Команде за подешавање
Овај репозиторијум је првенствено намењен за коришћење едукативног садржаја. За рад са одређеним пројектима: Овај репозиторијум је углавном намењен конзумирању образовног садржаја. За рад са специфичним пројектима:
### Главно подешавање репозиторијума ### Главно подешавање репозиторијума
@ -37,29 +37,29 @@ cd Web-Dev-For-Beginners
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Покрени сервер за развој npm run dev # Покрени сервер за развој
npm run build # Изгради за продукцију npm run build # Направи продукциону верзију
npm run lint # Покрени ESLint npm run lint # Покрени ESLint
``` ```
### API за банкарски пројекат (Node.js + Express) ### Bank Project API (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Покрени API сервер npm start # Покрени API сервер
npm run lint # Покрени ESLint npm run lint # Покрени ESLint
npm run format # Форматирај помоћу Prettier-а npm run format # Форматирај са Prettier-ом
``` ```
### Пројекти прегледачких екстензија ### Пројекти Browser Extension-а
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Следите упутства за учитавање екстензија специфичних за прегледач # Пратите упутства за учитавање проширења специфичних за прегледач
``` ```
### Пројекти свемирске игре ### Пројекти Space Game-а
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
@ -67,12 +67,12 @@ npm install
# Отворите index.html у прегледачу или користите Live Server # Отворите index.html у прегледачу или користите Live Server
``` ```
### Чат пројекат (Python backend) ### Chat Project (Python Backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Поставите GITHUB_TOKEN променљиву окружења # Подеси GITHUB_TOKEN променљиву окружења
python api.py python api.py
``` ```
@ -80,29 +80,29 @@ python api.py
### За сараднике на садржају ### За сараднике на садржају
1. **Направите форк репозиторијума** на свој GitHub налог 1. **Форк-ујте репозиторијум** на ваш GitHub налог
2. **Клонирајте свој форк** локално 2. **Клонирајте свој форк** локално
3. **Креирајте нову грану** за ваше измене 3. **Креирајте нову грану** за ваше измене
4. Уредите садржај лекција или примере кода 4. Урадите измене у садржају часова или примерима кода
5. Тестирајте измене кода у одговарајућим проектним директоријумима 5. Тестирајте све измене кода у одговарајућим фасциклама пројеката
6. По савету упућујте pull request-ове према правилима доприноса 6. Пошаљите pull request-ове у складу са смерницама за допринос
### За ученике ### За ученике
1. Форкујте или клонирајте репозиторијум 1. Форкујте или клонирајте репозиторијум
2. Идите кроз директоријуме лекција по редоследу 2. Навигација до фасцикли часова редом
3. Читајте README фајлове за сваку лекцију 3. Читајте README фајлове за сваки час
4. Завршите квизове пре лекције на https://ff-quizzes.netlify.app/web/ 4. Попуните квизове пре часа на https://ff-quizzes.netlify.app/web/
5. Радите на примерима кода у директоријумима лекција 5. Прођите кроз примере кода у фасциклама часова
6. Завршите задатке и изазове 6. Завршите задатке и изазове
7. Полажите квизове после лекције 7. Попуните квизове после часа
### Ливе развој ### Живи развој
- **Документација**: Покрените `docsify serve` у корену (порт 3000) - **Документација**: Покрените `docsify serve` у корену (порт 3000)
- **Quiz App**: Покрените `npm run dev` у директоријуму quiz-app - **Quiz App**: Покрените `npm run dev` у фасцикли quiz-app
- **Пројекти**: Користите VS Code Live Server екстензију за HTML пројекте - **Пројекти**: Користите VS Code Live Server екстензију за HTML пројекте
- **API пројекти**: Покрените `npm start` у одговарајућим API директоријумима - **API пројекти**: Покрените `npm start` у одговарајућим API фасциклама
## Упутства за тестирање ## Упутства за тестирање
@ -110,43 +110,43 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Провери да ли постоје проблеми са стилом кода npm run lint # Проверите проблеме у стилу кода
npm run build # Потврди да ли је изградња успешна npm run build # Потврдити да се изградња успешно завршава
``` ```
### Тестирање Bank API-ја ### Тестирање Bank API-ја
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Проверите проблеме са стилом кода npm run lint # Провери проблеме са стилом кода
node server.js # Проверите да ли сервер почиње без грешака node server.js # Верификуј да сервер стартује без грешака
``` ```
### Општи приступ тестирању ### Општи приступ тестирању
- Ово је едукативни репозиторијум без обимних аутоматизованих тестова - Ово је образовни репозиторијум без комплетних аутоматизованих тестова
- Ручно тестирање се фокусира на: - Ручно тестирање се фокусира на:
- Покретање примера кода без грешки - Примери кода се извршавају без грешака
- Провера исправности линкова у документацији - Везе у документацији раде исправно
- Успешно компајлирање пројеката - Пројекти се успешно граде
- Примери прате најбоље праксе - Примери прате најбоље праксе
### Провере пре слања ### Провере пре слања
- Покрените `npm run lint` у директоријумима са package.json - Покрените `npm run lint` у фасциклама са package.json
- Верификујте да су markdown линкови важећи - Потврдите да су markdown везе валидне
- Тестирајте примере кода у прегледачу или Node.js - Тестирајте примере кода у прегледачу или Node.js
- Проверите да преводи одржавају исправну структуру - Проверите да преводи одржавају правилну структуру
## Смјернице за стил кода ## Смернице за стил кода
### JavaScript ### JavaScript
- Користите савремени ES6+ синтакс - Користите модерни ES6+ синтакс
- Пратите ESLint конфигурације које су укључене у пројекте - Пратите стандардне ESLint конфигурације у пројектима
- Користите смислене називе варијабли и функција ради едукативне јасноће - Коришћење смислених имена променљивих и функција за образовну јасноћу
- Додајте коментаре који објашњавају концепте ученицима - Додајте коментаре који објашњавају концепте за ученике
- Форматирајте помоћу Prettier-а где је подешено - Форматирајте користећи Prettier где је конфигурисано
### HTML/CSS ### HTML/CSS
@ -157,41 +157,41 @@ node server.js # Проверите да ли сервер почиње бе
### Python ### Python
- Пратите PEP 8 смернице - ПЕП 8 смернице за стил
- Јасни, едукативни пример кода - Јасан, образовни пример кода
- Типске наговештаје где су корисни за учење - Типске наговештаје тамо где помажу учењу
### Markdown документација ### Markdown документација
- Јасна хијерархија заглавља - Јасна хијерархија наслова
- Блокови кода са спецификацијом језика - Блокови кода са навођењем језика
- Линкови ка додатним ресурсима - Везе ка додатним ресурсима
- Снимци екрана и слике у директоријуму `images/` - Снимци екрана и слике у `images/` фасциклама
- Алт текст за слике ради приступачности - Alt текст за слике ради приступачности
### Организација фајлова ### Организација фајлова
- Лекције нумерисане секвенцијално (1-getting-started-lessons, 2-js-basics, итд.) - Часови нумерисани узастопно (1-getting-started-lessons, 2-js-basics, итд.)
- Свaki пројекат има `solution/` и често `start/` или `your-work/` директоријуме - Сваки пројекат има `solution/`, а често и `start/` или `your-work/` фасцикле
- Слике се чувају у директоријумима лекција `images/` - Слике смештене у фасцикле `images/` специфичне за часове
- Преводи у структури `translations/{language-code}/` - Преводи у структури `translations/{language-code}/`
## Састављање и деплојмент ## Градња и деплои
### Деплоент Quiz App-а (Azure Static Web Apps) ### Деплојирање Quiz App-а (Azure Static Web Apps)
quiz-app је конфигурисан за деплоент на Azure Static Web Apps: quiz-app је конфигурисан за деплој на Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Креира фолдер dist/ npm run build # Креира dist/ фолдер
# Деплојује путем GitHub Actions workflow-а приликом пуша на main # Реформира путем GitHub Actions радног тока на push у main
``` ```
Конфигурација Azure Static Web Apps: Конфигурација Azure Static Web Apps:
- **Локација апликације**: `/quiz-app` - **Локација апликације**: `/quiz-app`
- **Локација излаза**: `dist` - **Излазна локација**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Радни ток**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Генерисање PDF документације ### Генерисање PDF документације
@ -204,79 +204,79 @@ npm run convert # Генеришите PDF из докса
```bash ```bash
npm install -g docsify-cli # Инсталирајте Docsify глобално npm install -g docsify-cli # Инсталирајте Docsify глобално
docsify serve # Покрените на localhost:3000 docsify serve # Послужите на localhost:3000
``` ```
### Састављање специфично за пројекат ### Градње по пројектима
Свaki директоријум пројекта може имати свој процес састављања: Свака фасцикла пројекта може имати свој грађевински процес:
- Vue пројекти: `npm run build` креира продукцијске пакете - Vue пројекти: `npm run build` прави production bundle-ове
- Статички пројекти: нема корака састављања, сервирање фајлова директно - Статички пројекти: нема градње, служи се фајлови директно
## Смјернице за pull request-ове ## Смернице за Pull Request-ове
### Формат наслова ### Формат наслова
Користите јасне, описне наслове који указују на област измене: Користите јасне, описне наслове који указују на област измене:
- `[Quiz-app] Додај нови квиз за лекцију X` - `[Quiz-app] Додај нови квиз за час X`
- `[Lesson-3] Поправи правописну грешку у терраријум пројекту` - `[Lesson-3] Исправи типо у терраријум пројекту`
- `[Translation] Додај шпански превод за лекцију 5` - `[Translation] Додај шпански превод за час 5`
- `[Docs] Ажурирај упутства за подешавање` - `[Docs] Ажурирај упутства за подешавање`
### Обавезне провере ### Обавезне провере
Пре слања PR-а: Пре слања PR-а:
1. **Квалитет кода**: 1. **Квалитет кода**:
- Покрените `npm run lint` у погођеним пројектним директоријумима - Покрените `npm run lint` у страним фасциклама пројекта
- Исправите све грешке и упозорења - Исправите све линт грешке и упозорења
2. **Верификација састављања**: 2. **Верификација градње**:
- Покрените `npm run build` ако је примењиво - Покрените `npm run build` ако је потребно
- Уверите се да нема грешки у састављању - Обезбедите да нема грешака при градњи
3. **Провера линкова**: 3. **Валидност линкова**:
- Тестирајте све markdown линкове - Тестирајте све markdown везе
- Проверите да референце гу сликама раде - Потврдите да слике раде исправно
4. **Преглед садржаја**: 4. **Преглед садржаја**:
- Прегледајте правопис и граматику - Коригујте правопис и граматику
- Уверите се да су примери кода исправни и едукативни - Проверите да су примери кода исправни и образовни
- Верификујте да преводи одржавају оригинално значење - Потврдите да преводи задржавају оригинално значење
### Захтеви за допринос ### Захтеви за допринос
- Прихватите Microsoft CLA (аутоматска провера при првом PR-у) - Прихватите Microsoft CLA (аутоматска провера при првом PR-у)
- Пратите [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Пратите [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Погледајте [CONTRIBUTING.md](./CONTRIBUTING.md) за детаљна упутства - Погледајте [CONTRIBUTING.md](./CONTRIBUTING.md) за детаљна упутства
- Наведите бројеве issue-ја у опису PR-а ако је применљиво - Наведите бројеве issue-ова у опису PR-а ако је применљиво
### Процес рецензије ### Процес рецензије
- PR-ове рецензирају одржаваоци и заједница - PR-ове прегледају одржаваоци и заједница
- Приоритет је јасноћа едукације - Приоритет је образовна јасноћа
- Примери кода треба да прате савремене најбоље праксе - Примери кода треба да прате најбоље праксе
- Преводи су рецензирани за тачност и културну прикладност - Преводи се прегледају за тачност и културолошку прикладност
## Систем превођења ## Систем превођења
### Аутоматски превод ### Аутоматски превод
- Користи GitHub Actions са co-op-translator workflow-ом - Користи GitHub Actions са co-op-translator workflow-ом
- Аутоматски преводи на више од 50 језика - Преводи на 50+ језика аутоматски
- Изворни фајлови у главним директоријумима - Изворни фајлови су у главним директоријумима
- Преведени фајлови у директоријумима `translations/{language-code}/` - Преведени фајлови у `translations/{language-code}/` фасциклама
### Додавање ручних побољшања превода ### Додавање ручних побољшања превода
1. Пронађите фајл у `translations/{language-code}/` 1. Пронађите фајл у `translations/{language-code}/`
2. Унесите побољшања уз очување структуре 2. Урадите побољшања уз очување структуре
3. Уверите се да примери кода и даље функционишу 3. Проверите да примери кода остају функционални
4. Тестирајте преведене квиз садржаје 4. Тестирајте било који локализовани квиз садржај
### Мета подаци о преводима ### Мета подаци о преводу
Преведени фајлови садрже мета заглавље: Преведени фајлови садрже заглавље с мета подацима:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -294,115 +294,115 @@ CO_OP_TRANSLATOR_METADATA:
### Чести проблеми ### Чести проблеми
**Quiz app не може да се покрене**: **Quiz app не може да се покрене**:
- Проверите верзију Node.js (рекомандовано v14+) - Проверите верзију Node.js (препоручено v14+)
- Обришите `node_modules` и `package-lock.json`, па покрените `npm install` поново - Обришите `node_modules` и `package-lock.json`, па покрените `npm install` поново
- Проверите да нема сукоба портова (подразумевано: Vite користи порт 5173) - Проверите да ли порт није заузет (подразумевано: Vite користи порт 5173)
**API сервер не покреће се**: **API сервер не почиње**:
- Верификујте да је Node.js верзија >=10 - Проверите да ли је Node.js верзија минимум node >=10
- Проверите да ли је порт већ у употреби - Проверите да ли је порт заузет
- Уверите се да су све зависности инсталиране помоћу `npm install` - Осигурајте да су све зависности инсталиране помоћу `npm install`
**Прегледачки екстензија се не учитава**: **Browser extension се не учитава**:
- Проверите да ли је manifest.json правилно форматиран - Проверите да ли еј manifest.json правилно форматиран
- Погледајте конзолу прегледача због грешака - Прегледајте конзолу прегледача за грешке
- Пратите упутства за инсталацију екстензије специфична за прегледач - Пратите упутства за инсталацију проширења специфична за прегледач
**Проблеми са Python чат пројектом**: **Проблеми са Python chat пројектом**:
- Проверите да је OpenAI пакет инсталиран: `pip install openai` - Осигурајте да је OpenAI пакет инсталиран: `pip install openai`
- Верификујте да је GITHUB_TOKEN подешен као environment варијабла - Проверите да ли је GITHUB_TOKEN постављен као environment var
- Проверите приступе GitHub Models - Провера приступа GitHub Models
**Docsify не служи документацију**: **Docsify не служи документацију**:
- Инсталирајте docsify-cli глобално: `npm install -g docsify-cli` - Инсталирајте docsify-cli глобално: `npm install -g docsify-cli`
- Покрените из кореног директоријума репозиторијума - Покрените из корена репозиторијума
- Проверите да `docs/_sidebar.md` постоји - Проверите да постоји `docs/_sidebar.md`
### Савети за развојно окружење ### Савети за развојно окружење
- Користите VS Code са Live Server екстензијом за HTML пројекте - Користите VS Code са Live Server екстензијом за HTML пројекте
- Инсталирајте ESLint и Prettier екстензије за доследно форматирање - Инсталирајте ESLint и Prettier екстензије за доследно форматирање
- Користите прегледачке DevTools за дебаговање JavaScript-а - Користите DevTools у прегледачу за дебаговање JavaScript-а
- За Vue пројекте, инсталирајте Vue DevTools прегледачку екстензију - За Vue пројекте, инсталирајте Vue DevTools екстензију прегледача
### Разматрања перформанси ### Разматрања о перформансама
- Велики број преведених фајлова (више од 50 језика) значи да су пун клонирања велики - Велики број преведених фајлова (50+ језика) значи да су клонирања велика
- Користите shallow clone ако радите само на садржају: `git clone --depth 1` - Користите shallow clone ако радите само на садржају: `git clone --depth 1`
- Искључите преводе из претрага када радите на енглеском садржају - Искључите претрагу по преводима када радите на енглеском садржају
- Процеси састављања могу бити спори при првом покретању (npm install, Vite build) - Процеси градње могу бити спори при првом покретању (npm install, Vite build)
## Безбедносне напомене ## Безбедносна разматрања
### Environment варијабле ### Променљиве окружења
- API кључеви никада не смеју бити пуштени у репозиторијум - API кључеви никад не смеју бити комитовани у репозиторијум
- Користите `.env` фајлове (већ имају `.gitignore`) - Користите `.env` фајлове (већ у `.gitignore`)
- Документујте потребне environment варијабле у README-јима пројеката - Документујте потребне променљиве окружења у README-има пројеката
### Python пројекти ### Python пројекти
- Користите virtual окружје: `python -m venv venv` - Користите виртуелна окружења: `python -m venv venv`
- Одржавајте зависности ажурним - Одржавајте зависности ажурним
- GitHub токени треба да имају минималне потребне дозволе - GitHub токени треба да имају минималне потребне дозволе
### Приступ GitHub Models ### Приступ GitHub Models
- Потребни су Personal Access Tokens (PAT) - Personal Access Tokens (PAT) су потребни за GitHub Models
- Токени треба да се чувају као environment варијабле - Токени треба да буду чувани као environment variables
- Никада не пуштајте токене или акредитиве у репозиторијум - Нико не сме да комитује токене или акредитиве
## Додатне напомене ## Додатне напомене
### Циљна публика ### Циљна публика
- Потпуни почетници у веб развоју - Потпуни почетници у веб развоју
- Студенти и самоуки - Студенти и самоуки учесници
- Наставници који користе курикулум у учионицама - Наставници који користе курикулум у учионицама
- Садржај је дизајниран за приступачност и постепено грађење вештина - Садржај је дизајниран за приступачност и постепен развој вештина
### Едукативна филозофија ### Образовна филозофија
- Приступ учењу заснован на пројектима - Приступ заснован на пројектима
- Честа провера знања (квизови) - Честа провера знања (квизови)
- Практичне вежбе кодирања - Практичне вежбе кодирања
- Примери из стварног света - Примери примене у реалном свету
- Фокус на основе пре framework-a - Фокус на основе пре оквира
### Одржавање репозиторијума ### Одржавање репозиторијума
- Активна заједница ученика и сарадника - Активна заједница ученика и сарадника
- Редовна ажурирања зависности и садржаја - Редовна ажурирања зависности и садржаја
- Пратите проблеме и дискусије од стране одржавалаца - Праћење issue-ова и дискусија од стране одржаваоца
- Аутоматско ажурирање превода преко GitHub Actions - Аутоматизована ажурирања превода преко GitHub Actions
### Повезани ресурси ### Повезани ресурси
- [Microsoft Learn модули](https://docs.microsoft.com/learn/) - [Microsoft Learn модули](https://docs.microsoft.com/learn/)
- [Student Hub ресурси](https://docs.microsoft.com/learn/student-hub/) - [Student Hub ресурси](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) препоручен за ученике - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) препоручен за ученике
- Додатни курсови: Генеративни AI, Наука о подацима, ML, IoT курикулуми - Додатни курсеви: Generative AI, Data Science, ML, IoT курикулуми доступни
### Рад са појединачним пројектима ### Рад са одређеним пројектима
За детаљна упутства о појединачним пројектима погледајте README фајлове у: За детаљна упутства о појединачним пројектима, погледајте README фајлове у:
- `quiz-app/README.md` - Vue 3 квиз апликација - `quiz-app/README.md` - Vue 3 quiz апликација
- `7-bank-project/README.md` - Банкарска апликација са аутентификацијом - `7-bank-project/README.md` - Банкарска апликација са аутентикацијом
- `5-browser-extension/README.md` - Развој прегледачких екстензија - `5-browser-extension/README.md` - Развој browser extension-а
- `6-space-game/README.md` - Canvas заснована игра - `6-space-game/README.md` - Развој игре базиране на Canvas-у
- `9-chat-project/README.md` - AI асистент за ћаскање - `9-chat-project/README.md` - AI chat асистент пројекат
### Структура монорепозиторијума ### Монорепо структура
Иако није традиционални монорепозиторијум, овај репозиторијум садржи више независних пројеката: Иако није традиционални монорепо, овај репозиторијум садржи више независних пројеката:
- Свaka лекција је самостална - Свaki час је самосталан
- Пројекти не деле зависности - Пројекти не деле зависности
- Радите на појединачним пројектима без утицаја на остале - Радите на појединачним пројектима без утицаја на друге
- Клонирајте цео репозиторијум за пуну курикулумску комплетност - Клонирајте цео репозиторијум за пун курс курикулума
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Одрицање од одговорности**: **Ограничење одговорности**:
Овај документ је преведен коришћењем услуге за машински превод [Co-op Translator](https://github.com/Azure/co-op-translator). Иако се трудимо да превод буде прецизан, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Оригинални документ на његовом изворном језику треба сматрати ауторитетом. За критичне информације препоручује се професионални превод који изводи стручни преводилац. Нисмо одговорни за било какве неспоразуме или погрешне тумачења која могу настати коришћењем овог превода. Овај документ је преведен помоћу AI преводилачке услуге [Co-op Translator](https://github.com/Azure/co-op-translator). Иако тежимо тачности, имајте у виду да аутоматски преводи могу садржати грешке или неточности. Оригинални документ на његовом изворном језику треба сматрати ауторитативним извором. За критичне информације препоручује се професионални, људски превод. Нисмо одговорни за било какве неспоразуме или неправилна тумачења настала коришћењем овог превода.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -10,27 +10,27 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Веб развој за почетнике - Наставни програм # Веб развој за почетнике - Наставни план
Научите основе веб развоја уз наш свеобухватни курс од 12 недеља који воде Microsoft Cloud Advocates. Сваких 24 лекције дубоко улази у JavaScript, CSS и HTML кроз пројекте попут тераријума, проширења за прегледаче и свемирских игара. Учествујте у квизовима, дискусијама и практичним задацима. Унапредите своје вештине и оптимизујте задржавање знања уз нашу ефикасну педагогју засновану на пројектима. Започните своје кодирање већ данас! Научите основе веб развоја уз наш свеобухватни курс од 12 недеља који воде Microsoft Cloud Advocates. Свакa од 24 лекције дубоко истражује JavaScript, CSS и HTML кроз практичне пројекте као што су тераријуми, проширења прегледача и свемирске игре. Укључите се кроз квизове, дискусије и практичне задатке. Унапредите своје вештине и оптимизујте задржавање знања ефективном педагогијом заснованом на пројектима. Започните своје кодерско путовање данас!
Придружите се Azure AI Foundry Discord заједници Придружите се Azure AI Foundry Discord-у и упознајте стручњаке и друге програмере.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Пратите ове кораке да бисте започели коришћење ових ресурса: Пратите ове кораке да бисте почели да користите ове ресурсе:
1. **Форкујте репозиторијум**: Кликните [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Форкујте Репозиторијум**: Кликните [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Клонирајте репозиторијум**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Клонирајте Репозиторијум**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Придружите се Azure AI Foundry Discord-у и упознајте стручњаке и колеге програмере**](https://discord.com/invite/ByRwuEEgH4) 3. [**Придружите се Azure AI Foundry Discord и упознајте стручњаке и друге програмере**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Подршка за више језика ### 🌐 Подршка за више језика
#### Подржано преко GitHub Action (аутоматски и увек ажурирано) #### Подржано преко GitHub Action-а (Аутоматизовано и увек ажурирано)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](./README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](./README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Претпочитате да клонирате локално?** > **Више волите да копирате локално?**
> >
> Овај репозиторијум укључује преко 50 превода што значајно повећава величину преузимања. Да бисте клонирали без превода користите sparse checkout: > Овај репозиторијум укључује преко 50 превода што значајно повећава величину преузимања. Да бисте клонирали без превода користите sparse checkout:
> >
@ -48,233 +48,233 @@
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> Ово вам даје све што вам треба да завршите курс са знатно бржим преузимањем. > Ово Вам даје све што Вам је потребно за завршетак курса са много бржим преузимањем.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Ако желите да буду подржани додатни језици превода, они су наведени [овде](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Уколико желите додатне преводе, подржани језици су наведени овде. [овде](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Да ли сте студент?_ #### 🧑‍🎓 _Да ли сте студент?_
Посетите [**Student Hub страницу**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) где ћете наћи ресурсе за почетнике, Student пакете па чак и начине да добијете бесплатан сертификат. Ово је страница коју треба да обележите и са времена на време проверите како бисте пратити новине јер месечно мењамо садржај. Посетите [**Student Hub страницу**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) где ћете пронаћи ресурсе за почетнике, студентске пакете па чак и начине да добијете бесплатан ваучер за сертификат. Ово је страница коју желите да означите и повремено проверите јер ми месечно мењамо садржај.
### 📣 Објава Нови изазови у GitHub Copilot Agent режиму! ### 📣 Објава - НОВИ изазови за GitHub Copilot Agent мод за завршавање!
Додат је нови изазов, потражите "GitHub Copilot Agent Challenge 🚀" у већини поглавља. То је нови изазов који треба да завршите користећи GitHub Copilot и Agent режим. Ако раније нисте користили Agent режим, он није способан само да генерише текст, већ и да креира и уређује фајлове, извршава команде и још много тога. Додат је нови изазов, потражите "GitHub Copilot Agent Challenge 🚀" у већини поглавља. То је нови изазов који треба да завршите користећи GitHub Copilot и Agent режим. Ако раније нисте користили Agent режим, он није само за генерисање текста већ може и креирати и уређивати датотеке, извршавати команде и још много тога.
### 📣 Објава _Нови пројекат за израду користећи Генеративну вештачку интелигенцију_ ### 📣 Објава - _Нови пројекат за прављење користећи Генеративни AI_
Нови AI Assistant пројекат је управо додат, погледајте [проект](./9-chat-project/README.md) Нови пројекат AI асистента је управо додат, погледајте [пројекат](./9-chat-project/README.md)
### 📣 Објава _Нови наставни програм_ о Генеративној AI за JavaScript је управо објављен ### 📣 Објава - _Нови наставни план_ за Генеративни AI за JavaScript је управо објављен
Не пропустите наш нови наставни програм о Генеративној AI! Не пропустите наш нови курс за Генеративни AI!
Посетите [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) да почнете! Посетите [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) да бисте почели!
![Background](../../translated_images/sr/background.148a8d43afde5730.webp) ![Background](../../translated_images/sr/background.148a8d43afde5730.webp)
- Лекције обухватају све од основа до RAG-а. - Лекције које покривају све од основа до RAG-а.
- Интеракција са историјским ликовима користећи GenAI и нашу пратећу апликацију. - Играјте са историјским ликовима користећи GenAI и нашу пратњу апликацију.
- Забавна и занимљива прича, путоваћете кроз време! - Забаван и занимљив наратив, путоваћете кроз време!
![character](../../translated_images/sr/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/sr/character.5c0dd8e067ffd693.webp)
Свака лекција укључује задатак за завршетак, проверу знања и изазов који вас води у учењу тема као што су: Свака лекција укључује задатак за завршетак, проверу знања и изазов који вас води кроз теме као што су:
- Креирање упита и инжењеринг упита - Формулисање упита и инжењеринг упита
- Генерисање апликација за текст и слике - Генерисање апликација за текст и слике
- Апликације за претрагу - Претрага апликација
Посетите [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) да започнете! Посетите [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) да бисте почели!
## 🌱 Почетак рада ## 🌱 Како почети
> **Наставници**, укључили смо [неке предлоге](for-teachers.md) о томе како да користите овај наставни програм. Волео би да добијемо ваше повратне информације [на нашем форуму за дискусију](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Наставници**, укључили смо [неке предлоге](for-teachers.md) о томе како користити овај наставни план. Волео/ла бих да добијемо ваше повратне информације [на нашем форуму за дискусије](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Ученици](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, за сваку лекцију, започните квизом пре предавања и наставите читањем материјала, обављањем различитих активности и проверите разумевање након предавања уз пост-лекцијски квиз. **[Ученици](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, за сваку лекцију започните са квизом пре предавања и наставите читањем материјала, извођењем различитих активности и проверавањем разумевања кроз квиз након предавања.
Да бисте побољшали своје искуство учења, повежите се са вршњацима и радите на пројектима заједно! Подстицајемо дискусију у нашем [форуму за дискусију](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) где ће наш тим модератора бити доступан да одговори на ваша питања. Да бисте побољшали своје учење, повежите се са својим вршњацима да радите на пројектима заједно! Дискусије су охрабрене у нашем [форуму за дискусије](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) где ће тим модератора бити доступан да одговори на ваша питања.
Да бисте додатно унапредили своје образовање, препоручујемо вам да истражите [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) за додатне студијске материјале. Да бисте даље усавршавали образовање, топло препоручујемо да истражите [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) за додатни материјал за учење.
### 📋 Постављање окружења ### 📋 Подешавање вашег окружења
Овај наставни програм има спремно окружење за развој! Када почнете, можете да изаберете да покренете наставни програм у [Codespace-у](https://github.com/features/codespaces/) (_окружење засновано на претраживачу без потребе за инсталацијом_) или локално на свом рачунару користећи уређивач текста као што је [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Овај наставни план има спремно развојно окружење! Када почнете, можете изабрати да курс покренете у [Codespace-у](https://github.com/features/codespaces/) (_окружење које ради у прегледачу без потребе за инсталацијом_), или локално на вашем рачунару користећи уређивач текста као што је [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Креирајте свој репозиторијум #### Креирајте свој репозиторијум
Да бисте лако сачували свој рад, препоручује се да направите своју копију овог репозиторијума. То можете урадити кликом на дугме **Use this template** на врху странице. То ће направити нови репозиторијум у вашем GitHub налогу са копијом наставног програма. Да бисте лакше сачували свој рад, препоручује се да направите своју копију овог репозиторијума. То можете урадити кликом на дугме **Use this template** на врху странице. Ово ће креирати нови репозиторијум на вашем GitHub налогу са копијом наставног плана.
Пратите ове кораке: Пратите ове кораке:
1. **Форкујте репозиторијум**: Кликните на дугме "Fork" у горњем десном углу ове странице. 1. **Форк репозиторијум**: Кликните на дугме "Fork" у горњем десном углу ове странице.
2. **Клонирајте репозиторијум**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Клонирајте репозиторијум**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Покретање наставног програма у Codespace-у #### Покретање наставног плана у Codespace-у
У својој копији овог репозиторијума коју сте направили, кликните на дугме **Code** и изаберите **Open with Codespaces**. То ће створити нови Codespace за рад. У својој копији овог репозиторијума коју сте направили, кликните на дугме **Code** и изаберите **Open with Codespaces**. Ово ће вам креирати нови Codespace за рад.
![Codespace](../../translated_images/sr/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/sr/createcodespace.0238bbf4d7a8d955.webp)
#### Покретање наставног програма локално на рачунару #### Локално покретање наставног плана на вашем рачунару
Да бисте покренули овај наставни програм локално на рачунару, потребан вам је уређивач текста, прегледач и алатка командне линије. Наша прва лекција, [Увод у програмске језике и алате заната](../../1-getting-started-lessons/1-intro-to-programming-languages), водиће вас кроз различите опције за сваки од ових алата како бисте изабрали оно што вам највише одговара. Да бисте локално покренули овај курс на вашем рачунару, биће вам потребан уређивач текста, прегледач и командна линија. Наша прва лекција, [Увод у програмске језике и алате](../../1-getting-started-lessons/1-intro-to-programming-languages), биће вам водич кроз различите опције за сваки од ових алата да изаберете оно што вам највише одговара.
Наш предлог је да користите [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) као свој уређивач, који такође има уграђени [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code можете преузети [овде](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Препоручујемо коришћење [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) као вашег уређивача, који уједно има уграђени [Терминал](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code можете преузети [овде](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Клонирајте свој репозиторијум на рачунар. То можете учинити кликом на дугме **Code** и копирањем URL-а: 1. Клонирајте свој репозиторијум на рачунар. То можете урадити кликом на дугме **Code** и копирањем URL-а:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Затим, отворите [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) унутар [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) и покрените следећу команду, замењујући `<your-repository-url>` URL-ом који сте управо копирали: Затим, отворите [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) унутар [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) и покрените следећу команду, замењујући `<your-repository-url>` са URL-ом који сте управо копирали:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Отворите фасциклу у Visual Studio Code-у. То можете учинити кликом на **File** > **Open Folder** и одабиром фасцикле коју сте управо клонирали. 2. Отворите фасциклу у Visual Studio Code-у. То можете урадити кликом на **File** > **Open Folder** и одабиром фасцикле коју сте управо клонирали.
> Препоручене Visual Studio Code екстензије: > Препоручени Visual Studio Code додаци:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - за преглед HTML страница унутар Visual Studio Code-а > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - за преглед HTML страница унутар Visual Studio Code-а
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - за брже писање кода > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - за помоћ у бржем писању кода
## 📂 Свaка лекција укључује: ## 📂 Свака лекција укључује:
- опционалну скетчноту - опциони оловкрис
- опционални додатни видео - опциони додатни видео
- квиз за загревање пре лекције - припремни квиз пре лекције
- писану лекцију - писану лекцију
- за пројектно оријентисане лекције, корак-по-корак упутства како направити пројекат - за лекције засноване на пројектима, корак-по-корак приручнике како изградити пројекат
- провере знања - провере знања
- изазов - изазов
- додатно читање - додатно читање
- задатак - задатак
- [квиз након лекције](https://ff-quizzes.netlify.app/web/) - [квиз након лекције](https://ff-quizzes.netlify.app/web/)
> **Напомена о квизовима**: Сви квизови се налазе у фасцикли Quiz-app, укупно 48 квизова са по три питања сваки. Доступни су [овде](https://ff-quizzes.netlify.app/web/), апликација за квизове може се покренути локално или објавити на Azure; следите упутства у `quiz-app` фасцикли. > **Напомена о квизовима**: Сви квизови се налазе у Quiz-app фасцикли, укупно 48 квизова са по три питања. Доступни су [овде](https://ff-quizzes.netlify.app/web/), апликацију за квизове можете покренути локално или је објавити на Azure; следите упутства у `quiz-app` фасцикли.
## 🗃️ Лекције ## 🗃️ Лекције
| | Назив пројекта | Концепти који се уче | Циљеви учења | Повезана лекција | Аутор | | | Назив пројекта | Концепти који се уче | Циљеви учења | Повезана лекција | Аутор |
| :-: | :--------------------------------------------------------: | :---------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------: | :--------------------: | | :-: | :--------------------------------------------------------: | :------------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Почетак рада | Увод у програмирање и алате заната | Научите основне основе иза већине програмских језика и о софтверу који помаже професионалним програмерима у њиховом раду | [Увод у програмске језике и алате](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Јасмин | | 01 | Почетак | Увод у програмирање и алате струке | Научите основне основе које стоје иза већине програмских језика и о софтверу који помаже професионалним програмерима да раде | [Увод у програмске језике и алате струке](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Почетак рада | Основе GitHub-а, укључује рад у тиму | Како користити GitHub у пројекту, како сарађивати са другима на основу кода | [Увод у GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Флор | | 02 | Почетак | Основе GitHub-а, укључујући рад у тиму | Како користити GitHub у свом пројекту, како сарађивати са другима на коду | [Увод у GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Почетак рада | Приступачност | Научите основе веб приступачности | [Основе приступачности](./1-getting-started-lessons/3-accessibility/README.md) | Кристофер | | 03 | Почетак | Приступачност | Научите основе веб приступачности | [Основе приступачности](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Основе | Типови података у JavaScript | Основе типова података у JavaScript | [Типови података](./2-js-basics/1-data-types/README.md) | Јасмин | | 04 | ЈС основе | Типови података у JavaScript-у | Основе типова података у JavaScript-у | [Типови података](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Основе | Функције и методе | Научите о функцијама и методама за управљање логиком апликације | [Функције и методе](./2-js-basics/2-functions-methods/README.md) | Јасмин и Кристофер | | 05 | ЈС основе | Функције и методе | Научите о функцијама и методама које управљају логиком апликације | [Функције и методе](./2-js-basics/2-functions-methods/README.md) | Jasmine и Christopher |
| 06 | JS Основе | Одлучивање у JS | Научите како да користите услове у кодирању користећи методе одлучивања | [Одлучивање](./2-js-basics/3-making-decisions/README.md) | Јасмин | | 06 | ЈС основе | Доношење одлука са JS | Научите како да креирате услове у свом коду користећи методе доношења одлука | [Доношење одлука](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Основе | Низови и петље | Рад са подацима користећи низове и петље у JavaScript | [Низови и петље](./2-js-basics/4-arrays-loops/README.md) | Јасмин | | 07 | ЈС основе | Низови и петље | Рад са подацима користећи низове и петље у JavaScript-у | [Низови и петље](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Тераријум](./3-terrarium/solution/README.md) | HTML у пракси | Направите HTML за онлайн тераријум, фокусирајући се на изградњу распореда | [Увод у HTML](./3-terrarium/1-intro-to-html/README.md) | Џен | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML у пракси | Израдите HTML за креирање онлајн тераријума, фокусирајући се на изградњу распореда | [Увод у HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Тераријум](./3-terrarium/solution/README.md) | CSS у пракси | Направите CSS за стилизовање онлајн тераријума, фокус на основама CSS-а укључујући и прилагођавање странице | [Увод у CSS](./3-terrarium/2-intro-to-css/README.md) | Џен | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS у пракси | Израдите CSS за стилизовање онлајн тераријума, фокусирајући се на основе CSS укључујући прилагођавање странице | [Увод у CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Тераријум](./3-terrarium/solution/README.md) | JavaScript закључци, манипулација DOM-ом | Направите JavaScript који омогућава превлачење тераријума, фокусирајући се на закључке и рад са DOM-ом | [JavaScript закључци, манипулација DOM-ом](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Џен | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript затварања, рад са DOM-ом | Израдите JavaScript за функционисање тераријума као drag/drop интерфејса, са фокусом на затварања и рад са DOM-ом | [JavaScript затварања, рад са DOM-ом](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Направити игру куцања | Научите како да користите догађаје са тастатуре за вођење логике у вашој JavaScript апликацији | [Програмска логика заснована на догађајима](./4-typing-game/typing-game/README.md) | Кристофер | | 11 | [Typing Game](./4-typing-game/solution/README.md) | Креирање игре куцања | Научите како да користите догађаје са тастатуре за управљање логиком JavaScript апликације | [Програмирање вођено догађајима](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Рад са прегледачима | Научите како прегледачи раде, њихову историју и како направити прве елементе проширења прегледача | [О прегледачима](./5-browser-extension/1-about-browsers/README.md) | Џен | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Рад са прегледачима | Научите како прегледачи раде, њихову историју и како направити прве елементе проширења за прегледач | [О прегледачима](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Израда форме, позив API-ја и чување података у локалном складишту | Направите JavaScript елементе вашег проширења за позивање API-ја користећи варијабле у локалном складишту | [API-ји, форме и локално складиште](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Џен | | 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Креирање форме, позивање API-ја и чување променљивих у локалној меморији | Израдите JavaScript елементе проширења прегледача за позивање API-ја користећи променљиве чуване у локалној меморији | [API-ји, форме и локална меморија](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Позадински процеси у прегледачу, веб перформансе | Користите позадинске процесе прегледача за управљање иконицом проширења; научите о оптимизацијама и перформансама веба | [Позадински задаци и перформансе](./5-browser-extension/3-background-tasks-and-performance/README.md) | Џен | | 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Позадински процеси у прегледачу, веб перформансе | Користите позадинске процесе прегледача за управљање иконицом проширења; научите о веб перформансама и оптимизацијама | [Позадински задаци и перформансе](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Напреднија израда игара са JavaScript | Научите о наслеђивању користећи и класе и композицију и Pub/Sub обрасце, као припрему за прављење игре | [Увод у напреднију израду игара](./6-space-game/1-introduction/README.md) | Крис | | 15 | [Space Game](./6-space-game/solution/README.md) | Напреднији развој игара са JavaScript-ом | Научите о наследству користећи класе и композицију и публиковање/поверене образац, за припрему израде игре | [Увод у напредни развој игара](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Цртање на canvas-у | Научите о Canvas API-ју који се користи за цртање елемената на екрану | [Цртање на Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Крис | | 16 | [Space Game](./6-space-game/solution/README.md) | Цртање на canvas-у | Научите о Canvas API-ју, који се користи за цртање елемената на екрану | [Цртање на Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Померање елемената по екрану | Откријте како елементи могу добити кретање коришћењем декартових координата и Canvas API-ја | [Померање елемената](./6-space-game/3-moving-elements-around/README.md) | Крис | | 17 | [Space Game](./6-space-game/solution/README.md) | Премештање елемената око екрана | Откријте како елементи добијају покрет коришћењем декартових координата и Canvas API-ја | [Премештање елемената](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Препознавање судара | Направите да се елементи сударају и реагују једни на друге користећи притиске тастера и обезбедите cooldown функцију за перформансе игре | [Препознавање судара](./6-space-game/4-collision-detection/README.md) | Крис | | 18 | [Space Game](./6-space-game/solution/README.md) | Детекција судара | Учините да се елементи сударају и реагују једни на друге користећи притиске тастера и обезбедите cooldown функцију ради перформанси | [Детекција судара](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Бодовање | Извршите математичке прорачуне на основу статуса и перформанси игре | [Бодовање](./6-space-game/5-keeping-score/README.md) | Крис | | 19 | [Space Game](./6-space-game/solution/README.md) | Вођење резултата | Изведите математичке прорачуне на основу статуса и перформанси игре | [Вођење резултата](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Завршетак и поновно покретање игре | Научите о завршетку и поновном покретању игре, укључујући чишћење ресурса и ресетовање вредности променљивих | [Услов завршетка](./6-space-game/6-end-condition/README.md) | Крис | | 20 | [Space Game](./6-space-game/solution/README.md) | Завршавање и поновно покретање игре | Научите о завршетку и поновном покретању игре, укључујући чишћење ресурса и ресетовање променљивих вредности | [Услов завршетка](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML шаблони и руте у веб апликацији | Научите како направити скелет вишестраначне архитектуре вебсајта коришћењем рутирања и HTML шаблона | [HTML шаблони и руте](./7-bank-project/1-template-route/README.md) | Јохан | | 21 | [Banking App](./7-bank-project/solution/README.md) | HTML шаблони и руте у веб апликацији | Научите како да креирате структуру више страница веб сајта коришћењем рутирања и HTML шаблона | [HTML шаблони и руте](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Израда форме за пријаву и регистрацију | Научите о изградњи форми и руковању валидирањем | [Форми](./7-bank-project/2-forms/README.md) | Јохан | | 22 | [Banking App](./7-bank-project/solution/README.md) | Креирање форме за пријаву и регистрацију | Научите о креирању форми и руковању валидацијом | [Форми](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Методе преузимања и коришћења података | Како подаци улазе и излазе из ваше апликације, како их преузети, чувати и уклонити | [Подаци](./7-bank-project/3-data/README.md) | Јохан | | 23 | [Banking App](./7-bank-project/solution/README.md) | Методе дохватања и коришћења података | Како подаци улазе и излазе из ваше апликације, како их дохватити, чувати и одбацити | [Подаци](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Концепти управљања стањем | Научите како апликација чува стање и како га програмски управљати | [Управљање стањем](./7-bank-project/4-state-management/README.md) | Јохан | | 24 | [Banking App](./7-bank-project/solution/README.md) | Концепти управљања стањем | Научите како ваша апликација задржава стање и како се оно управља програмски | [Управљање стањем](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Рад са Visual Studio Code | Научите како користити уређивач кода | [Коришћење VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Крис | | 25 | [Browser/VScode Code](../../8-code-editor) | Рад са VScode | Научите како да користите едитор кода | [Коришћење VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Рад са вештачком интелигенцијом | Научите како да направите свог AI асистента | [Пројекат AI асистента](./9-chat-project/README.md) | Крис | | 26 | [AI Assistants](./9-chat-project/README.md) | Рад са вештачком интелигенцијом | Научите како да направите свог AI асистента | [Пројекат AI асистента](./9-chat-project/README.md) | Chris |
## 🏫 Педагошка метода ## 🏫 Педагошија
Наш наставни план је дизајниран уз два кључна педагошка принципа: Наш наставни програм је дизајниран са два кључна педагошка принципа на уму:
* учење кроз пројекте * учење засновано на пројектима
* чести квизови * честе провере знања
Програм учи основе JavaScript-а, HTML-а и CSS-а, као и најновије алате и технике које користе данашњи веб програмери. Студенти ће имати прилику да стекну практично искуство кроз прављење игре куцања, виртуелног тераријума, еколошки прихватљивог проширења прегледача, игре у стилу освајача свемира и банковне апликације за послове. На крају серије, студенти ће имати чврсто разумевање веб развоја. Програм учи основе JavaScript-а, HTML-а и CSS-а, као и најновије алате и технике које данашњи веб програмери користе. Студенти ће имати прилику да стекну практично искуство кроз креирање игре куцања, виртуелног тераријума, еколошки прихватљивог проширења прегледача, игре у стилу свемирског нападача и банкарске апликације за пословне кориснике. До краја серије, студенти ће стећи чврсто разумевање веб развоја.
> 🎓 Прве неколико лекција из овог програма можете проћи као [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) на Microsoft Learn! > 🎓 Прве неколико лекција у овом курикулуму можете узети као [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) на Microsoft Learn!
Обезбеђивањем упаривања садржаја са пројектима, процес је занимљивији за студенте и повећава задржавање концепата. Такође смо написали неколико уводних лекција о основама JavaScript-а и пар њих повезали са видео серјом "[Беџинер серија за: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", чији су неки аутори допринели овом курикулуму. Обезбеђујући да садржај буде усклађен са пројектима, процес је за студенте занимљивији, а задржавање појмова ће бити појачано. Такође смо написали неколико уводних лекција о основама JavaScript-а да бисмо представили концепте, у пару са видео записом из колекције видео туторијала "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", од којих су неки аутори допринели овом наставном плану.
Поред тога, ниско-притисни квиз пре часа поставља намјеру студента према учењу теме, док други квиз након часа осигурава даље задржавање. Овај курикулум је дизајниран да буде флексибилан и забаван и може се проћи у целини или делимично. Пројекти почињу мали и постају све комплекснији до краја 12-недељног циклуса. Поред тога, неутежани квиз пре часа поставља студентову намеру за учење теме, док други квиз након часа осигурава даље задржавање. Овај наставни програм је дизајниран да буде флексибилан и забаван и може се пратити целина или делимично. Пројекти почињу једноставни и постају све сложенији током 12-недељног циклуса.
Иако смо намерно избегли увод у JavaScript оквире да бисмо се концентрисали на основне вештине потребне као веб програмер пре прихватања оквира, добар следећи корак у завршетку овог курикулума био би учење о Node.js преко друге серије видеа: "[Беџинер серија за: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". Иако смо намерно избегли увођење JavaScript оквира да бисмо се концентрисали на основне вештине потребне веб програмеру пре усвајања оквира, добар следећи корак након завршетка овог курикулума било би учење о Node.js кроз другу колекцију видео записа: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Посетите наша упутства о [Коду понашања](CODE_OF_CONDUCT.md) и [Прилози](CONTRIBUTING.md). Добродошли су ваши конструктивни коментари! > Посетите наше смернице о [Code of Conduct](CODE_OF_CONDUCT.md) и [Contributing](CONTRIBUTING.md). Добродошла је ваша конструктивна повратна информација!
## 🧭 Оффлине приступ ## 🧭 Приступ ван мреже
Ову документацију можете користити оффлине уз помоћ [Docsify](https://docsify.js.org/#/). Форкујте овај репозиторијум, [инсталирајте Docsify](https://docsify.js.org/#/quickstart) на свом рачунару, а затим у коренском фолдеру репозиторијума укуцајте `docsify serve`. Вебсајт ће бити доступан на порту 3000 локално на вашем рачунару: `localhost:3000`. Ову документацију можете покренути ван мреже користећи [Docsify](https://docsify.js.org/#/). Форкујте овај репозиторијум, [инсталирајте Docsify](https://docsify.js.org/#/quickstart) на свом локалном рачунару, и онда у главној фасцикли овог репозиторијума укуцајте `docsify serve`. Веб сајт ће бити доступан на порту 3000 на вашем localhost-u: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF svih lekcija možete pronaћи [овде](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). PDF svih lekcija možete pronaћи [ovde](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Остали курсеви ## 🎒 Ostali kursevi
Наш тим производи и друге курсеве! Погледајте: Naš tim proizvodi i druge kurseve! Pogledajte:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![LangChain4j за почетнике](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js за почетнике](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain за почетнике](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Агенти ### Azure / Edge / MCP / Agenti
[![AZD за почетнике](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Edge AI за почетнике](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP за почетнике](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI Agenti за почетнике](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) [![AI Agents for Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Серія генеративног АИ ### Serija Generativne AI
[![Генеративни AI за почетнике](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![Генеративни AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[![Генеративни AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[![Генеративни AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) [![Generative AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
--- ---
### Основно учење ### Osnovno učenje
[![ML за почетнике](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[![Наука о подацима за почетнике](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[![AI за почетнике](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Компјутерска безбедност за почетнике](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) [![Cybersecurity for Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Веб развој за почетнике](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) [![Web Dev for Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[![IoT за почетнике](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) [![IoT for Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[![XR развој за почетнике](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) [![XR Development for Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Серія Copilot ### Serija Copilot
[![Copilot за AI парно програмирање](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot за C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Copilot авантура](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Како добити помоћ ## Dobijanje pomoći
Ако запнете или имате питања о прављењу AI апликација. Придружите се другим ученицима и искусним програмерима у дискусијама о MCP. Ово је подржавајућа заједница где су питања добродошла и знање се слободно дели. Ako zapnete ili imate bilo kakva pitanja u vezi pravljenja AI aplikacija. Pridružite se ostalim učenicima i iskusnim programerima u diskusijama o MCP. To je podržavajuća zajednica gde su pitanja dobrodošla, a znanje se slobodno deli.
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Ако имате повратне информације о производу или грешке током развоја посетите: Ako imate povratne informacije o proizvodu ili greške tokom izrade, posetite:
[![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum)
## Лиценца ## Licenca
Овај репозиторијум је лиценциран под MIT лиценцом. Погледајте датотеку [LICENSE](../../LICENSE) за више информација. Ovaj repozitorijum je licenciran pod MIT licencom. Više informacija potražite u [LICENSE](../../LICENSE) fajlu.
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Одрицање од одговорности**: **Одрицање од одговорности**:
Овај документ је преведен помоћу AI сервиса за превођење [Co-op Translator](https://github.com/Azure/co-op-translator). Иако се трудимо да превод буде тачан, имајте у виду да аутоматски преводи могу садржати грешке или нетачности. Оригинални документ на његовом материњем језику треба сматрати ауторитетним извором. За критичне информације препоручује се професионални људски превод. Не сносимо одговорност за било каква неразумевања или погрешне интерпретације настале употребом овог превода. Овај документ је преведен коришћењем AI сервиса за превођење [Co-op Translator](https://github.com/Azure/co-op-translator). Док тежимо тачности, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Изворни документ на његовом оригиналном језику треба сматрати ауторитетним извором. За критичне информације препоручује се стручни људски превод. Нисмо одговорни за било каква неразумевања или погрешне интерпретације које произлазе из коришћења овог превода.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -1,56 +1,79 @@
# [Тема лекције] # Тема лекције
![Убаците видео овде](../../../lesson-template/video-url) ## 🎥 Видео
## [Квиз пре предавања](../../../lesson-template/quiz-url) > Додајте уграђени видео или линк ка лекцији овде.
[Опис онога што ћемо научити] ---
## Пре-лекцијски квиз
> Додајте линк ка квизу овде када буде доступан.
---
Презентујте кратак преглед онога што ће студенти научити на овој лекцији.
---
### Увод ### Увод
Опис онога што ће бити обухваћено Унесите кратак увод који описује шта ће бити покривено у овој лекцији.
> Белешке > Белешке
### Предуслови ---
### Предзнање
Који кораци су требали бити обрађени пре ове лекције? Наведите појмове или теме које студенти треба да већ познају пре почетка ове лекције.
---
### Припрема ### Припрема
Припремни кораци за почетак ове лекције Наведите кораке за припрему или алате потребне пре почетка лекције.
--- ---
[Прођите кроз садржај у блоковима] ### Садржај
Пролазите кроз садржај лекције у структурираним одељцима.
---
## [Тема 1] ## Тема 1
### Задатак: ### Задатак:
Радите заједно на постепеном унапређивању вашег кода како бисте изградили пројекат са заједничким кодом: Заједно радите на постепеном унапређењу вашег кода како бисте направили пројекат са заједничким кодом:
```html ```html
code blocks code blocks
``` ```
✅ Провера знања - искористите овај тренутак да проширите знање студената отвореним питањима ✅ Провера знања
Искористите овај тренутак да проверите знање студената кроз отворена питања.
## [Тема 2] ## Тема 2
## Тема 3
## [Тема 3] 🚀 Изазов
Додајте заједнички изазов за студенте да унапреде пројекат.
🚀 Изазов: Додајте изазов за студенте да раде заједно у настави на унапређивању пројекта Опционо: Додајте снимак екрана готовог корисничког интерфејса ове лекције ако је прикладно.
Опционо: додајте снимак екрана корисничког интерфејса завршене лекције ако је прикладно ## После-лекцијски квиз
## [Квиз после предавања](../../../lesson-template/quiz-url) Додајте линк ка квизу овде након завршетка лекције.
## Преглед и самостално учење ## Ревизија и самосталан рад
**Рок за предају [MM/YY]**: [Назив задатка](assignment.md) **Рок за задатак [MM/YY]**: [Назив задатка](assignment.md)
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Одрицање од одговорности**: **Одрицање од одговорности**:
Овај документ је преведен коришћењем услуге за превођење помоћу вештачке интелигенције [Co-op Translator](https://github.com/Azure/co-op-translator). Иако настојимо да обезбедимо тачност, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Оригинални документ на његовом изворном језику треба сматрати меродавним извором. За критичне информације препоручује се професионални превод од стране људи. Не преузимамо одговорност за било каква погрешна тумачења или неспоразуме који могу настати услед коришћења овог превода. Овај документ је преведен коришћењем АИ сервиса за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Док тежимо прецизности, молимо вас да имате у виду да аутоматизовани преводи могу садржати грешке или нетачности. Изворни документ на његовом изворном језику треба сматрати ауторитетним извором. За критичне информације препоручује се професионални људски превод. Нисмо одговорни за било каква неспоразуме или погрешне тумачења која могу произићи из коришћења овог превода.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
Loading…
Cancel
Save