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

pull/1694/head
localizeflow[bot] 7 months ago
parent 0c889d4beb
commit 58875fd460

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2025-10-11T11:37:15+00:00", "translation_date": "2026-02-06T19:10:18+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "et" "language_code": "et"
}, },
@ -516,11 +516,17 @@
"language_code": "et" "language_code": "et"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T19:29:46+00:00", "translation_date": "2026-02-06T19:03:47+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "et" "language_code": "et"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T19:08:47+00:00",
"source_file": "Roadmap.md",
"language_code": "et"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2025-10-11T11:40:29+00:00", "translation_date": "2025-10-11T11:40:29+00:00",

@ -1,44 +1,44 @@
# AGENTS.md # AGENTS.md
## Projekti Ülevaade ## Projekti ülevaade
See on hariduslik õppekava hoidla, mis on mõeldud veebiarenduse põhialuste õpetamiseks algajatele. Õppekava on Microsoft Cloud Advocates'i poolt välja töötatud 12-nädalane kursus, mis sisaldab 24 praktilist õppetundi JavaScripti, CSS-i ja HTML-i kohta. See on hariduslik õppekava hoidla algajatele veebiarenduse põhialuste õpetamiseks. Õppekava on Microsoft Cloud Advocatesi poolt koostatud põhjalik 12-nädalane kursus, mis sisaldab 24 praktilist õpetust JavaScripti, CSSi ja HTMLi kohta.
### Põhikomponendid ### Põhikomponendid
- **Hariduslik sisu**: 24 struktureeritud õppetundi, mis on organiseeritud projektipõhisteks mooduliteks - **Hariduslik sisu**: 24 struktureeritud õpetust, mis on organiseeritud projekti-põhistesse moodulitesse
- **Praktilised projektid**: Terrarium, Klaviatuurimäng, Brauserilaiendus, Kosmosemäng, Pangarakendus, Koodiredaktor ja AI vestlusassistent - **Praktilised projektid**: Terrarium, Klahvivajutuste mäng, Brauserilaiend, Kosmose mäng, Pangarakendus, Koodiredaktor ja tehisintellekti vestlusassistent
- **Interaktiivsed viktoriinid**: 48 viktoriini, igaühes 3 küsimust (enne/pärast õppetundi hindamised) - **Interaktiivsed viktoriinid**: 48 viktoriini, igaühes 3 küsimust (enne ja pärast õpetust)
- **Mitmekeelne tugi**: Automaatne tõlkimine enam kui 50 keelde GitHub Actionsi kaudu - **Mitmekeelne tugi**: Automaatne tõlge 50+ keelde GitHub Actionsi abil
- **Tehnoloogiad**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI projektide jaoks) - **Tehnoloogiad**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (tehisintellekti projektide jaoks)
### Arhitektuur ### Arhitektuur
- Hariduslik hoidla õppetundide põhise struktuuriga - Hariduslik hoidla õpetuste põhise struktuuriga
- Iga õppetunni kaust sisaldab README-d, koodinäiteid ja lahendusi - Igas õppetõe kaustas on README, koodinäited ja lahendused
- Iseseisvad projektid eraldi kataloogides (quiz-app, erinevad õppetundide projektid) - Sõltumatud projektid eraldi kaustades (quiz-app, erinevad õppetöö projektid)
- Tõlkesüsteem GitHub Actionsi abil (co-op-translator) - Tõlkesüsteem kasutades GitHub Actionsi (co-op-translator)
- Dokumentatsioon Docsify kaudu ja saadaval PDF-vormingus - Dokumentatsioon esitatakse Docsify kaudu ja on saadaval PDF-na
## Seadistuskäsud ## Seadistamiskäsud
See hoidla on peamiselt mõeldud haridusliku sisu tarbimiseks. Konkreetsete projektidega töötamiseks: See hoidla on peamiselt mõeldud haridusliku sisu tarbimiseks. Spetsiifiliste projektidega töötamiseks:
### Peamise hoidla seadistamine ### Peahoidla seadistamine
```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
``` ```
### Viktoriinirakenduse seadistamine (Vue 3 + Vite) ### Viktoriini rakenduse seadistamine (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Start development server npm run dev # Käivita arendusserver
npm run build # Build for production npm run build # Koosta tootmiseks
npm run lint # Run ESLint npm run lint # Käivita ESLint
``` ```
### Panga projekti API (Node.js + Express) ### Panga projekti API (Node.js + Express)
@ -46,237 +46,237 @@ npm run lint # Run ESLint
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # Start API server npm start # Käivita API server
npm run lint # Run ESLint npm run lint # Käivita ESLint
npm run format # Format with Prettier npm run format # See läbi Prettieriga
``` ```
### Brauserilaienduste projektid ### Brauserilaiendite projektid
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Follow browser-specific extension loading instructions # Järgi brauserispetsiifilisi laienduste laadimise juhiseid
``` ```
### Kosmosemängu projektid ### Kosmose mängu projektid
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# Open index.html in browser or use Live Server # Ava index.html brauseris või kasuta Live Serverit
``` ```
### Vestlusprojekt (Python tagapõhi) ### Vestlusprojekti (Python taust) seadistamine
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Set GITHUB_TOKEN environment variable # Sea GITHUB_TOKEN keskkonnamuutuja
python api.py python api.py
``` ```
## Arendustöövoog ## Arendusvoog
### Sisu panustajatele ### Sisu panustajatele
1. **Forki hoidla** oma GitHubi kontole 1. **Tee hoidla fork** oma GitHubi kontole
2. **Klooni oma fork** kohalikult 2. **Klooni oma fork kohalikku keskkonda**
3. **Loo uus haru** oma muudatuste jaoks 3. **Loo uus haru** oma muudatuste jaoks
4. Tee muudatusi õppetundide sisus või koodinäidetes 4. Muuda õpetuse sisu või koodinäiteid
5. Testi koodimuudatusi vastavates projektikataloogides 5. Testi koodimuudatusi vastavates projektikaustades
6. Esita pull request vastavalt panustamise juhistele 6. Esita pull request vastavalt panustamise juhistele
### Õppijatele ### Õppijatele
1. Forki või klooni hoidla 1. Tee fork või klooni hoidla
2. Liigu järjestikku õppetundide kataloogides 2. Liigu õppetöö kaustade vahel järjestikku
3. Loe iga õppetunni README faile 3. Loe iga õppetöö README-faile
4. Täida õppetunni eelsed viktoriinid aadressil https://ff-quizzes.netlify.app/web/ 4. Täida enne õppetööd viktoriinid aadressil https://ff-quizzes.netlify.app/web/
5. Töötle koodinäiteid õppetundide kaustades 5. Töötle läbi koodinäited õppetöö kaustades
6. Täida ülesandeid ja väljakutseid 6. Täida ülesanded ja väljakutsed
7. Tee õppetunni järgsed viktoriinid 7. Tee pärast õppetööd viktoriinid
### Reaalajas arendus ### Reaalajas arendus
- **Dokumentatsioon**: Käivita `docsify serve` juurkataloogis (port 3000) - **Dokumentatsioon**: Käivita `docsify serve` juurkataloogis (port 3000)
- **Viktoriinirakendus**: Käivita `npm run dev` quiz-app kataloogis - **Viktoriini rakendus**: Käivita `npm run dev` quiz-app kaustas
- **Projektid**: Kasuta VS Code Live Server laiendust HTML projektide jaoks - **Projektid**: Kasuta VS Code Live Serveri laiendust HTML projektide jaoks
- **API projektid**: Käivita `npm start` vastavates API kataloogides - **API projektid**: Käivita `npm start` vastavates API kaustades
## Testimisjuhised ## Testimise juhised
### Viktoriinirakenduse testimine ### Viktoriini rakenduse testimine
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Check for code style issues npm run lint # Kontrolli koodistiili probleeme
npm run build # Verify build succeeds npm run build # Kontrolli, kas ehitus õnnestub
``` ```
### Panga API testimine ### Panga API testimine
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Check for code style issues npm run lint # Kontrolli koodistiili probleeme
node server.js # Verify server starts without errors node server.js # Kontrolli, kas server käivitub ilma vigadeta
``` ```
### Üldine testimisviis ### Üldine testimisviis
- See on hariduslik hoidla, millel puuduvad ulatuslikud automaatsed testid - Tegemist on haridusliku hoidla, millel puudub täielik automatiseeritud testide kogum
- Käsitsi testimine keskendub: - Käsitsi testimine keskendub:
- Koodinäited töötavad ilma vigadeta - Koodinäited töötavad ilma vigadeta
- Dokumentatsiooni lingid töötavad korrektselt - Dokumentatsiooni lingid töötavad korrektselt
- Projektide ehitamine õnnestub - Projektide buildid valmivad edukalt
- Näited järgivad parimaid praktikaid - Näited järgivad häid tavasid
### Enne esitust kontrollid ### Enne esitust tehtavad kontrollid
- Käivita `npm run lint` kataloogides, kus on package.json - Käivita `npm run lint` kaustades, kus on package.json
- Kontrolli markdowni linkide kehtivust - Kontrolli markdown linkide kehtivust
- Testi koodinäiteid brauseris või Node.js-is - Testi koodinäiteid brauseris või Node.js-is
- Veendu, et tõlked säilitavad õige struktuuri - Kontrolli, et tõlked säilitavad õiged struktuurid
## Koodistiili juhised ## Koodistiili juhised
### JavaScript ### JavaScript
- Kasuta kaasaegset ES6+ süntaksit - Kasuta kaasaegset ES6+ süntaksit
- Järgi projektides pakutud standardseid ESLint konfiguratsioone - Järgi projektides pakutud standardseid ESLinti konfiguratsioone
- Kasuta tähenduslikke muutujate ja funktsioonide nimesid haridusliku selguse huvides - Kasuta tähenduslikke muutujate ja funktsioonide nimesid hariduslikul eesmärgil
- Lisa kommentaare, mis selgitavad õppijatele mõisteid - Lisa kommentaare, mis selgitavad kontseptsioone õppijatele
- Vorminda Prettieriga, kui see on seadistatud - Vorminda Prettieriga, kui see on konfigureeritud
### HTML/CSS ### HTML/CSS
- Semantilised HTML5 elemendid - Semantiline HTML5 elementide kasutus
- Responsiivse disaini põhimõtted - Reageeriv disainipõhimõtted
- Selged klassinimede konventsioonid - Selged klassinime reeglid
- Kommentaarid, mis selgitavad CSS-i tehnikaid õppijatele - Kommentaarid, mis selgitavad CSS tehnikat õppijatele
### Python ### Python
- PEP 8 stiilijuhised - Järgi PEP 8 stiilijuhiseid
- Selged, hariduslikud koodinäited - Selged, õppe-mõeldud koodinäited
- Tüübiviited, kus need on õppimise jaoks kasulikud - Tüübiviited, kus need aitavad õppimisel
### Markdown dokumentatsioon ### Markdown dokumentatsioon
- Selge pealkirjade hierarhia - Selge pealkirjade hierarhia
- Koodiplokid keele spetsifikatsiooniga - Koodiplokid keele määranguga
- Lingid lisamaterjalidele - Lingid täiendavatele ressurssidele
- Ekraanipildid ja pildid kataloogis `images/` - Ekraanipildid ja pildid `images/` kaustades
- Piltide alt-tekst ligipääsetavuse jaoks - Piltide alternatiivtekst ligipääsetavuse jaoks
### Failide organiseerimine ### Failide organiseerimine
- Õppetunnid nummerdatud järjestikku (1-getting-started-lessons, 2-js-basics jne) - Õpetused nummerdatud järjestikku (1-getting-started-lessons, 2-js-basics jne)
- Igal projektil on `solution/` ja sageli `start/` või `your-work/` kataloogid - Igal projektil on `solution/` ning sageli ka `start/` või `your-work/` kaustad
- Pildid salvestatud õppetundide spetsiifilistesse `images/` kaustadesse - Pildid salvestatud konkreetsete õppetööde `images/` kaustades
- Tõlked kataloogis `translations/{language-code}/` struktuuriga - Tõlked asuvad `translations/{language-code}/` struktuuris
## Ehitus ja juurutamine ## Ehitus ja juurutamine
### Viktoriinirakenduse juurutamine (Azure Static Web Apps) ### Viktoriini rakenduse juurutus (Azure Static Web Apps)
Viktoriinirakendus on konfigureeritud Azure Static Web Apps juurutamiseks: Viktoriini rakendus on konfigureeritud Azure Static Web Apps juurutuseks:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Creates dist/ folder npm run build # Loob dist/ kausta
# Deploys via GitHub Actions workflow on push to main # Teeb juurutuse GitHub Actionsi töövoo kaudu, kui surutakse main harusse
``` ```
Azure Static Web Apps konfiguratsioon: Azure Static Web Apps konfigureerimine:
- **Rakenduse asukoht**: `/quiz-app` - **Rakenduse asukoht**: `/quiz-app`
- **Väljundi asukoht**: `dist` - **Väljundkaust**: `dist`
- **Töövoog**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Töövoog**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Dokumentatsiooni PDF-i genereerimine ### Dokumentatsiooni PDF loomine
```bash ```bash
npm install # Install docsify-to-pdf npm install # Installi docsify-to-pdf
npm run convert # Generate PDF from docs npm run convert # Genereeri PDF dokumentidest
``` ```
### Docsify dokumentatsioon ### Docsify dokumentatsioon
```bash ```bash
npm install -g docsify-cli # Install Docsify globally npm install -g docsify-cli # Paigalda Docsify globaalsetena
docsify serve # Serve on localhost:3000 docsify serve # Serveri localhost:3000 peal
``` ```
### Projektispetsiifilised ehitused ### Projekti-spetsiifilised ehitused
Igal projektikataloogil võib olla oma ehitusprotsess: Igal projekti kaustal võib olla oma ehitusprotsess:
- Vue projektid: `npm run build` loob tootmisvalmis paketid - Vue projektid: `npm run build` loob tootmis-paketid
- Staatilised projektid: Ehitusetapp puudub, serveeri failid otse - Staatilised projektid: ehitusastet ei ole, serveeritakse faile otse
## Pull Request juhised ## Pull requesti juhised
### Pealkirja formaat ### Pealkirja formaat
Kasuta selgeid, kirjeldavaid pealkirju, mis viitavad muudatuste valdkonnale: Kasuta selgeid ja kirjeldavaid pealkirju, mis näitavad muudatuste valdkonda:
- `[Quiz-app] Lisa uus viktoriin õppetunni X jaoks` - `[Quiz-app] Lisa uus viktoriin õppetöö X jaoks`
- `[Lesson-3] Paranda kirjaviga terrariumi projektis` - `[Lesson-3] Paranda kirjaviga terrarium projekti puhul`
- `[Translation] Lisa hispaania keele tõlge õppetunnile 5` - `[Translation] Lisa hispaania tõlge õppetöö 5 jaoks`
- `[Docs] Uuenda seadistusjuhiseid` - `[Docs] Uuenda seadistamise juhiseid`
### Nõutavad kontrollid ### Nõutavad kontrollid
Enne PR-i esitamist: Enne PR-i esitust:
1. **Koodi kvaliteet**: 1. **Koodi kvaliteet**:
- Käivita `npm run lint` mõjutatud projektikataloogides - Käivita `npm run lint` mõjutatud projektikaustades
- Paranda kõik lintingu vead ja hoiatused - Paranda kõik lint vead ja hoiatused
2. **Ehitus kinnitamine**: 2. **Ehituse kontroll**:
- Käivita `npm run build`, kui see on asjakohane - Käivita `npm run build`, kui rakendub
- Veendu, et ehitusvead puuduvad - Veendu, et ehitusel puuduvad vead
3. **Linkide valideerimine**: 3. **Linkide kontroll**:
- Testi kõiki markdowni linke - Testi kõik markdown lingid
- Kontrolli, et pildiviited töötavad - Kontrolli piltide osutusi
4. **Sisu ülevaatus**: 4. **Sisu ülevaatamine**:
- Kontrolli õigekirja ja grammatikat - Õigekeelsuse ja grammatika kontroll
- Veendu, et koodinäited on korrektsed ja hariduslikud - Veendu, et koodinäited on õiged ja hariduslikud
- Kontrolli, et tõlked säilitavad algse tähenduse - Kontrolli tõlgete vastavust esialgsele tähendusele
### Panustamise nõuded ### Panustamise nõuded
- Nõustu Microsoft CLA-ga (automaatne kontroll esimesel PR-il) - Nõustu Microsoft CLA-ga (automaattest esimese PR ajal)
- Järgi [Microsofti avatud lähtekoodi käitumisjuhendit](https://opensource.microsoft.com/codeofconduct/) - Järgi [Microsofti avatud lähtekoodi käitumiskoodeksit](https://opensource.microsoft.com/codeofconduct/)
- Vaata [CONTRIBUTING.md](./CONTRIBUTING.md) üksikasjalike juhiste jaoks - Vaata üksikasjalikke juhiseid failist [CONTRIBUTING.md](./CONTRIBUTING.md)
- Viita probleemide numbritele PR-i kirjelduses, kui see on asjakohane - Viita probleeminumbritele PR kirjelduse puhul, kui kehtib
### Ülevaatusprotsess ### Ülevaatusprotsess
- PR-e vaatavad üle haldajad ja kogukond - PR-e vaatavad läbi haldajad ja kogukond
- Hariduslik selgus on prioriteet - Eristub hariduslik selgus
- Koodinäited peaksid järgima praeguseid parimaid praktikaid - Koodinäited peaksid järgima parimaid tavasid
- Tõlked vaadatakse üle täpsuse ja kultuurilise sobivuse osas - Tõlked vaadatakse üle täpsuse ja kultuurilise sobivuse jaoks
## Tõlkesüsteem ## Tõlkesüsteem
### Automaatne tõlkimine ### Automaatne tõlge
- Kasutab GitHub Actionsi koos co-op-translator töövooga - Kasutab GitHub Actionsi koos co-op-translator töövooga
- Tõlgib automaatselt enam kui 50 keelde - Tõlgib automaatselt 50+ keelde
- Algfailid peamistes kataloogides - Allikafailid paiknevad peamistes kaustades
- Tõlgitud failid kataloogis `translations/{language-code}/` - Tõlgitud failid on `translations/{language-code}/` kaustades
### Käsitsi tõlke paranduste lisamine ### Käsitsi tõlke täienduste lisamine
1. Leia fail kataloogist `translations/{language-code}/` 1. Leia fail kaustast `translations/{language-code}/`
2. Tee parandusi, säilitades struktuuri 2. Tee parandused säilitades struktuuri
3. Veendu, et koodinäited jäävad funktsionaalseks 3. Veendu, et koodinäited jäävad toimima
4. Testi lokaliseeritud viktoriinisisu 4. Testi kõiki lokaliseeritud viktoriinisisusid
### Tõlke metaandmed ### Tõlke metaandmed
Tõlgitud failid sisaldavad metaandmete päist: Tõlgitud failidel on metaandmete päis:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -293,114 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### Levinud probleemid ### Levinud probleemid
**Viktoriinirakendus ei käivitu**: **Viktoriini rakendus ei käivitu**:
- Kontrolli Node.js versiooni (soovitatav v14+) - Kontrolli Node.js versiooni (soovitatav v14+)
- Kustuta `node_modules` ja `package-lock.json`, käivita uuesti `npm install` - Kustuta `node_modules` ja `package-lock.json`, seejärel käivita `npm install` uuesti
- Kontrolli porti konflikte (vaikimisi: Vite kasutab porti 5173) - Kontrolli pordi konflikte (vaikimisi: Vite kasutab porti 5173)
**API server ei käivitu**: **API server ei käivitu**:
- Veendu, et Node.js versioon vastab miinimumile (node >=10) - Veendu, et Node.js versioon vastab miinimumile (node >=10)
- Kontrolli, kas port on juba kasutusel - Kontrolli, kas port on juba kasutuses
- Veendu, et kõik sõltuvused on paigaldatud `npm install` abil - Veendu, et kõik sõltuvused installitud käsuga `npm install`
**Brauserilaiendus ei laadi**: **Brauserilaiend ei laadi**:
- Kontrolli, et manifest.json on korrektselt vormindatud - Kontrolli, et manifest.json on korrektselt vormindatud
- Kontrolli brauseri konsooli vigade osas - Kontrolli brauseri konsooli vigade kohta
- Järgi brauserispetsiifilisi laienduse paigaldamise juhiseid - Järgi brauserispetsiifilisi laiendi paigaldamise juhiseid
**Python vestlusprojekti probleemid**: **Python vestlusprojekti probleemid**:
- Veendu, et OpenAI pakett on paigaldatud: `pip install openai` - Veendu, et OpenAI pakett on installitud: `pip install openai`
- Kontrolli, et GITHUB_TOKEN keskkonnamuutuja on seadistatud - Kontrolli, et GITHUB_TOKEN keskkonnamuutuja on määratud
- Kontrolli GitHub Models juurdepääsuõigusi - Kontrolli GitHub Models juurdepääsu õigusi
**Docsify ei serveeri dokumente**: **Docsify ei serveeri dokumente**:
- Paigalda docsify-cli globaalselt: `npm install -g docsify-cli` - Installi globaalne docsify-cli: `npm install -g docsify-cli`
- Käivita hoidla juurkataloogist - Käivita hoidla juurkataloogist
- Kontrolli, et `docs/_sidebar.md` eksisteerib - Kontrolli, et `docs/_sidebar.md` fail on olemas
### Arenduskeskkonna näpunäited ### Arenduskeskkonna näpunäited
- Kasuta VS Code'i koos Live Server laiendusega HTML projektide jaoks - Kasuta VS Codei koos Live Server laiendusega HTML projektide jaoks
- Paigalda ESLint ja Prettier laiendused ühtlaseks vormindamiseks - Paigalda ESLint ja Prettier laiendused ühtseks vormindamiseks
- Kasuta brauseri DevTools'i JavaScripti silumiseks - Kasuta brauseri arendustööriistu JavaScripti silumiseks
- Vue projektide jaoks paigalda Vue DevTools brauserilaiendus - Vue projektide puhul paigalda Vue DevTools brauserilaiend
### Jõudluse kaalutlused ### Jõudluse kaalutlused
- Suur hulk tõlgitud faile (50+ keelt) tähendab, et täielikud kloonid on mahukad - Suur hulk tõlgitud faile (50+ keelt) teeb tervikhoidla klooni suureks
- Kasuta madalat klooni, kui töötad ainult sisuga: `git clone --depth 1` - Kasuta madalat klooni, kui töötad ainult sisuga: `git clone --depth 1`
- Välista tõlked otsingutest, kui töötad ingliskeelse sisuga - Väldi tõlgete otsimist töös, kui tegeled ingliskeelse sisuga
- Ehituse protsessid võivad esmakordsel käivitamisel olla aeglased (npm install, Vite build) - Ehitused võivad esimesel käivitamisel olla aeglased (npm install, Vite build)
## Turvalisuse kaalutlused ## Turvalisuse kaalutlused
### Keskkonnamuutujad ### Keskkonnamuutujad
- API võtmeid ei tohiks kunagi hoidlasse lisada - API võtmeid ei tohiks kunagi hoidlasse commitida
- Kasuta `.env` faile (juba `.gitignore`-is) - Kasuta `.env` faile (juba lisatud `.gitignore` failile)
- Dokumenteeri nõutavad keskkonnamuutujad projekti README-des - Dokumenteeri nõutud keskkonnamuutujad projekti README-des
### Python projektid ### Python projektid
- Kasuta virtuaalset keskkonda: `python -m venv venv` - Kasuta virtuaalkeskkonda: `python -m venv venv`
- Hoia sõltuvused ajakohased - Hoia sõltuvused ajakohased
- GitHubi tokenid peaksid omama minimaalset vajalikku õigust - GitHub tokenid peaksid omama minimaalset vajaminevat õigust
### GitHub Models juurdepääs ### GitHub Models ligipääs
- Isiklikud juurdepääsutokenid (PAT) on vajalikud GitHub Models jaoks - GitHub Models kasutamiseks on vajalikud isikliku ligipääsu tokenid (PAT)
- Tokenid tuleks salvestada keskkonnamuutujatena - Tokenid peaksid olema salvestatud keskkonnamuutujatena
- Ära kunagi lisa tokenit või mandaate hoidlasse - Ükski token ega tunnus ei tohi kunagi hoidlasse commitida
## Täiendavad märkused ## Lisamärkused
### Sihtgrupp ### Sihtgrupp
- Täielikud algajad veebiarenduses - Täielikud algajad veebiarenduses
- Õpilased ja iseseisvad õppijad - Õpilased ja iseseisvad õppijad
- Õpetajad, kes kasutavad õppekava klassiruumis - Õpetajad, kes kasutavad õppekava klassiruumis
- Sisu on loodud ligipääsetavuse ja järkjärgulise oskuste arendamise jaoks - Sisu on loodud ligipääsetavaks ja oskuste järkjärguliseks arendamiseks
### Haridusfilosoofia ### Haridusfilosoofia
- Projektipõhine õppe lähenemine - Projektipõhine õpe
- Sagedased teadmiste kontrollid (viktoriinid) - Sageli korduvad teadmiste kontrollid (viktoriinid)
- Praktilised koodiharjutused - Käed-külge kodeerimise harjutused
- Päriselu rakenduste näited - Reaalsete olukordade rakendamise näited
- Keskendumine põhialustele enne raamistikke - Keskendumine põhialustele enne raamistikke
### Hoidla hooldus ### Hoidla hooldus
- Aktiivne õppijate ja panustajate kogukond - Aktiivne õppijate ja panustajate kogukond
- Regulaarne sõltuvuste ja sisu uuendamine - Regulaarne sisu ja sõltuvuste uuendamine
- Probleemide ja arutelude jälgimine haldajate poolt - Probleemide ja arutelude jälgimine haldajate poolt
- Tõlkeuuendused automatiseeritud GitHub Actionsi kaudu - Tõlkevärskendused automatiseeritud GitHub Actionsi kaudu
### Seotud ressursid ### Seotud ressursid
- [Microsoft Learn moodulid](https://docs.microsoft.com/learn/) - [Microsoft Learn moodulid](https://docs.microsoft.com/learn/)
- [Student Hub ressursid](https://docs.microsoft.com/learn/student-hub/) - [Õpilaste keskuse ressursid](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) soovitatav õppijatele - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) soovitatav õppijatele
- Täiendavad kursused: Generatiivne AI, Andmeteadus, ML, IoT õppekavad saadaval - Täiendavad kursused: Generatiivne AI, Andmeteadus, ML, IoT õppekavad kättesaadavad
### Konkreetsete projektidega töötamine ### Töötamine spetsiifiliste projektidega
Üksikasjalike juhiste jaoks individuaalsete projektide kohta vaata README faile: Üksikasjad üksikute projektide kohta asuvad nende README failides:
- `quiz-app/README.md` - Vue 3 viktoriinirakendus - `quiz-app/README.md` - Vue 3 viktoriini rakendus
- `7-bank-project/README.md` - Pangarakendus autentimisega - `7-bank-project/README.md` - Panga rakendus autentimisega
- `5-browser-extension/README.md` - Brauserilaienduse arendus - `5-browser-extension/README.md` - Brauserilaiendi arendus
- `6-space-game/README.md` - Canvas-põhine mänguarendus - `6-space-game/README.md` - Canvas-põhine mänguarendus
- `9-chat-project/README.md` - AI vestlusassistendi projekt - `9-chat-project/README.md` - Tehisintellekti vestlusassistendi projekt
### Monorepo struktuur ### Monorepo struktuur
Kuigi mitte traditsiooniline monorepo, sisaldab see hoidla mitmeid iseseisvaid projekte: Kuigi ei ole traditsiooniline monorepo, sisaldab see hoidla mitmeid iseseisvaid projekte:
- Iga õppetund on iseseisev - Iga õppetöö on iseseisev
- Projektid ei jaga sõltuvusi - Projektid ei jaga sõltuvusi
- Töötage individuaalsete projektidega, mõjutamata teisi - Üksikute projektidega töötab eraldi, ilma teistele mõju tegemata
- Klooni kogu hoidla täieliku õppekava kogemuse jaoks - Kogu hoidlasse kloonides saad täieliku õppekava kogemuse
--- ---
**Lahtiütlus**: <!-- CO-OP TRANSLATOR DISCLAIMER START -->
See dokument on tõlgitud AI tõlketeenuse [Co-op Translator](https://github.com/Azure/co-op-translator) abil. Kuigi püüame tagada täpsust, palume arvestada, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Algne dokument selle algses keeles tuleks pidada autoriteetseks allikaks. Olulise teabe puhul soovitame kasutada professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tulenevate arusaamatuste või valesti tõlgenduste eest. **Vastutusest loobumine**:
See dokument on tõlgitud kasutades tehisintellektil põhinevat tõlkesüsteemi [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi püüame tagada täpsust, palun arvestage, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument selle emakeeles tuleks pidada autoriteetseks allikaks. Olulise teabe puhul soovitame kasutada professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tulenevate arusaamatuste või valesti mõistmiste eest.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -2,7 +2,7 @@
[![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 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 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/) [![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) [![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/) [![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/)
[![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 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/)
@ -10,18 +10,18 @@
[![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)
# Veebiarendus algajatele õppekava # Veebiarendus algajatele Õppekava
Õppige veebiarenduse põhialuseid meie Microsoft Cloud Advocatesi 12-nädalase põhjaliku kursusega. Iga 24 õppetundi viib teid süvitsi JavaScripti, CSS-i ja HTML-i maailma praktiliste projektide kaudu nagu terraariumid, brauserilaiendid ja kosmosemängud. Osalege viktoriinides, diskussioonides ja praktilistes ülesannetes. Täiustage oma oskusi ja optimeerige teadmiste säilitamist meie tõhusa projektipõhise pedagoogikaga. Alustage oma kodeerimise teekonda juba täna! Õpi veebiarenduse põhialuseid meie 12-nädalase põhjaliku kursusega, mida viivad läbi Microsoft Cloud Advocates. Kõik 24 õppetundi süvenevad JavaScripti, CSS-i ja HTML-i praktiliste projektide kaudu, näiteks terrariumid, brauserilaiendid ja kosmose mängud. Osale viktoriinides, aruteludes ja praktilistes ülesannetes. Paranda oma oskusi ja optimeeri teadmiste meeldejätmist meie tõhusa projektipõhise pedagoogikaga. Alusta oma programmeerimisteekonda juba täna!
Liituge Azure AI Foundry Discordi kogukonnaga Liitu Azure AI Foundry Discordi kogukonnaga
[![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)
Järgige neid samme, et hakata neid ressursse kasutama: Järgige neid samme, et alustada nende ressursside kasutamist:
1. **Tehke hoidlast forkitamine**: Klõpsake nuppu [![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. **Jaga hoidlaga**: Klõpsake [![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. **Klooni hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Kloonige hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Liituge Azure AI Foundry Discordiga ja kohtuge ekspertide ning teiste arendajatega**](https://discord.com/invite/ByRwuEEgH4) 3. [**Liitu Azure AI Foundry Discordiga ning kohtuge ekspertide ja teiste arendajatega**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Mitmekeelne tugi ### 🌐 Mitmekeelne tugi
@ -30,192 +30,190 @@ Järgige neid samme, et hakata neid ressursse kasutama:
<!-- 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](./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) | [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](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](./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) | [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)
> **Eelistate kloonida lokaalselt?** > **Eelistad kohalikku kloonimist?**
> See hoidla sisaldab üle 50 keele tõlkeid, mis suurendab oluliselt allalaadimise mahtu. Kui soovite kloonida ilma tõlgeteta, kasutage sparse checkout'i: > See hoidla sisaldab üle 50 keele tõlget, mis suurendab oluliselt allalaadimismahtu. Tõlgeteta kloonimiseks kasuta harva allalaaditava sisuga kloonimist (sparse checkout):
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> See annab teile kõik vajaliku kursuse läbimiseks palju kiirema allalaadimisega. > See annab sulle kõik vajaliku kursuse läbimiseks palju kiiremalt.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Kui soovite toetada täiendavaid tõlkekeeli, siis toetatud keeled on loetletud [siin](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Kui soovid toetada täiendavaid tõlkekeeli, on nende loetelu [siin](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Avage Visual Studio Code'is](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)
#### 🧑‍🎓 _Kas oled üliõpilane?_ #### 🧑‍🎓 _Oled tudeng?_
Külasta [**Student Hub lehte**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kus leiad algajatele mõeldud ressursid, üliõpilaste pakid ja isegi võimalused tasuta sertifikaadivautšerite saamiseks. See on leht, mille tahad järjehoidjasse lisada ja aeg-ajalt kontrollida, sest sisu uuendatakse igakuiselt. Külasta [**Tudengikeskuse lehte**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kus leiad algajale suunatud ressursid, tudengipakid ja isegi võimalused saada tasuta sertifikaadikupong. See on leht, mille soovid järjehoidjaks panna ja aeg-ajalt külastada, sest sisu uuendatakse igakuiselt.
### 📣 Teade - Uued GitHub Copilot Agent moodi väljakutsed! ### 📣 Teade Uued väljakutsed GitHub Copilot Agent režiimis, mida lõpuni viia!
Uus väljakutse lisatud, otsi peatükkidest "GitHub Copilot Agent Challenge 🚀". See on uus väljakutse, mida saad täita GitHub Copiloti ja Agent režiimi abil. Kui sa pole varem Agent režiimi kasutanud, siis see suudab mitte ainult teksti genereerida, vaid ka luua ja redigeerida faile, käivitada käske ja palju muud. Lisandus uus väljakutse, otsi enamikest peatükkidest "GitHub Copilot Agent Challenge 🚀". See on uus väljakutse, mida saad täita GitHub Copilot ja Agent režiimi abil. Kui sa pole varem Agent režiimi kasutanud, siis see suudab mitte ainult teksti genereerida, vaid ka faile luua ja muuta, käivitada käske ja palju muud.
### 📣 Teade - _Uus Generatiivse AI projekt ehitamiseks_ ### 📣 Teade _Uus generatiivse tehisintellekti abil ehitatav projekt_
Lisandunud uus AI assistendi projekt, vaata [projekti](./9-chat-project/README.md) Lisandus uus AI assistendi projekt, vaata lähemalt [projektist](./9-chat-project/README.md)
### 📣 Teade - _Uus õppekava_ Generatiivse AI kohta JavaScripti jaoks avaldatud ### 📣 Teade _Uus Generative AI õppekava JavaScriptile_
Ära maga maha meie uut Generatiivse AI õppekava! Ära jäta vahele meie uut Generatiivse AI õppekava!
Alusta aadressilt [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! Alusta aadressil [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)!
![Taust](../../translated_images/et/background.148a8d43afde5730.webp) ![Background](../../translated_images/et/background.148a8d43afde5730.webp)
- Õppetunnid hõlmavad kõike alates põhitõdedest kuni RAG-ni. - Õppetunnid käsitlevad kõike alates põhitõdedest kuni RAG-ni.
- Suhtle ajalooliste tegelastega GenAI ja meie kaaslase rakenduse abil. - Suhtle ajalooliste tegelastega GenAI ja meie kaasrakenduse abil.
- Lõbus ja kaasahaarav jutustus, sa reisid ajas! - Lõbus ja kaasahaarav jutustus, kus rändad ajas!
![tegelane](../../translated_images/et/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/et/character.5c0dd8e067ffd693.webp)
Igas õppetunnis on ülesanne lõpetamiseks, teadmiste kontroll ja väljakutse, mis juhatab sind järgmiste teemadega tutvumisel: Iga õppetund sisaldab sooritamiseks ülesannet, teadmiste kontrolli ja väljakutset, mis aitavad õpitavates valdkondades nagu:
- Täpsustamine ja täpsustamise inseneriteadus - Päringute koostamine ja päringute inseneritehnika
- Teksti ja pildi rakenduste genereerimine - Teksti ja pildirakenduste genereerimine
- Otsingurakendused - Otsingurakendused
Alusta aadressil [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course)! Alusta aadressil [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)!
## 🌱 Alustamine ## 🌱 Alustamine
> **Õpetajad**, oleme lisanud [mõningaid soovitusi](for-teachers.md) selle kohta, kuidas seda õppekava kasutada. Hindame väga teie tagasisidet [meie arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Õpetajad**, me oleme lisanud mõned soovitused [siin](for-teachers.md), kuidas seda õppekava kasutada. Hindame väga teie tagasisidet [meie arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Õppijad](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)** alustage iga õppetunniga eelviktoriiniga ja jätkake õppetunni materjali lugemisega, täites erinevaid tegevusi ning kontrollige oma arusaamist järekviktoriiniga. **[Õppijad](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, alustage iga õppetundi eeloengu viktoriiniga, järgige loengumaterjali lugemist, sooritage erinevad tegevused ja kontrollige arusaamist järelõppe viktoriiniga.
Selleks, et parandada oma õpikogemust, ühenduge eakaaslastega, et koos projekte teha! Arutelud on teretulnud meie [arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kus meie moderaatorite meeskond on valmis teie küsimustele vastama. Õppimise kogemuse parandamiseks looge ühendus oma eakaaslastega, et koos projektidega töötada! Arutelud on teretulnud meie [arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kus meie moderaatorite meeskond on valmis teie küsimustele vastama.
Hariduse süvendamiseks soovitame tungivalt uurida [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) täiendavate õppematerjalide jaoks. Veelgi rohkem õppimiseks soovitame tungivalt uurida [Microsoft Learni](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) lisastudiumimaterjale.
### 📋 Oma arenduskeskkonna seadistamine ### 📋 Keskkonna seadistamine
See õppekava on koos arenduskeskkonnaga, mis on kohe kasutusvalmis! Kui alustate, võite valida, kas käivitada õppekava [Codespace'is](https://github.com/features/codespaces/) (_brauseripõhine, installimist mitte vajav keskkond_), või lokaalselt oma arvutis, kasutades tekstiredaktorit nagu [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Sellel õppekaval on valmis arenduskeskkond! Kursuse alustamisel võid valida selle käivitamise [Codespaceis](https://github.com/features/codespaces/) (_brauseripõhine, pole vaja midagi paigaldada_), või kohalikult oma arvutis tekstitöötlusprogrammi nagu [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) abil.
#### Looge oma hoidla #### Loo oma hoidla
Selleks, et salvestada oma tööd lihtsalt, on soovitatav luua oma hoidla koopia. Seda saate teha, klõpsates lehe ülaosas nuppu **Use this template**. See loob teie GitHubi kontole uue hoidla koos õppekava koopiaga. Selleks, et oleks lihtsam oma tööd salvestada, soovitatakse luua selle hoidla koopia. Seda saad teha, klõpsates lehe ülaosas nuppu **Use this template**. See loob uue hoidla sinu GitHubi kontole koos õppekava koopiaga.
Järgige neid samme: Järgi neid samme:
1. **Tehke hoidlast forkitamine**: Klõpsake selle lehe paremas ülanurgas nuppu "Fork". 1. **Jaga hoidlaga**: Klõpsa selle lehe paremas ülanurgas nuppu "Fork".
2. **Klooni hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Kloonige hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Õppekava käivitamine Codespace'is #### Õppekava käivitamine Codespaces keskkonnas
Loomata hoidla koopias, mille tegite, klõpsake nuppu **Code** ja valige **Open with Codespaces**. See loob uue Codespace'i, kus saate tööd teha. Selles hoidla koopias, mille lõid, klõpsa nuppu **Code** ja vali **Open with Codespaces**. See loob sulle uue Codespacei töötamiseks.
![Codespace](../../translated_images/et/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/et/createcodespace.0238bbf4d7a8d955.webp)
#### Õppekava käivitamine lokaalselt arvutis #### Õppekava käivitamine kohalikult arvutis
Selle õppekava käivitamiseks kohalikult arvutis vajate tekstiredaktorit, veebibrauserit ja käsureatööriista. Meie esimene õppetund, [Programmeeringukeeled ja tööriistad](../../1-getting-started-lessons/1-intro-to-programming-languages), tutvustab teile erinevaid võimalusi nende tööriistade jaoks, et saaksite valida endale parima. Selle õppekava kohalikuks käivitamiseks vajad tekstitöötlusprogrammi, brauserit ja käsurea tööriista. Meie esimene õppetund, [Sissejuhatus programmeerimiskeeltesse ja tööriistadesse](../../1-getting-started-lessons/1-intro-to-programming-languages), juhatab sind läbi erinevate võimaluste ning aitab valida sobivad tööriistad.
Soovitame kasutada [Visual Studio Code'i](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) redaktorina, mis sisaldab ka sisseehitatud [terminali](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code'i saate alla laadida [siit](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Soovitame kasutada [Visual Studio Codei](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) tekstiredaktorina, millel on ka sisseehitatud [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Codei saad alla laadida [siit](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Kloonige oma hoidla oma arvutisse. Seda saate teha, klõpsates nuppu **Code** ja kopeerides URL-i: 1. Kloonige oma hoidla oma arvutisse. Seda saad teha, klõpsates nuppu **Code** ja kopeerides URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Siis ava [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) sees ja käivita järgmine käsk, asendades `<your-repository-url>` äsja kopeeritud URL-iga: Seejärel ava [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) [Visual Studio Code'i](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) sees ja käivita järgmine käsk, asendades `<your-repository-url>` äsja kopeeritud URL-iga:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Ava kaust Visual Studio Code'is. Seda saad teha, klõpsates **File** > **Open Folder** ja valides äsja kloonitud kausta.
2. Ava kaust Visual Studio Code'is. Sa saad seda teha, klõpsates **File** > **Open Folder** ja valides äsja kloonitud kausta. > Soovitatud Visual Studio Code laiendused:
> Soovitatud Visual Studio Codei laiendused:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) HTML-lehtede eelvaateks Visual Studio Codeis > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) HTML-lehtede eelvaate kuvamiseks Visual Studio Code'is
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) et aidata sul koodi kiiremini kirjutada > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) aitab sul koodi kiiremini kirjutada
## 📂 Iga õppetüki sisu sisaldab: ## 📂 Iga õppetund sisaldab:
- valikulist sketšimärkust - valikuline visand
- valikulist lisavideot - valikuline lisavidin
- eel-õppetüki soojendusküsimustikku - eelõppe soojendus-quiz
- kirjalikku õppetükki - kirjalik õppetund
- projektipõhiste õppetükkide puhul samm-sammult juhendeid projekti loomiseks - projektipõhiste õppetundide korral samm-sammult juhised projekti ehitamiseks
- teadmiste kontrolli - teadmiste kontroll
- ülesannet - väljakutse
- lisa lugemist - lisalugemine
- [järgmise õppetüki küsimustikku](https://ff-quizzes.netlify.app/web/) - ülesanne
- [järgnev quiz](https://ff-quizzes.netlify.app/web/)
> **Märkus küsimustike kohta**: Kõik küsimustikud on Quiz-app kaustas, kokku 48 küsimustikku, igaüks kolme küsimusega. Need on saadaval [siin](https://ff-quizzes.netlify.app/web/). Küsimustiku rakendust saab käivitada lokaalselt või avaldada Azureis; järgi juhiseid `quiz-app` kaustas.
> **Märkused quizide kohta**: Kõik quizid asuvad Quiz-app kaustas, kokku 48 quiz'i, igas kolm küsimust. Need on kättesaadavad [siin](https://ff-quizzes.netlify.app/web/). Quiz-rakendust saab käivitada lokaalselt või paigaldada Azure'i; järgi juhiseid `quiz-app` kaustas.
## 🗃️ Õppetükid
## 🗃️ Õppetunnid
| | Projekti nimi | Õppekäsitletavad mõisted | Õpieesmärgid | Seotud õppetükk | Autor |
| :-: | :-------------------------------------------------------: | :-------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | | Projekti nimi | Õppekäsitlused | Õpieesmärgid | Seotud õppetund | Autor |
| 01 | Alustamine | Programmeerimise ja tööriistade tutvustus | Õpi programmeerimiskeelte põhialuseid ja tarkvara, mis aitab professionaalsetel arendajatel oma tööd teha | [Programmeerimiskeelte ja tööriistade tutvustus](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | :-: | :------------------------------------------------------: | :------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 02 | Alustamine | GitHubi põhialused, sh meeskonnatöö | Kuidas kasutada GitHubi oma projektis ja teha koostööd teistega koodipõhjal | [GitHubi tutvustus](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 01 | Alustamine | Programmeerimise ja tööriistade tutvustus | Õpi programmeerimiskeelte alustalasid ja tarkvara, mis aitab arendajatel tööd teha | [Sihtprogrammide ja tööriistade sissejuhatus](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 03 | Alustamine | Ligipääsetavus | Õpi veebipõhise ligipääsetavuse põhialused | [Ligipääsetavuse põhialused](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 02 | Alustamine | GitHub'i alused, meeskonnatöö | Õpi kasutama GitHubi projektis ja koostööd koodibaasil | [GitHub'i alused](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 04 | JS Põhitõed | JavaScripti andmetüübid | JavaScripti andmetüüpide alused | [Andmetüübid](./2-js-basics/1-data-types/README.md) | Jasmine | | 03 | Alustamine | Ligipääsetavus | Õpi veebipõhise ligipääsetavuse aluseid | [Ligipääsetavuse alused](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 05 | JS Põhitõed | Funktsioonid ja meetodid | Õpi funktsioone ja meetodeid rakenduse loogika juhtimiseks | [Funktsioonid ja meetodid](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher | | 04 | JS algtõed | JavaScripti andmetüübid | JavaScripti andmetüüpide alused | [Andmetüübid](./2-js-basics/1-data-types/README.md) | Jasmine |
| 06 | JS Põhitõed | Otsuste tegemine JS abil | Õpi tingimuste loomist koodis otsustamist kasutades | [Otsuste tegemine](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 05 | JS algtõed | Funktsioonid ja meetodid | Õpi rakenduse loogika juhtimise funktsioonide ja meetodite kohta | [Funktsioonid ja meetodid](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher |
| 07 | JS Põhitõed | Massiivid ja tsüklid | Töötamine andmetega, kasutades massiive ja tsükleid JavaScriptis | [Massiivid ja tsüklid](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 06 | JS algtõed | Otsuste tegemine JS abil | Õpi, kuidas koodis luua tingimusi otsustusmeetodite abil | [Otsuste tegemine](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikas | Ehita HTML, et luua veebipõhine terrarium, keskendudes paigutuse ehitamisele | [HTML algõpetus](./3-terrarium/1-intro-to-html/README.md) | Jen | | 07 | JS algtõed | Massiivid ja tsüklid | Töötle andmeid massiivide ja tsüklite abil JavaScriptis | [Massiivid ja tsüklid](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikas | Ehita CSS, et kujundada veebiterrarium, keskendudes CSS põhialustele sh lehe reageerivuse tagamisele | [CSS algõpetus](./3-terrarium/2-intro-to-css/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikas | Ehitada HTML, et luua veebiterrarium, keskendudes paigutuse loomisele | [Sissejuhatus HTML-i](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScripti sulud, DOM-i manipuleerimine | Ehita JavaScript, mis muudab terrariumi lohistamiseks mõeldud liideseks, keskendudes suludele ja DOM-i manipuleerimisele | [JavaScripti sulud, DOM manipuleerimine](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikas | Ehita CSS veebiterrariumi stiiliks, keskendudes CSS põhialustele sh lehe reageerivusele | [Sissejuhatus CSS-i](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 11 | [Trükimäng](./4-typing-game/solution/README.md) | Trükimängu ehitamine | Õpi klahvivajutuste sündmuste kasutamist oma JavaScripti rakenduse loogika juhtimiseks | [Sündmustepõhine programmeerimine](./4-typing-game/typing-game/README.md) | Christopher | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScripti sulgemised, DOM manipulatsioon | Ehita JavaScript, mis teeb terrariumi lohistamiskogemuseks, keskendudes sulgemistele ja DOM manipulatsioonile | [JavaScript sulgemised, DOM manipulatsioon](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 12 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Töötamine brauseritega | Õpi, kuidas brauserid töötavad, nende ajalugu ja kuidas luua brauserilaiendi põhielemendid | [Brauserite kohta](./5-browser-extension/1-about-browsers/README.md) | Jen | | 11 | [Typing Game](./4-typing-game/solution/README.md) | Tippimismängu ehitamine | Õpi kasutama klaviatuurisündmusi oma JavaScripti rakenduse loogika juhtimiseks | [Sündmustepõhine programmeerimine](./4-typing-game/typing-game/README.md) | Christopher |
| 13 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Vormide loomine, API-kõned ja muutujate salvestamine kohalikku salvestusse | Ehita oma brauserilaiendi JavaScripti osad API kutsumiseks, kasutades lokaalses salvestuses olevaid muutujaid | [API-d, vormid ja kohalik salvestus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Brauseritega töötamine | Õpi, kuidas brauserid toimivad, nende ajalugu ja kuidas esimesed elemendid brauserilaienduse jaoks üles seada | [BROWSERID](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 14 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Brauseri taustaprotsessid, veebijõudlus | Kasuta brauseri taustaprotsesse laiendi ikooni haldamiseks; õpi veebijõudluse ja mõnede optimeerimiste kohta | [Taustatöötlus ja jõudlus](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Vormide loomine, API kasutamine ja muutujate salvestamine kohalikku salve | Ehita oma brauserilaienduse JavaScripti osad API kutsumiseks ja kohalikku salvesse muutujate salvestamiseks | [API-d, vormid ja kohalik salvestus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 15 | [Taeva mäng](./6-space-game/solution/README.md) | Täiustatud mänguarendus JavaScriptis | Õpi pärimist, kasutades nii klasse kui ka koostist, ja Pub/Sub mustrit, mänguarenduse ettevalmistuseks | [Täiustatud mänguarenduse sissejuhatus](./6-space-game/1-introduction/README.md) | Chris | | 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Brauseril taustaprotsessid, veebitöötluse optimeerimine | Kasuta brauseri taustaprotsesse laiendi ikooni haldamiseks; õpi veebitöötluse ja optimeerimisvõtteid | [Taustatöö ja jõudlus](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 16 | [Taeva mäng](./6-space-game/solution/README.md) | Joonistamine lõuendile | Õpi Canvas API kohta, mida kasutatakse elementide joonistamiseks ekraanile | [Joonistamine lõuendile](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 15 | [Space Game](./6-space-game/solution/README.md) | Täiustatud mänguarendus JavaScriptiga | Õpi pärandamist nii klasside kui kompositsiooni kaudu ning Pub/Sub mudelit, et valmistuda mängu ehitamiseks | [Täpsem mänguarendus](./6-space-game/1-introduction/README.md) | Chris |
| 17 | [Taeva mäng](./6-space-game/solution/README.md) | Elementide liigutamine ekraanil | Avasta, kuidas elementidel saab liikumine, kasutades kartesiaan-koordinaate ja Canvas API | [Elementide liigutamine](./6-space-game/3-moving-elements-around/README.md) | Chris | | 16 | [Space Game](./6-space-game/solution/README.md) | Joonistamine Canvasel | Õpi Canvas API kasutamist elementide joonistamiseks ekraanile | [Joonistamine Canvasel](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 18 | [Taeva mäng](./6-space-game/solution/README.md) | Kokkupõrgete tuvastamine | Pane elemendid kokkupõrkama ja reageerima üksteisele klahvivajutustega ning lisa jahutuse funktsioon mängu jõudluse jaoks | [Kokkupõrgete tuvastamine](./6-space-game/4-collision-detection/README.md) | Chris | | 17 | [Space Game](./6-space-game/solution/README.md) | Elementide liigutamine ekraanil | Avastage, kuidas objektid saavad liikuma kardiniaalsete koordinaatide ja Canvas API abil | [Elementide liigutamine](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 19 | [Taeva mäng](./6-space-game/solution/README.md) | Punkteerimise säilitamine | Tee mängu oleku ja jõudluse põhjal matemaatilisi arvutusi | [Punkteerimise säilitamine](./6-space-game/5-keeping-score/README.md) | Chris | | 18 | [Space Game](./6-space-game/solution/README.md) | Kokkupõrgete tuvastamine | Pane objektid põrkama ja teineteisega reageerima klahvivajutuste abil, lisa jahutuse funktsioon mängu jõudluse tagamiseks | [Kokkupõrgete tuvastamine](./6-space-game/4-collision-detection/README.md) | Chris |
| 20 | [Taeva mäng](./6-space-game/solution/README.md) | Mängu lõpetamine ja taaskäivitamine | Õpi mängu lõpetamise ja taaskäivitamise kohta, sh varade puhastamise ja muutujate lähtestamise | [Lõpetamise tingimus](./6-space-game/6-end-condition/README.md) | Chris | | 19 | [Space Game](./6-space-game/solution/README.md) | Tulemustabeli hoidmine | Tee matemaatilisi arvutusi mängu oleku ja jõudluse põhjal | [Tulemustabeli hoidmine](./6-space-game/5-keeping-score/README.md) | Chris |
| 21 | [Pangarakendus](./7-bank-project/solution/README.md) | HTML mallid ja marsruudid veebirakenduses | Õpi, kuidas luua mitmeleheküljelise veebisaidi arhitektuuri raamistik kasutades marsruutimist ja HTML-malle | [HTML mallid ja marsruudid](./7-bank-project/1-template-route/README.md) | Yohan | | 20 | [Space Game](./6-space-game/solution/README.md) | Mängu lõpetamine ja taaskäivitamine | Õpi mängu lõpetamise ja taaskäivitamise protsessidest, sh ressursside vabastamine ja muutujate lähtestamine | [Lõpetingimus](./6-space-game/6-end-condition/README.md) | Chris |
| 22 | [Pangarakendus](./7-bank-project/solution/README.md) | Sisse- ja registreerimisvormi loomine | Õpi vormide loomist ja valideerimisrutiinide käsitlemist | [Vormid](./7-bank-project/2-forms/README.md) | Yohan | | 21 | [Banking App](./7-bank-project/solution/README.md) | Veebirakenduse HTML mallid ja marsruutimine | Õpi, kuidas luua mitme leheküljega veebilehe arhitektuur, kasutades marsruutimist ja HTML malle | [HTML mallid ja marsruudid](./7-bank-project/1-template-route/README.md) | Yohan |
| 23 | [Pangarakendus](./7-bank-project/solution/README.md) | Andmete päringu ja kasutamise meetodid | Kuidas andmed sinu rakendusse ja rakendusest välja liiguvad, nende pärimine, salvestamine ja lõpetamine | [Andmed](./7-bank-project/3-data/README.md) | Yohan | | 22 | [Banking App](./7-bank-project/solution/README.md) | Sisselogimis- ja registreerimisvorm | Õpi vormide loomist ja valideerimise haldamist | [Vormid](./7-bank-project/2-forms/README.md) | Yohan |
| 24 | [Pangarakendus](./7-bank-project/solution/README.md) | Oleku haldamise mõisted | Õpi, kuidas sinu rakendus säilitab olekut ja kuidas seda programmiliselt hallata | [Oleku haldamine](./7-bank-project/4-state-management/README.md) | Yohan | | 23 | [Banking App](./7-bank-project/solution/README.md) | Andmete pärimine ja kasutamine | Kuidas andmed sinu rakendusse sisenevad ja sealt väljuvad, kuidas neid pärida, salvestada ja lõpetada | [Andmed](./7-bank-project/3-data/README.md) | Yohan |
| 25 | [Brauser/VScode Kood](../../8-code-editor) | Töötamine VScode'iga | Õpi koodi redaktori kasutamist | [Kasuta VScode koodi redaktorit](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 24 | [Banking App](./7-bank-project/solution/README.md) | Staatuse halduse kontseptsioonid | Õpi, kuidas rakenduses hallata ja programmiliselt kontrollida olekut | [Oleku haldus](./7-bank-project/4-state-management/README.md) | Yohan |
| 26 | [AI abistajad](./9-chat-project/README.md) | Töötamine tehisintellektiga | Õpi ehitama oma AI-abimeest | [AI abistaja projekt](./9-chat-project/README.md) | Chris | | 25 | [Browser/VScode Code](../../8-code-editor) | VScode kasutamine | Õpi kasutama koodi redaktorit | [VScode koodi redaktori kasutamine](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Tehisintellekti kasutamine | Õpi looma oma AI assistenti | [AI assistendi projekt](./9-chat-project/README.md) | Chris |
## 🏫 Pedagoogika ## 🏫 Pedagoogika
Meie õppekava on loodud, tuginedes kahele peamisele pedagoogilisele põhimõttele: Meie õppekava on loodud kahe peamise pedagoogilise printsiibi alusel:
* projektipõhine õpe * projektipõhine õpe
* sagedased küsimustikud * sagedased testid
Programm õpetab JavaScripti, HTML-i ja CSS-i aluseid ning tänapäevaste veebiarendajate kasutatavaid uusimaid tööriistu ja tehnikaid. Õpilastel on võimalus saada praktilisi kogemusi, ehitades trükimängu, virtuaalse terrariumi, keskkonnasõbraliku brauserilaiendi, kosmosevallutaja stiilis mängu ja äripangarakenduse. Sarja lõpuks on õpilastel kindel arusaam veebiarendusest.
> 🎓 Saad võtta selle õppekava esimesed õppetükid ka [õppeteekidena](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) Microsoft Learn'is! Programm õpetab JavaScripti, HTML-i ja CSS-i põhialuseid ning tänapäevaste veebiarendajate kasutatavaid uusimaid tööriistu ja meetodeid. Õpilased saavad praktilise kogemuse, luues tippimismängu, virtuaalse terrariumi, keskkonnasõbraliku brauserilaienduse, kosmosesissetungiva stiilis mängu ja pangarakenduse ettevõtetele. Sarja lõpus on õpilastel kindel arusaam veebiarendusest.
Sisu kooskõlastamine projektidega teeb õppimisprotsessi põnevamaks ja suurendab kontseptsioonide meeldejätmist. Kirjutasime ka mitmeid algajatele mõeldud JavaScripti põhialuseid tutvustavaid õppetükke, mida täiendas video "[Algajate sari: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videotutvustustest, mille autorite seas on ka mõned selle õppekava koostajad. > 🎓 Võid võtta selle õppekava esimesed õppetunnid Microsoft Learni [Õppeteekina](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon)!
Lisaks seab madala panusega küsimustik enne tundi õppija kavatsuse teema õppimiseks, samas kui teine küsimustik pärast tundi tagab parema meeldejätmise. Seda õppekava on loodud olema paindlik ja lõbus ning seda saab võtta tervikuna või osadena. Projektid algavad lihtsatest ja muutuvad järk-järgult keerukamaks 12-nädalase tsükli lõpuks. Sisuga, mis on kooskõlas projektidega, muutub õppeprotsess õpilastele kaasahaaravamaks ja kontseptsioonide meeldejätmine paremini toimivaks. Samuti kirjutasime mitu JavaScripti baasõppetundi, et tutvustada kontseptsioone, kombineerituna videoga "[Algajate sari: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videotundide kogumikust, mille autorid sellest õppekavast osa võtsid.
Kuna me tahtlikult ei tutvustanud JavaScripti raamistikke, et keskenduda esmalt veebiarendaja vajalikele põhioskustele enne raamistiku omandamist, oleks järgmine hea samm selle õppekava lõpetamiseks õppida Node.js-i teemadel veel ühe videokogumi abiga: "[Algajate sari: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". Lisaks seab madala panusega quiz enne tundi õpilase fookuse teema õppimisele, ja teine quiz tunni järel aitab veelgi teadmisi kinnistada. See õppekava on mõeldud paindlikuks ja lõbusaks ning seda saab võtta tervikuna või osade kaupa. Projektid algavad väikselt ja muutuvad 12-nädalase tsükli lõpuks järjest keerukamaks.
> Vaata meie käitumisreegleid [Code of Conduct](CODE_OF_CONDUCT.md) ja panustamisjuhiseid [Contributing](CONTRIBUTING.md). Ootame sinu konstruktiivset tagasisidet! Kuigi oleme teadlikult vältinud JavaScripti raamistikute tutvustamist, et keskenduda esmalt veebiarendajana vajalikele põhioskustele enne raamistikku omaksvõttu, oleks järgmine samm selle õppekava lõpetamisel õppida Node.js kohta teise videotundide sarja kaudu: "[Algajate sari: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Visiit meie [käitumisjuhisele](CODE_OF_CONDUCT.md) ja [panustamise](CONTRIBUTING.md) suunistele. Ootame sinu konstruktiivset tagasisidet!
## 🧭 Võimalus kasutada võrguühenduseta ## 🧭 Offline ligipääs
Seda dokumentatsiooni saab kasutada võrguühenduseta, kasutades [Docsify](https://docsify.js.org/#/). Forki see repo, [paigalda Docsify](https://docsify.js.org/#/quickstart) oma arvutisse ja siis repo juurkaustas sisesta käsk `docsify serve`. Veebisait esitatakse pordil 3000 sinu kohalikus arvutis: `localhost:3000`. Seda dokumentatsiooni saab kasutada võrguühenduseta, kasutades [Docsify](https://docsify.js.org/#/). Pane see repo fork ja paigalda oma arvutisse [Docsify](https://docsify.js.org/#/quickstart). Selles repo juurkaustas käivita `docsify serve`. Veebileht on kättesaadav pordi 3000 kaudu sinu kohaliku arvutis: `localhost:3000`.
## 📘 PDF ## 📘 PDF
Kõikide õppetükkide PDF on leitav [siin](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). Kõik õppetunnid koos PDF-ina on saadaval [siin](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Muud kursused
## 🎒 Teised kursused Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt:
Meie meeskond toodab ka teisi kursuseid! Vaata:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
[![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) [![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 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.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 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 / Agentid ### Azure / Edge / MCP / Agents
[![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) [![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 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) [![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 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) [![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)
@ -223,7 +221,7 @@ Meie meeskond toodab ka teisi kursuseid! Vaata:
--- ---
### Generatiivse tehisintellekti sari ### Generative AI Series
[![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) [![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)
[![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) [![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)
[![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) [![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)
@ -231,7 +229,7 @@ Meie meeskond toodab ka teisi kursuseid! Vaata:
--- ---
### Tuumikõpe ### Core Learning
[![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) [![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 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) [![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 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) [![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)
@ -242,7 +240,7 @@ Meie meeskond toodab ka teisi kursuseid! Vaata:
--- ---
### Copiloti sari ### Copilot Series
[![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 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 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 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 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) [![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)
@ -250,21 +248,21 @@ Meie meeskond toodab ka teisi kursuseid! Vaata:
## Abi saamine ## Abi saamine
Kui jääd kinni või sul on küsimusi tehisintellektirakenduste loomise kohta, liitu kaasõppijate ja kogenud arendajatega MCP aruteludes. See on toetav kogukond, kus küsimusi on teretulnud ning teadmisi jagatakse vabalt. Kui takerdud või sul on küsimusi tehisintellekti rakenduste loomise kohta, liitu teiste õppijate ja kogenud arendajatega MCP aruteludes. See on toetav kogukond, kus küsimused on teretulnud ja teadmisi jagatakse vabalt.
[![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)
Kui sul on toote tagasisidet või ehitamisel vigu, külasta: Kui sul on toote tagasisidet või tekib ehitamise käigus vigu, külastage:
[![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)
## Litsents ## Litsents
See hoidla on litsentseeritud MIT litsentsi alusel. Lisateabe saamiseks vaata faili [LICENSE](../../LICENSE). See hoidla on litsentseeritud MIT litsentsi alusel. Lisateabe saamiseks vaata [LICENSE](../../LICENSE) faili.
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Vastutusest vabanemine**: **Loaandmene**:
See dokument on tõlgitud kasutades tehisintellektil baseeruvat tõlketeenust [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi me püüame täpsust, palun arvestage, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument selle emakeeles tuleks pidada autoriteetseks allikaks. Kriitilise teabe puhul soovitatakse kasutada professionaalset inimtõlget. Meie ei vastuta selle tõlke kasutamisest tingitud arusaamatuste või valesti mõistmiste eest. See dokument on tõlgitud tehisintellekti tõlketeenuse [Co-op Translator](https://github.com/Azure/co-op-translator) abil. Kuigi püüame tagada tõlke täpsust, palun arvestage, et automatiseeritud tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument oma algkeeles tuleks pidada usaldusväärseks allikaks. Olulise info puhul soovitatakse kasutada professionaalse inimese tõlget. Me ei vastuta võimalike arusaamatuste ega valesti mõistmiste eest, mis võivad tekkida selle tõlke kasutamisest.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -0,0 +1,53 @@
# Microsofti Web-Dev-For-Beginners hoidla teejuht
**See hoidla pakub teejuhti veebiarenduse põhialuste õppimiseks, keskendudes JavaScriptile, HTML-ile ja CSS-ile. Õppekava on paindlik ning seda saab võtta tervikuna või osaliselt, 24 õppetunni jooksul, mis on jaotatud 12 nädala peale.**
## Peamised verstapostid
* **Nädalad 13:**
* Programmeerimiskeelte ja tööriistade tutvustus
* GitHubi põhialused
* Juurdepääsetavus
* JS põhialused: andmetüübid, funktsioonid ja meetodid
* Otsuste langetamine JS-is
* **Nädalad 46:**
* Massiivid ja tsüklid
* Terrarium: HTML praktiliselt
* CSS praktiliselt
* JavaScripti suletised
* DOM-i manipuleerimine
* **Nädalad 79:**
* Tüüpimismäng: sündmuspõhine programmeerimine
* Roheline brauserilaiendus: töö brauseritega
* Vormide koostamine, API kutsumine ja muutujate salvestamine kohalikku mällu
* Taustaprotsessid brauseris
* Veebisaidi jõudlus
* **Nädalad 1012:**
* Kosmosemäng: JavaScriptiga arenenum mänguarendus
* Joonistamine lõuendile
* Elementide liigutamine ekraanil
* Kokkupõrke tuvastamine
* Skorimise pidamine, mängu lõpetamine ja taaskäivitamine
* Panga rakendus: HTML mallid ja marsruudid veebirakenduses
* Sisselogimis- ja registreerimisvormi loomine
* Andmete pärimise ja kasutamise meetodid
* Oleku haldamise kontseptsioonid
## Õpitulemused
**Selle teejuhi läbimisel saavad õppijad praktilise kogemuse tüüpimismängu, virtuaalse terrariumi, keskkonnasõbraliku brauserilaienduse, kosmosevaenlaste stiilis mängu ja äripankade jaoks mõeldud panga rakenduse loomisel. Samuti omandavad nad põhjaliku arusaama veebiarenduse alustest.**
## Täiendavad ressursid
* See hoidla sisaldab rohkelt ressursse edasiseks õppimiseks, sealhulgas juhendeid, koodinäiteid ja väljakutseid.
* Microsoft Learn platvorm pakub mitmekesist valikut veebiarenduse kursusi ja õppeteid.
* Veebikogukonnad nagu Stack Overflow ja MDN Web Docs pakuvad väärtuslikku tuge ja ressursse veebiarendajatele.
**Loodan, et see teejuht aitab sind sinu veebiarenduse teekonnal!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Vastutusest loobumine**:
See dokument on tõlgitud kasutades tehisintellekti tõlketeenust [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi püüame tagada täpsust, tuleb arvestada, et automatiseeritud tõlgetes võivad esineda vead või ebatäpsused. Originaaldokument selle emakeeles tuleks pidada autoriteetset allikat. Olulise teabe puhul soovitatakse kasutada professionaalset inimtõlget. Me ei vastuta selle tõlkega seotud arusaamatuste või tõlgenduste eest.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-01-08T10:21:06+00:00", "translation_date": "2026-02-06T19:11:09+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "pcm" "language_code": "pcm"
}, },
@ -516,11 +516,17 @@
"language_code": "pcm" "language_code": "pcm"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T19:31:30+00:00", "translation_date": "2026-02-06T19:06:35+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "pcm" "language_code": "pcm"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T19:08:56+00:00",
"source_file": "Roadmap.md",
"language_code": "pcm"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2026-01-08T10:34:55+00:00", "translation_date": "2026-01-08T10:34:55+00:00",

@ -2,27 +2,27 @@
## Project Overview ## Project Overview
Dis na one educational curriculum repository wey dey teach web development basics to beginners dem. Di curriculum na full 12-week course wey Microsoft Cloud Advocates develop, get 24 practical lessons wey cover JavaScript, CSS, and HTML. Dis na educational curriculum repository wey dey teach web development basics to beginners. Di curriculum na comprehensive 12-week course wey Microsoft Cloud Advocates develop, e get 24 hand-on lessons wey cover JavaScript, CSS, and HTML.
### Key Components ### Key Components
- **Educational Content**: 24 organized lessons put inside project-based modules - **Educational Content**: 24 structured lessons wey dem arrange inside project-based modules
- **Practical Projects**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, and AI Chat Assistant - **Practical Projects**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, and AI Chat Assistant
- **Interactive Quizzes**: 48 quizzes get 3 questions each (before and after lesson assessments) - **Interactive Quizzes**: 48 quizzes wit 3 questions each (before and after lesson assessments)
- **Multi-language Support**: Automatic translations for more than 50 languages with GitHub Actions - **Multi-language Support**: Automated translations for 50+ languages through GitHub Actions
- **Technologies**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (for AI projects) - **Technologies**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (for AI projects)
### Architecture ### Architecture
- Educational repository wey get lesson-based structure - Educational repository wit lesson-based structure
- Each lesson folder get README, code examples, and solutions - Every lesson folder get README, code examples, and solutions
- Standalone projects dey different directories (quiz-app, different lesson projects) - Standalone projects dey separate directories (quiz-app, various lesson projects)
- Translation system dey use GitHub Actions (co-op-translator) - Translation system dey use GitHub Actions (co-op-translator)
- Documentation dey serve with Docsify and e dey available as PDF - Documentation dey served via Docsify and e available as PDF
## Setup Commands ## Setup Commands
Dis repository na mostly for educational content use. If you wan work with specific projects: Dis repository na mainly for educational content use. For work wit specific projects:
### Main Repository Setup ### Main Repository Setup
@ -48,7 +48,7 @@ cd 7-bank-project/api
npm install npm install
npm start # Start di API server npm start # Start di API server
npm run lint # Run ESLint npm run lint # Run ESLint
npm run format # Make e fine wit Prettier npm run format # Format wit Prettier
``` ```
### Browser Extension Projects ### Browser Extension Projects
@ -56,7 +56,7 @@ npm run format # Make e fine wit Prettier
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Follow di browser-specific extension loading instructions # Follow browser-specific extension loading instructions
``` ```
### Space Game Projects ### Space Game Projects
@ -82,27 +82,27 @@ python api.py
1. **Fork di repository** go your GitHub account 1. **Fork di repository** go your GitHub account
2. **Clone your fork** for your local machine 2. **Clone your fork** for your local machine
3. **Create new branch** for your changes dem 3. **Create new branch** for your changes
4. Change lesson content or code examples 4. Make changes for lesson content or code examples
5. Test any code changes for project directories wey concern am 5. Test any code changes for relevant project directories
6. Submit pull requests based on how to contribute guideline dem 6. Submit pull requests follow contribution guidelines
### For Learners ### For Learners
1. Fork or clone di repository 1. Fork or clone di repository
2. Enter lesson directories one by one 2. Go lesson directories one by one
3. Read README files wey dey each lesson 3. Read README files for every lesson
4. Finish pre-lesson quizzes for https://ff-quizzes.netlify.app/web/ 4. Complete pre-lesson quizzes for https://ff-quizzes.netlify.app/web/
5. Work through code examples wey dey lesson folders 5. Work through code examples for lesson folders
6. Finish assignments and challenges dem 6. Complete assignments and challenges
7. Do post-lesson quizzes 7. Take post-lesson quizzes
### Live Development ### Live Development
- **Documentation**: Run `docsify serve` for root (port 3000) - **Documentation**: Run `docsify serve` for root (port 3000)
- **Quiz App**: Run `npm run dev` inside quiz-app directory - **Quiz App**: Run `npm run dev` for quiz-app directory
- **Projects**: Use VS Code Live Server extension for HTML projects - **Projects**: Use VS Code Live Server extension for HTML projects
- **API Projects**: Run `npm start` inside correct API directories - **API Projects**: Run `npm start` for respective API directories
## Testing Instructions ## Testing Instructions
@ -111,81 +111,81 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Check for code style wahala npm run lint # Check for code style wahala
npm run build # Make sure say build work fine npm run build # Make sure say build go succeed
``` ```
### Bank API Testing ### Bank API Testing
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Check for code style wahala npm run lint # Check for code style mata
node server.js # Make sure server start no get error node server.js # Make sure say server start without wahala
``` ```
### General Testing Approach ### General Testing Approach
- Dis na educational repository wey no get full automated tests - Dis na educational repository wey no get full automated tests
- Manual testing focus on: - Manual testing focus on:
- Code examples dey run without wahala - Code examples run without errors
- Links inside documentation dey work well - Links for documentation dey work correct
- Project get successful builds - Project builds finish well
- Examples dey follow correct way dem - Examples follow best practices
### Pre-submission Checks ### Pre-submission Checks
- Run `npm run lint` inside directories wey get package.json - Run `npm run lint` for directories wey get package.json
- Check say markdown links valid - Make sure markdown links valid
- Test code examples for browser or Node.js - Test code examples for browser or Node.js
- Check say translations still keep proper structure - Check sey translations keep the proper structure
## Code Style Guidelines ## Code Style Guidelines
### JavaScript ### JavaScript
- Use modern ES6+ syntax - Use modern ES6+ syntax
- Follow standard ESLint configs wey projects give - Follow standard ESLint configs wey dey projects
- Use meaningful variable and function names so e go dey clear for learners - Use meaningful variable and function names for educational clarity
- Add comments to explain concepts for learners - Add comments wey explain concepts for learners
- Format with Prettier if e dey set - Format using Prettier if e dey configured
### HTML/CSS ### HTML/CSS
- Use semantic HTML5 elements - Semantic HTML5 elements
- Responsive design principles - Responsive design principles
- Clear class naming style - Clear class naming conventions
- Comments to explain CSS techniques for learners - Comments wey explain CSS techniques for learners
### Python ### Python
- PEP 8 style - PEP 8 style guidelines
- Clear, educational code examples - Clear, educational code examples
- Type hints where e fit help learners - Type hints where e fit help learning
### Markdown Documentation ### Markdown Documentation
- Clear heading order - Clear heading hierarchy
- Code blocks with language specification - Code blocks wey get language specification
- Links to more resources - Links to extra resources
- Screenshots and images dey `images/` directories - Screenshots and images inside `images/` folders
- Alt text for images for accessibility - Alt text for images for accessibility
### File Organization ### File Organization
- Lessons get number sequence (1-getting-started-lessons, 2-js-basics, etc.) - Lessons number one by one (1-getting-started-lessons, 2-js-basics, and so on)
- Each project get `solution/` and sometimes `start/` or `your-work/` directories - Every project get `solution/` and most times `start/` or `your-work/` folders
- Images dey inside lesson-specific `images/` folders - Images dey inside lesson-specific `images/` folders
- Translations dey `translations/{language-code}/` folders - Translations dey `translations/{language-code}/` folder arrangement
## Build and Deployment ## Build and Deployment
### Quiz App Deployment (Azure Static Web Apps) ### Quiz App Deployment (Azure Static Web Apps)
Quiz-app don set up for Azure Static Web Apps deployment: Di quiz-app configured for Azure Static Web Apps deployment:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Dey create dist/ folder npm run build # Dey create dist/ folder
# Dey deploy through GitHub Actions workflow wen e push go main # Dey deploy wit GitHub Actions workflow wen dem push for main
``` ```
Azure Static Web Apps configuration: Azure Static Web Apps configuration:
@ -203,21 +203,21 @@ npm run convert # Make PDF from docs
### Docsify Documentation ### Docsify Documentation
```bash ```bash
npm install -g docsify-cli # Install Docsify everywhere for system npm install -g docsify-cli # Install Docsify for everywhere for di system
docsify serve # Run am for localhost:3000 docsify serve # Run am for localhost:3000
``` ```
### Project-specific Builds ### Project-specific Builds
Every project directory fit get their own build process: Every project directory fit get im own build process:
- Vue projects: `npm run build` go create production bundles - Vue projects: `npm run build` dey create production bundles
- Static projects: No build step, serve files direct - Static projects: No build step, dem just serve files directly
## Pull Request Guidelines ## Pull Request Guidelines
### Title Format ### Title Format
Use clear, descriptive titles wey talk which area you change: Use clear, descriptive titles wey show the change area:
- `[Quiz-app] Add new quiz for lesson X` - `[Quiz-app] Add new quiz for lesson X`
- `[Lesson-3] Fix typo for terrarium project` - `[Lesson-3] Fix typo for terrarium project`
- `[Translation] Add Spanish translation for lesson 5` - `[Translation] Add Spanish translation for lesson 5`
@ -228,49 +228,49 @@ Use clear, descriptive titles wey talk which area you change:
Before you submit PR: Before you submit PR:
1. **Code Quality**: 1. **Code Quality**:
- Run `npm run lint` for project directories wey you change - Run `npm run lint` for projects wey di change affect
- Fix all lint errors and warnings - Fix all lint errors and warnings
2. **Build Verification**: 2. **Build Verification**:
- Run `npm run build` if e concern you - Run `npm run build` if e dey necessary
- Confirm say no build error - Make sure no build errors
3. **Link Validation**: 3. **Link Validation**:
- Test all markdown links - Test all markdown links
- Confirm image references dey work - Confirm image references dey work
4. **Content Review**: 4. **Content Review**:
- Proofread spelling and grammar - Proofread grammar and spelling
- Confirm code examples correct and educational - Make sure code examples correct and educational
- Confirm translations keep original meaning - Confirm translations keep original meaning
### Contribution Requirements ### Contribution Requirements
- You must agree to Microsoft CLA (automatic check on your first PR) - Agree to Microsoft CLA (di check na automatic for first PR)
- Follow the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Follow [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- See [CONTRIBUTING.md](./CONTRIBUTING.md) for full guidelines - See [CONTRIBUTING.md](./CONTRIBUTING.md) for full guidelines
- Put issue numbers for PR description if e concern am - Mention issue numbers for PR description if e apply
### Review Process ### Review Process
- Maintainers and community go review PRs - PR dem dey reviewed by maintainers and community
- Educational clarity na priority - Educational clarity na top priority
- Code examples must follow correct best practices - Code examples suppose follow correct best practices
- Translations go get accuracy and cultural check - Translations dey reviewed for accuracy and cultural fit
## Translation System ## Translation System
### Automated Translation ### Automated Translation
- Uses GitHub Actions with co-op-translator workflow - Uses GitHub Actions wit co-op-translator workflow
- Translate to over 50 languages automatically - Translates automatically to 50+ languages
- Source files dey main directories - Source files dey main directories
- Translated files dey `translations/{language-code}/` folders - Translated files dey `translations/{language-code}/` directories
### Adding Manual Translation Improvements ### Adding Manual Translation Improvements
1. Find file for `translations/{language-code}/` 1. Find di file for `translations/{language-code}/`
2. Make improvements but keep structure proper 2. Make improvements but keep structure
3. Make sure code examples still dey work 3. Make sure code examples still dey work
4. Test any localized quiz content 4. Test any localized quiz content
@ -293,62 +293,62 @@ CO_OP_TRANSLATOR_METADATA:
### Common Issues ### Common Issues
**Quiz app no fit start**: **Quiz app no dey start**:
- Check Node.js version (v14+ na better) - Check Node.js version (v14+ na recommended)
- Delete `node_modules` and `package-lock.json`, then run `npm install` again - Delete `node_modules` and `package-lock.json`, run `npm install` again
- Check if port dey busy (Vite dey use port 5173 by default) - Check for port conflicts (default: Vite dey use port 5173)
**API server no start**: **API server no go start**:
- Check Node.js version >=10 - Confirm Node.js version dey okay (node >=10)
- Make sure port no busy - Check if port don already dey used
- Ensure all dependencies dey install with `npm install` - Make sure all dependencies install with `npm install`
**Browser extension no load**: **Browser extension no go load**:
- Confirm manifest.json correct format - Make sure manifest.json get correct format
- Check browser console for errors - Check browser console for errors
- Follow browser-specific extension install instruction - Follow browser-specific extension installation instructions
**Python chat project wahala**: **Python chat project wahala**:
- Make sure OpenAI package install: `pip install openai` - Make sure OpenAI package install: `pip install openai`
- Confirm GITHUB_TOKEN environment variable set - Confirm sey GITHUB_TOKEN environment variable dey set
- Check GitHub Models access permissions - Check GitHub Models access permissions
**Docsify no dey serve docs**: **Docsify no dey serve docs**:
- Install docsify-cli globally: `npm install -g docsify-cli` - Install docsify-cli globally: `npm install -g docsify-cli`
- Run from root directory of repo - Run from repository root directory
- Confirm `docs/_sidebar.md` dey - Check sey `docs/_sidebar.md` dey
### Development Environment Tips ### Development Environment Tips
- Use VS Code with Live Server extension for HTML projects - Use VS Code wit Live Server extension for HTML projects
- Install ESLint and Prettier extensions for consistent format - Install ESLint and Prettier extensions for consistent formatting
- Use browser DevTools for debug JavaScript - Use browser DevTools for debugging JavaScript
- For Vue projects, install Vue DevTools browser extension - For Vue projects, install Vue DevTools browser extension
### Performance Considerations ### Performance Considerations
- Plenty translated files (50+ languages) mean big full clones - Plenty translated files (50+ languages) go make full clones big
- Use shallow clone if you dey work only on content: `git clone --depth 1` - Use shallow clone if you dey only work on content: `git clone --depth 1`
- Exclude translations from searches if you dey work on English content - Exclude translations from searches when you dey work on English content
- Build fit slow first time (npm install, Vite build) - Build processes fit be slow for first run (npm install, Vite build)
## Security Considerations ## Security Considerations
### Environment Variables ### Environment Variables
- No put API keys for repository commit - API keys no suppose ever commit to repository
- Use `.env` files (dem dey already `.gitignore`) - Use `.env` files (dem don already put am for `.gitignore`)
- Document needed environment variables for project READMEs - Document the required environment variables in project READMEs
### Python Projects ### Python Projects
- Use virtual environments: `python -m venv venv` - Use virtual environments: `python -m venv venv`
- Keep dependencies updated - Keep dependencies updated
- GitHub tokens get to get minimal permissions - GitHub tokens suppose get only minimum permissions
### GitHub Models Access ### GitHub Models Access
- Personal Access Tokens (PAT) needed for GitHub Models - Personal Access Tokens (PAT) na requirement for GitHub Models
- Store tokens as environment variables - Store tokens as environment variables
- Never commit tokens or credentials - Never commit tokens or credentials
@ -356,52 +356,53 @@ CO_OP_TRANSLATOR_METADATA:
### Target Audience ### Target Audience
- Complete beginners for web development - Complete beginners to web development
- Students and self-learners - Students and self-learners
- Teachers use this curriculum for classroom - Teachers wey dey use di curriculum for classrooms
- Content designed for accessibility and gradual skill build up - Content dey designed for accessibility and gradual skill building
### Educational Philosophy ### Educational Philosophy
- Project-based learning way - Project-based learning approach
- Frequent knowledge checks (quizzes) - Frequent knowledge checks (quizzes)
- Hands-on coding exercises - Hands-on coding exercises
- Real-world application examples - Real-world example applications
- Focus on fundamentals before frameworks - Focus on fundamentals before frameworks
### Repository Maintenance ### Repository Maintenance
- Active community of learners and contributors - Active community of learners and contributors
- Regular updates to dependencies and content - Regular updates to dependencies and content
- Maintainers dey monitor issues and discussions - Issues and discussions dey monitored by maintainers
- Translation updates automatic with GitHub Actions - Translation updates automated with GitHub Actions
### Related Resources ### Related Resources
- [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Microsoft Learn modules](https://docs.microsoft.com/learn/)
- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) - [Student Hub resources](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recommended for learners - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recommended for learners
- Additional courses: Generative AI, Data Science, ML, IoT curricula available - Additional courses: Generative AI, Data Science, ML, IoT curricula dey available
### Working with Specific Projects ### Working with Specific Projects
For detailed instructions for each project, check README files inside: For detailed instructions on individual projects, check README files for:
- `quiz-app/README.md` - Vue 3 quiz application - `quiz-app/README.md` - Vue 3 quiz application
- `7-bank-project/README.md` - Banking app with authentication - `7-bank-project/README.md` - Banking application wit authentication
- `5-browser-extension/README.md` - Browser extension development - `5-browser-extension/README.md` - Browser extension development
- `6-space-game/README.md` - Canvas-based game development - `6-space-game/README.md` - Canvas-based game development
- `9-chat-project/README.md` - AI chat assistant project - `9-chat-project/README.md` - AI chat assistant project
### Monorepo Structure ### Monorepo Structure
Though e no be traditional monorepo, dis repository get many independent projects: Even though no be traditional monorepo, dis repository get many independent projects:
- Each lesson dey self-contained - Every lesson na self-contained
- Projects no dey share dependencies - Projects no dey share dependencies
- You fit work for one project without disturb others - You fit work on individual projects without affecting others
- Clone whole repo if you want full curriculum experience - Clone di whole repo if you want full curriculum experience
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Disclaimer**: Dis document na translation we dem use AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator) do am. Even though we dey try make am correct, abeg sabi say machine translation fit get some errors or mistakes. The original document wey dey im own language na di correct one to trust. If na important info, make you use professional human translation. We no go responsible for any wahala or misunderstanding wey fit happen because you use dis translation. **Disclaimer**:
Dis document don translate wit AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we dey try make am correct, abeg sabi say automated translations fit get mistakes or no be 100% accurate. Di original document wey e be for im own language na di correct one. For important info, e better make human professional translate am. We no go take any blame if person no understand well or if dem misunderstand tins wey come from dis translation.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -1,61 +1,41 @@
[![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)
[![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/)
[![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)
# Web Development for Beginners - A Curriculum # Web Development for Beginners - A Curriculum
Learn di fundamentals of web development wit our 12-week comprehensive course by Microsoft Cloud Advocates. Each of di 24 lessons go deep into JavaScript, CSS, and HTML through hands-on projects like terrariums, browser extensions, and space games. Join quizzes, discussions, and practical assignments. Improve your skills and sabi well well wit our effective project-based method. Start your coding journey today! Learn di fundamentals of web development wit our 12-week complete course by Microsoft Cloud Advocates. Each of di 24 lessons go deep into JavaScript, CSS, and HTML through hands-on projects like terrariums, browser extensions, and space games. Engage wit quizzes, discussions, and practical assignments. Improve your skills and make sure sey you sabi well wit our good project-based way to learn. Start your coding journey today!
Join di Azure AI Foundry Discord Community Join di Azure AI Foundry Discord Community
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) Follow these steps to start to use these resources:
Follow dis steps to start to use these resources:
1. **Fork di Repository**: Click [![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. **Fork di Repository**: Click [![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. **Clone di Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Clone di Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Join Di Azure AI Foundry Discord and meet experts and other developers**](https://discord.com/invite/ByRwuEEgH4) 3. [**Join Di Azure AI Foundry Discord and meet experts and fellow developers**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Multi-Language Support ### 🌐 Multi-Language Support
#### Supported via GitHub Action (Automated & Always Up-to-Date) #### Supported via GitHub Action (Automated & Always Up-to-Date)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> > **Prefer to Clone Locally?**
[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) | [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](./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)
> **You go prefer to Clone Locally?** > Dis repository get 50+ language translations wey go make di download size big. To clone without translations, use sparse checkout:
> Dis repository get 50+ language translations wey increase di download size well well. To clone without translations, use sparse checkout:
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> Dis go give you everything wey you need make you complete di course with faster download. > Dis go give you everything you need to finish di course faster.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**If you want make we support any other translation languages dem dey listed [here](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) **If you want make we add more translation languages, dem dey listed [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
#### 🧑‍🎓 _You be student?_ #### 🧑‍🎓 _You be student?_
Go visit [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) where you go find beginner resources, Student packs and even ways to get free certificate voucher. Na dis page you go dey bookmark and dey check from time to time as we dey switch content every month. Visit [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) wey get beginner resources, Student packs and even ways to get free certificate voucher. This na the page wey you go want bookmark and check every time because we dey change content every month.
### 📣 Announcement - New GitHub Copilot Agent mode challenges to complete! ### 📣 Announcement - New GitHub Copilot Agent mode challenges to complete!
New Challenge don add, find "GitHub Copilot Agent Challenge 🚀" for most chapters. Na new challenge wey you fit complete using GitHub Copilot and Agent mode. If you never use Agent mode before e fit no just generate text but e fit also create and edit files, run commands and more. New Challenge don add, look for "GitHub Copilot Agent Challenge 🚀" for most chapters. Na new challenge for you to complete using GitHub Copilot and Agent mode. If you never use Agent mode before e fit no only generate text but also fit create and edit files, run commands and more.
### 📣 Announcement - _New Project to build using Generative AI_ ### 📣 Announcement - _New Project to build using Generative AI_
New AI Assistant project don add, check am [project](./9-chat-project/README.md) New AI Assistant project just add, check am [project](./9-chat-project/README.md)
### 📣 Announcement - _New Curriculum_ on Generative AI for JavaScript just release ### 📣 Announcement - _New Curriculum_ on Generative AI for JavaScript just release
@ -66,71 +46,70 @@ Visit [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) to start!
![Background](../../translated_images/pcm/background.148a8d43afde5730.webp) ![Background](../../translated_images/pcm/background.148a8d43afde5730.webp)
- Lessons wey cover everything from basics to RAG. - Lessons wey cover everything from basics to RAG.
- Interact wit historic characters using GenAI and our companion app. - Talk to historical characters using GenAI and our companion app.
- Fun and interesting story, you go dey time travel! - Fun and interesting story, you go dey time travel!
![character](../../translated_images/pcm/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/pcm/character.5c0dd8e067ffd693.webp)
Each lesson get assignment to complete, knowledge check and challenge to guide you to learn topics like: Every lesson get assignment to finish, knowledge check and challenge to guide you for learning topics like:
- Prompting and prompt engineering - Prompting and prompt engineering
- Text and image app generation - Text and image app generation
- Search apps - Search apps
Visit [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) to start! Visit [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) to start!
## 🌱 How to Start ## 🌱 Getting Started
> **Teachers**, we don put [some suggestions](for-teachers.md) on how to use dis curriculum. We go like hear your feedback [for our discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Teachers**, we get [some suggestions](for-teachers.md) on how to take use this curriculum. We go like make you give feedback [for our discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Learners](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, for each lesson, start with pre-lecture quiz then read lecture material well, complete different activities and check your understanding wit post-lecture quiz. **[Learners](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, for each lesson, start wit pre-lecture quiz and follow am to read di lecture material, finish di activities and check your understanding wit post-lecture quiz.
To make your learning better, connect wit other learners so una fit work on projects together! Discussions dey encouraged for our [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) where our moderators team go dey available to answer your questions. To make your learning better, join wit your peers to work on projects together! Discussions dey encouraged for our [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) where our moderators go dey available to answer your questions.
To continue your education, we recommend make you explore [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for extra study materials. To continue your education, we dey recommend say you check [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for more study materials.
### 📋 How to set up your environment ### 📋 Setting up your environment
Dis curriculum get development environment wey don ready! As you start you fit choose run di curriculum for [Codespace](https://github.com/features/codespaces/) (_na browser-based, no installation needed environment_), or locally for your computer using text editor like [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Dis curriculum get development environment ready! As you start, you fit choose run di curriculum for [Codespace](https://github.com/features/codespaces/) (_na browser-based, no need install environment_), or locally for your computer using text editor like [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Create your repository #### Create your repository
To fit save your work easy, e good make you create your own copy of dis repository. You fit do am by clicking di **Use this template** button for top of di page. E go create new repository inside your GitHub account with copy of di curriculum. To make am easy for you to save your work, e good make you create your own copy of dis repository. You fit do am by clicking di **Use this template** button at di top of di page. E go create new repository for your GitHub account with copy of di curriculum.
Follow these steps: Follow these steps:
1. **Fork the Repository**: Click "Fork" button for di top-right corner of dis page. 1. **Fork the Repository**: Click on di "Fork" button for top-right corner of dis page.
2. **Clone the Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Clone the Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Running di curriculum inside Codespace #### Running di curriculum in a Codespace
For your copy of dis repository wey you create, click **Code** button then select **Open with Codespaces**. E go create new Codespace for you to work. For your copy of dis repository wey you create, click di **Code** button and select **Open with Codespaces**. E go create new Codespace for you to work.
![Codespace](../../translated_images/pcm/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/pcm/createcodespace.0238bbf4d7a8d955.webp)
#### Run di curriculum locally on your computer #### Running di curriculum locally on your computer
To run dis curriculum locally for your computer, you need text editor, browser and command line tool. Our first lesson, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), go guide you through different options for all these tools to choose the one wey suit you pass. To run dis curriculum locally for your computer, you go need text editor, browser and command line tool. Our first lesson, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), go show you options for each of these tools to pick wey fit you best.
We recommend make you use [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) as your editor, e get built-in [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). You fit download Visual Studio Code [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Our advice na to use [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) as your editor, wey get inside [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). You fit download Visual Studio Code [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Clone your repository to your computer. You fit do am by clicking di **Code** button and copy di URL:
1. Clone your repository to your computer. You fit do am by clicking **Code** button and copy the URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Then, open [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) inside [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) and run dis command, change `<your-repository-url>` to di URL wey you just copy: Then, open [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) inside [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) and run dis command, replace `<your-repository-url>` with di URL wey you just copy:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Open di folder for Visual Studio Code. You fit do dis by clicking **File** > **Open Folder** and select di folder wey you just clone. 2. Open di folder for Visual Studio Code. You fit do dis by click **File** > **Open Folder** and choose di folder wey you just clone.
> Recommended Visual Studio Code extensions: > Recommended Visual Studio Code extensions:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - make you fit preview HTML pages inside Visual Studio Code > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - for preview HTML pages inside Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - to help you write code quick > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - to help you write code quick quick
## 📂 Each lesson get: ## 📂 Each lesson get:
@ -140,65 +119,66 @@ Then, open [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_
- written lesson - written lesson
- for project-based lessons, step-by-step guides on how to build di project - for project-based lessons, step-by-step guides on how to build di project
- knowledge checks - knowledge checks
- one challenge - challenge
- supplemental reading - supplemental reading
- assignment - assignment
- [post-lesson quiz](https://ff-quizzes.netlify.app/web/) - [post-lesson quiz](https://ff-quizzes.netlify.app/web/)
> **Note about quizzes**: All di quizzes dey inside di Quiz-app folder, get 48 quizzes with three questions each. Dem dey available [here](https://ff-quizzes.netlify.app/web/) di quiz app fit run for local or you fit deploy am go Azure; just follow di instruction inside `quiz-app` folder. > **One note about quizzes**: All quizzes dey inside Quiz-app folder, total na 48 quizzes with three questions each. Dem dey available [here](https://ff-quizzes.netlify.app/web/), di quiz app fit run locally or you fit deploy am for Azure; follow di instruction inside `quiz-app` folder.
## 🗃️ Lessons ## 🗃️ Lessons
| | Project Name | Concepts Taught | Learning Objectives | Linked Lesson | Author | | | Project Name | Concepts Taught | Learning Objectives | Linked Lesson | Author |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn di basic foundation behind most programming languages and about software wey dey help professional developers do dia work | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn di basic foundation wey most programming languages get and about software wey dey help professional developers do dia work | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | Basics of GitHub, includes working with a team | How to use GitHub for your project, how to collaborate with others on code | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Getting Started | Basics of GitHub, including how to work with team | How to use GitHub for your project, how to collaborate with others on code base | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Accessibility | Learn di basics of web accessibility | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Getting Started | Accessibility | Learn di basics of web accessibility | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | JavaScript Data Types | Learn di basics of JavaScript data types | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | JS Basics | JavaScript Data Types | Basics of JavaScript data types | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | Functions and Methods | Learn about functions and methods to manage how your app logic dey flow | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | | 05 | JS Basics | Functions and Methods | Learn about functions and methods to manage how application logic dey flow | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Basics | Making Decisions with JS | Learn how to create conditions for your code using decision-making methods | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | JS Basics | Making Decisions with JS | Learn how to create condition inside your code using decision-making methods | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | Arrays and Loops | Work with data using arrays and loops inside JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | JS Basics | Arrays and Loops | Work with data using arrays and loops in JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in Practice | Build di HTML to create online terrarium, focus on building di layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in Practice | Build di HTML to create online terrarium, dey focus on building layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in Practice | Build di CSS to style the online terrarium, focus on basics of CSS including making di page responsive | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in Practice | Build di CSS to style di online terrarium, focus on basics of CSS including making di page responsive | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build di JavaScript make di terrarium work as drag/drop interface, focus on closures and DOM manipulation | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build di JavaScript to make terrarium work as drag/drop interface, focus on closures and DOM manipulation | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Build a Typing Game | Learn how to use keyboard events to run di logic of your JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Typing Game](./4-typing-game/solution/README.md) | Build a Typing Game | Learn how to use keyboard events to run the logic of your JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Working with Browsers | Learn how browsers dey work, their history, and how to scaffold first elements of browser extension | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Working with Browsers | Learn how browsers work, dia history, and how to scaffold di first elements of a browser extension | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Building a form, calling an API and storing variables in local storage | Build JavaScript elements of your browser extension to call API using variables wey dem store local | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Building form, dey call API and storing variables inside local storage | Build JavaScript elements of your browser extension to call API using variables wey dey store inside local storage | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Background processes in the browser, web performance | Use browser background processes to manage extension icon; learn about web performance and some optimizations to make | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Background processes for browser, web performance | Use browser background processes to manage extension icon; learn about web performance and some optimization to improve am | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | More Advanced Game Development with JavaScript | Learn about Inheritance using Classes and Composition, and di Pub/Sub pattern, to prepare for building game | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Space Game](./6-space-game/solution/README.md) | More Advanced Game Development with JavaScript | Learn about Inheritance using both Classes and Composition and Pub/Sub pattern, to prepare for building game | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Drawing to canvas | Learn about Canvas API, wey dem dey use to draw things for screen | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Space Game](./6-space-game/solution/README.md) | Drawing to canvas | Learn about di Canvas API wey dem dey use to draw elements for screen | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Moving elements around the screen | Discover how elements fit move using cartesian coordinates and Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Space Game](./6-space-game/solution/README.md) | Moving elements around di screen | Discover how elements fit move using Cartesian coordinates and di Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Collision detection | Make elements collide and react to each other using keypresses, add cooldown function to keep di game performance | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Space Game](./6-space-game/solution/README.md) | Collision detection | Make elements collide and react to each other with keypresses and put cooldown function to make sure game performance pep | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Keeping score | Do math calculations based on di game status and performance | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Space Game](./6-space-game/solution/README.md) | Keeping score | Do math calculations based on di game status and performance | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Ending and restarting the game | Learn about how to end and restart di game, including how to clean assets and reset variable values | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Space Game](./6-space-game/solution/README.md) | Ending and restarting di game | Learn about ending and restarting game, including cleaning up assets and resetting variable values | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML Templates and Routes in a Web App | Learn how to create scaffold for multipage website architecture using routing and HTML templates | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Banking App](./7-bank-project/solution/README.md) | HTML Templates and Routes for Web App | Learn how to create scaffold of multipage website architecture using routing and HTML templates | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Build a Login and Registration Form | Learn about building forms and handling validation routines | [Forms](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Banking App](./7-bank-project/solution/README.md) | Build Login and Registration Form | Learn how to build forms and handle validation routines | [Forms](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Methods of Fetching and Using Data | Learn how data flow inside and outside your app, how to fetch am, store am, and delete am | [Data](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banking App](./7-bank-project/solution/README.md) | Methods of Fetching and Using Data | How data dey flow in and out of your app, how to fetch am, store am, and discard am | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Concepts of State Management | Learn how your app dey keep state and how to manage am programmatically | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banking App](./7-bank-project/solution/README.md) | Concepts of State Management | Learn how your app dey keep state and how to manage am programmatically | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Working with VScode | Learn how to use code editor| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Browser/VScode Code](../../8-code-editor) | Working with VScode | Learn how to Using code editor| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Working with AI | Learn how to build your own AI assistant | [AI Assistant project](./9-chat-project/README.md) | Chris | | 26 | [AI Assistants](./9-chat-project/README.md) | Working with AI | Learn how to build your own AI assistant | [AI Assistant project](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogy ## 🏫 Pedagogy
Our curriculum design get two main pedagogy principles: Our curriculum design take two main pedagogy principles seriously:
* project-based learning * project-based learning
* frequent quizzes * frequent quizzes
Di program teach di fundamentals of JavaScript, HTML, and CSS, plus di newest tools and techniques wey web developers today dey use. Students go get chance to build hands-on experience by building typing game, virtual terrarium, eco-friendly browser extension, space-invader-style game, and banking app for businesses. By di end of di series, students go sabi well well about web development. Di program dey teach fundamentals of JavaScript, HTML, and CSS, plus di latest tools and techniques wey web developers dey use now. Students go fit develop hands-on experience by building typing game, virtual terrarium, eco-friendly browser extension, space-invader style game, and banking app for businesses. By the end of the course, students go get solid understanding of web development.
> 🎓 You fit take di first few lessons in dis curriculum as [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) for Microsoft Learn!
> 🎓 You fit take first few lessons for dis curriculum as a [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) for Microsoft Learn! By making sure content match projects, the process go make learning more interesting for students and concepts go remain for mind well well. We also write some starter lessons for JavaScript basics to introduce concepts, plus video from "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collection of video tutorials, some authors from the videos join to help design this curriculum.
By making sure content dey align with projects, processes go dey more interesting for students and concept retention go stronger. We also write small starter lessons on JavaScript basics to introduce concepts, plus one video from "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" video tutorials, some authors for the curriculum self. Plus, low-stakes quiz before class dey set student mindset for learning topic, and second quiz after class make sure say dem remember well. This curriculum na flexible and fun one wey you fit do as whole or part. Projects start small and go get more complex by 12-week cycle end.
Plus, one low-stakes quiz before class set mind for student to learn topic, then second quiz after class to make sure retention. This curriculum design make e flexible and fun, fit take all or part. Projects dey start small and grow more complex as di 12-week cycle dey end. Even though we no bother to introduce JavaScript frameworks so that we go focus on basic skills wey web developers need before use framework, good next step after dis curriculum na to learn Node.js with another video series: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Even though we no put JavaScript frameworks to focus on basic skills wey web developer must get before dem start framework, next step after dis curriculum fit be to learn Node.js with other videos: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". > Visit our [Code of Conduct](CODE_OF_CONDUCT.md) and [Contributing](CONTRIBUTING.md) guidelines. We welcome your constructive feedback!
> Visit our [Code of Conduct](CODE_OF_CONDUCT.md) and [Contributing](CONTRIBUTING.md) rules. We dey always happy to get your proper feedback!
## 🧭 Offline access ## 🧭 Offline access
You fit run this documentation offline by using [Docsify](https://docsify.js.org/#/). Fork this repo, [install Docsify](https://docsify.js.org/#/quickstart) on your local machine, then for root folder of this repo, type `docsify serve`. Di website go dey serve for port 3000 for your localhost: `localhost:3000`. You fit run dis documentation offline by using [Docsify](https://docsify.js.org/#/). Fork this repo, [install Docsify](https://docsify.js.org/#/quickstart) for your local machine, then for root folder of dis repo, type `docsify serve`. Di website go dey serve for port 3000 for your localhost: `localhost:3000`.
## 📘 PDF ## 📘 PDF
@ -212,7 +192,7 @@ Our team dey produce oda courses! Make you check am out:
### LangChain ### LangChain
[![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) [![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 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.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 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 / Agents ### Azure / Edge / MCP / Agents
@ -250,21 +230,21 @@ Our team dey produce oda courses! Make you check am out:
## Getting Help ## Getting Help
If you jam bodi wey dey struggle or get any question about how to build AI apps. Join di other learners and beta developers wey dey talk about MCP. Na one supportive community wey dey always welcome question and dey share knowledge freely. If you jam or get any question about how to build AI apps. Come join other learners and developers wey sabi well well for talks about MCP. Na supportive community wey dey welcome questions and dem share knowledge freely.
[![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)
If you get product feedback or errors wey dey happen as you dey build, visit: If you get product feedback or you see error as you dey build, visit:
[![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)
## License ## License
Dis repository get MIT license. Make you check di [LICENSE](../../LICENSE) file to sabi more. Dis repository get MIT license. See the [LICENSE](../../LICENSE) file for more info.
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Disclaimer**: **Disclaimer**:
Dis document na translation wey AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator) do. Even though we dey try make am correct, abeg sabi say automated translations fit get some errors or mistake. The original document wey e be for im own language na the correct source. For important matter, e good make professional human translation dey. We no go responsible for any wrong understanding or wahala wey fit happen because of dis translation. Dis document don translate wit AI translation service wey dem dey call [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we dey try make am correct, abeg mek you sabi say machine translation fit get some errors or wrong tins. The og document for im original language na di correct one wey you suppose trust. If na important info, better make person wey sabi translate am well do the work. We no go take responsibility if pesin no understand or misunderstand tins because of dis translation.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -0,0 +1,53 @@
# Roadmap for Microsoft's Web-Dev-For-Beginners Repository
**Dis repository dey provide roadmap for learn web development fundamentals with focus on JavaScript, HTML, and CSS. Di curriculum flexible and you fit take am either fully or partially, wit 24 lessons wey spread across 12 weeks.**
## Key Milestones
* **Weeks 1-3:**
* Introduction to programming languages and tools of di trade
* Basics of GitHub
* Accessibility
* JS basics: data types, functions and methods
* Making decisions wit JS
* **Weeks 4-6:**
* Arrays and loops
* Terrarium: HTML in practice
* CSS in practice
* JavaScript closures
* DOM manipulation
* **Weeks 7-9:**
* Typing Game: Event-driven programming
* Green Browser Extension: Working wit browsers
* Building a form, calling an API and storing variables in local storage
* Background processes in di browser
* Web performance
* **Weeks 10-12:**
* Space Game: More advanced game development wit JavaScript
* Drawing to canvas
* Moving elements around di screen
* Collision detection
* Keeping score, ending and restarting di game
* Banking App: HTML Templates and Routes in a Web App
* Building a Login and Registration Form
* Methods of Fetching and Using Data
* Concepts of State Management
## Learning Outcomes
**By completing dis roadmap, students go gain hands-on experience building typing game, virtual terrarium, eco-friendly browser extension, space-invader-style game, and banking app for businesses. Dem go also develop solid understanding of web development fundamentals.**
## Additional Resources
* Dis repository get plenti resources for further learning, including tutorials, code examples, and challenges.
* Microsoft Learn platform get plenty web development courses and learning paths.
* Online communities like Stack Overflow and di MDN Web Docs dey provide valuable support and resources for web developers.
**I hope dis roadmap go help you for your web development journey!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Disclaimer**:
Dis dokument don translate wit AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we try make am correct, abeg sabi say automated translations fit get error or mistake. Di original dokument wey e dey for im own language na di real correct one. For important tin dem, e better make human professional translate am. We no go responsible if pipo talk wrong or confuse because of dis translation.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-01-08T10:23:14+00:00", "translation_date": "2026-02-06T19:12:29+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "te" "language_code": "te"
}, },
@ -516,11 +516,17 @@
"language_code": "te" "language_code": "te"
}, },
"README.md": { "README.md": {
"original_hash": "490c83786552d7fab6390991517bef09", "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc",
"translation_date": "2026-01-29T19:34:51+00:00", "translation_date": "2026-02-06T19:08:29+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "te" "language_code": "te"
}, },
"Roadmap.md": {
"original_hash": "28bf6185fd7f27b62ddc210514366192",
"translation_date": "2026-02-06T19:09:11+00:00",
"source_file": "Roadmap.md",
"language_code": "te"
},
"SECURITY.md": { "SECURITY.md": {
"original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
"translation_date": "2026-01-08T10:35:05+00:00", "translation_date": "2026-01-08T10:35:05+00:00",

@ -1,282 +1,282 @@
# AGENTS.md # AGENTS.md
## Project Overview ## ప్రాజెక్ట్ అవలోకనం
ఇది ఆరంభకులకు వెబ్ అభివృద్ధి ప్రాథమికాలను బోధించడానికి ఒక విద్యా పాఠ్యక్రమ సంచయ కోశం. ఈ పాఠ్యపథకం మైక్రోసాఫ్ట్ క్లౌడ్ ఆక్టివ్‌లు అభివృద్ధి చేసిన 12-వారాల సమగ్ర కోర్సు, జావాస్క్రిప్ట్, CSS, మరియు HTML ను కవర్ చేసే 24 ప్రాయోగిక పాఠాలు కలిగి ఉంటుంది. ఇది ప్రారంభానికి వెబ్ డెవలప్‌మెంట్ మూలబూతులను నేర్పడానికి విద్యాసంబంధిత పాఠ్యక్రమ రిపోజిటరీ. ఈ పాఠ్యక్రమం Microsoft Cloud Advocates అభివృద్ధి చేసిన పూర్తి 12 వారాల కోర్సు, 24 ప్రాక్టికల్ పాఠాలతో JavaScript, CSS, మరియు HTML నొక్కి చెంది ఉంటుంది.
### Key Components ### ముఖ్య భాగాలు
- **శిక్షణా విషయాలు**: ప్రాజెక్ట్-ఆధారిత మాడ్యూల్స్ లో 24 క్రమబద్ధీకరించిన పాఠాలు - **విద్యాసంబంధిత కంటెంట్**: 24 నిర్మిత పాఠాలు, ప్రాజెక్ట్-ఆధారిత మాడ్యూల్స్‌లో క్రమబద్ధీకరించబడ్డాయి
- **ప్రాయోగిక ప్రాజెక్టులు**: టెరరియం, టైపింగ్ ఆట, బ్రౌజర్ ఎక్స్‌టెన్షన్, స్పేస్ ఆట, బాంకింగ్ ఆప్, కోడ్ ఎడిటర్, మరియు AI చాట్ అసిస్టెంట్ - **ప్రాక్టికల్ ప్రాజెక్ట్స్**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, మరియు AI Chat Assistant
- **ఆకట్టుకునే క్విజ్‌లు**: ప్రతి పాఠానికి 3 ప్రశ్నలతో కలిపి 48 క్విజ్‌లు (పూర్వ / అనంతర-పాఠ పరీక్షలు) - **ఇంటరాక్టివ్ క్విజ్‌లు**: 48 క్విజ్‌లు, ప్రతి ఒక్కటి 3 ప్రశ్నలతో (పూర్వ/పోస్ట్-పాఠ్య అంచనాలు)
- **బహుభాషా మద్దతు**: GitHub Actions ద్వారా 50+ భాషలకి స్వయంచాలక అనువాదాలు - **బహుభాషా మద్దతు**: GitHub Actions ద్వారా 50+ భాషల ఆటోమేటిక్ అనువాదాలు
- **సాంకేతికతలు**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI ప్రాజెక్టులకు) - **టెక్నాలజీలు**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI ప్రాజెక్టుల కోసం)
### Architecture ### నిర్మాణం
- పాఠాల ఆధారంగా నిర్మించిన విద్యా కోశం - పాఠ్యక్రమ-ఆధారిత నిర్మాణం కలిగిన విద్యాసంబంధిత రిపోజిటరీ
- ప్రతి పాఠం ఫోల్డర్ README, కోడ్ ఉదాహరణలు, పరిష్కారాలు కలిగి ఉంటుంది - ప్రతి పాఠం ఫోల్డర్ README, కోడ్ ఉదాహరణలు, మరియు పరిష్కారాలతో ఉంటుంది
- స్వతంత్ర ప్రాజెక్టులు వేరే డైరెక్టరీలలో (quiz-app, వివిధ పాఠ ప్రాజెక్టులు) - స్వతంత్ర ప్రాజెక్టులు వేర్వరు డైరెక్టరీలలో (quiz-app, వివిధ పాఠాల ప్రాజెక్టులు)
- GitHub Actions (co-op-translator) ఉపయోగించి అనువాద వ్యవస్థ - GitHub Actions (co-op-translator) ఉపయోగించి అనువాద వ్యవస్థ
- Docsify ద్వారా డాక్యుమెంటేషన్ అందించబడుతుంది మరియు PDF లో కూడా అందుబాటులో ఉంది - డాక్యుమెంటేషన్ Docsify ద్వారా సేవ్ చేసి PDF గా లభ్యం
## Setup Commands ## సెటప్ కమాండ్లు
సంచయ కోశం ఎక్కువగా విద్యా విషయాలను వినియోగించుకోవడానికి. ప్రత్యేక ప్రాజెక్టులతో పని చేయడానికి: రిపోజిటరీ ప్రాథమికంగా విద్యాసంబంధిత కంటెంట్ వినియోగం కోసం. ప్రత్యేక ప్రాజెక్టులతో పనిచేయడానికి:
### Main Repository Setup ### ప్రధాన రిపోజిటరీ సెటప్
```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
``` ```
### Quiz App Setup (Vue 3 + Vite) ### Quiz App సెటప్తో (Vue 3 + Vite)
```bash ```bash
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 నడపండి
``` ```
### Bank Project API (Node.js + Express) ### బ్యాంక్ ప్రాజెక్ట్ 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 Projects ### బ్రౌజర్ ఎక్స్‌టెన్షన్ ప్రాజెక్టులు
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# బ్రౌజర్-ప్రత్యేక ఎక్స్‌టెన్షన్ లోడ్ చేయడం సంబంధిత సూచనలను అనుసరించండి # బ్రౌజర్-ప్రత్యేకమైన ఎక్స్‌టెన్షన్ లోడింగ్ సూచనలను అనుసరించండి
``` ```
### Space Game Projects ### స్పేస్ గేమ్ ప్రాజెక్టులు
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# బ్రౌజర్‌లో index.html ని తెరవండి లేదా Live Server వినియోగించండి # బ్రౌజర్‌లో index.html ఫైల్‌ని తెరవండి లేదా లైవ్ సర్వర్ ఉపయోగించండి
``` ```
### Chat Project (Python Backend) ### చాట్ ప్రాజెక్ట్ (Python బ్యాక్-ఎండ్)
```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
``` ```
## Development Workflow ## అభివృద్ధి కార్యప్రవాహం
### For Content Contributors ### కంటెంట్ కాంట్రిబ్యూటర్ల కోసం
1. **రిపాజిటరీని ఫోర్క్ చేయండి** మీ GitHub ఖాతాకు 1. **రిపోజిటరీని ఫోర్క్ చేయండి** మీ GitHub అకౌంట్‌కు
2. **మీ fork ని స్థానికంగా క్లోన్ చేయండి** 2. **మీ ఫోర్క్‌ను లోకల్‌లో క్లోన్ చేయండి**
3. మీ మార్పులకు **కొత్త బ్రాంచ్ సృష్టించండి** 3. **మీ మార్పులకు కొత్త బ్రాంచ్ సృష్టించండి**
4. పాఠ విషయాలు లేదా కోడ్ ఉదాహరణలలో మార్పులు చేయండి 4. పాఠ్య కంటెంట్ లేదా కోడ్ ఉదాహరణలు మార్చండి
5. సంబంధిత ప్రాజెక్ట్ డైరెక్టరీలలో కోడ్ మార్పులను పరీక్షించండి 5. సంబంధిత ప్రాజెక్ట్ డైరెక్టరీలలో మార్పులపై పరీక్షించండి
6. సహకార మార్గదర్శకాలను అనుసరించి పుల్ రిక్వెస్ట్‌లు పంపండి 6. సహకార మార్గదర్శకాలు అనుసరించి пул్ రిక్వెస్ట్‌లను పంపండి
### For Learners ### నేర్చుకుంటున్నవారికి
1. రిపజిటరీని ఫోర్క్ లేదా క్లోన్ చేయండి 1. రిపజిటరీని ఫోర్క్ లేదా క్లోన్ చేయండి
2. పాఠాల డైరెక్టరీలలో వరుసగా navigation చేయండి 2. వరుసగా పాఠాల డైరెక్టరీలలో నావిగేట్ చేయండి
3. ప్రతి పాఠం README ఫైళ్ళను చదవండి 3. ప్రతి పాఠం README ఫైళ్లను చదవండి
4. pre-lesson క్విజ్‌లు పూర్తి చేయండి https://ff-quizzes.netlify.app/web/ 4. https://ff-quizzes.netlify.app/web/ వద్ద ప్రీ-పాఠ క్విజ్‌లు పూర్తి చేయండి
5. పాఠం ఫోల్డర్లలోని కోడ్ ఉదాహరణలపై పని చేయండి 5. పాఠం ఫోల్డర్లలో కోడ్ ఉదాహరణలపై పని చేయండి
6. అసైన్‌మెంట్‌లు మరియు సవాళ్లను పూర్తి చేయండి 6. అసైన్మెంట్లు మరియు ఛాలెంజ్‌లను పూర్తి చేయండి
7. post-lesson క్విజ్‌లు పూర్తి చేయండి 7. పోస్ట్-పాఠ క్విజ్‌లు తీసుకోండి
### Live Development ### ప్రత్యక్ష అభివృద్ధి
- **డాక్యుమెంటేషన్**: రూట్ లో `docsify serve` నడపండి (పోర్ట్ 3000) - **డాక్యుమెంటేషన్**: రూట్లో `docsify serve` నడపండి (పోర్ట్ 3000)
- **క్విజ్ ఆప్**: quiz-app డైరెక్టరీలో `npm run dev` నడపండి - **Quiz App**: `quiz-app` డైరెక్టరీలో `npm run dev` నడపండి
- **ప్రాజెక్టులు**: HTML ప్రాజెక్టులకు VS Code Live Server ఎక్స్‌టెన్షన్ ఉపయోగించండి - **ప్రాజెక్ట్స్**: HTML ప్రాజెక్టుల కోసం VS Code Live Server ఎక్స్‌టెన్షన్ ఉపయోగించండి
- **API ప్రాజెక్టులు**: సంబంధిత API డైరెక్టరీలలో `npm start` నడపండి - **API ప్రాజెక్టులు**: సంబంధిత API డైరెక్టరీలలో `npm start` నడపండి
## Testing Instructions ## పరీక్ష సూచనలు
### Quiz App Testing ### Quiz App పరీక్ష
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # కోడ్ శైలి సమస్యలు తనిఖీ చేయండి npm run lint # కోడ్ శైలి సమస్యల కోసం తనిఖీ చేయండి
npm run build # నిర్మాణం విజయవంతమవుతుందో నిర్ధారించుకోండి npm run build # బిల్డ్ విజయవంతమవుతుందో లేదో నిర్ధారించండి
``` ```
### Bank API Testing ### బ్యాంక్ 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 # లోపాలు లేకుండా సర్వర్ ప్రారంభమవుతున్నదేమో ధృవీకరించండి
``` ```
### General Testing Approach ### సాధారణ పరీక్షా దృక్కోణం
- ఇది పూర్తిస్థాయి ఆటోమెటిక్ పరీక్షలలేని విద్యా రిపాజిటరీ - ఇది విద్యాసంబంధిత రిపోజిటరీ, సమగ్ర ఆటోమేటిక్ టెస్టులు లేవు
- మాన్యువల్ టెస్టింగ్ కింది అంశాలపై ఫోకస్ చేస్తుంది: - మాన్యువల్ టెస్టింగ్ దృష్టికోణం:
- కోడ్ ఉదాహరణలు ఎర్రర్ లేకుండా నడుస్తున్నాయా - కోడ్ ఉదాహరణలు తప్పులు లేకుండానే నడవాలి
- డాక్యుమెంటేషన్ లో లింకులు బాగా పనిచేస్తున్నాయా - డాక్యుమెంటేషన్‌లో లింకులు సరైన పనితీరుని కలిగి ఉండాలి
- ప్రాజెక్ట్ బిల్డింగ్ విజయవంతమయింది - ప్రాజెక్ట్ బిల్డ్ విజయవంతంగా పూర్తవ్వాలి
- ఉదాహరణలు ఉత్తమ అభ్యాసాలకు అనుగుణంగా ఉన్నాయా - ఉదాహరణలు ఉత్తమ సాధనాలను అనుసరించాలి
### Pre-submission Checks ### సమర్పణకు ముందు తనిఖీలు
- package.json ఉన్న డైరెక్టరీలలో `npm run lint` నడపండి - package.json ఉన్న డైరెక్టరీలలో `npm run lint` నడపండి
- మార్క్డౌన్ లింకులు సరైనవా అని ధృవీకరించండి - మార్క్‌డౌన్ లింకులు కచ్చితంగా పని చేస్తాయనే ధృవీకరించండి
- బ్రౌజర్ లేదా Node.js లో కోడ్ ఉదాహరణలను పరీక్షించండి - బ్రౌజర్ లేదా Node.js లో కోడ్ ఉదాహరణలను పరీక్షించండి
- అనువాదాలు సరైన నిర్మాణాన్ని కలిగి ఉన్నాయా అని పరిశీలించండి - అనువాదాలు సరైన నిర్మాణ పాటిస్తున్నాయనే చూడండి
## Code Style Guidelines ## కోడ్ స్టైల్ గైడ్‌లైన్‌లు
### JavaScript ### JavaScript
- ఆధునిక ES6+ వాక్యరచన ఉపయోగించండి - ఆధునిక ES6+ సింటాక్స్ ఉపయోగించండి
- ప్రాజెక్టుల్లో కలిగిన ESLint నియమాలను అనుసరించండి - ప్రాజెక్టుల్లో అందించిన ESLint నిర్దేశాలను అనుసరించండి
- విద్యార్థుల స్పష్టతకు అర్థమయ్యే వేరియబుల్ మరియు ఫంక్షన్ పేర్లను వాడండి - విద్యార్థులకు సులభంగా అర్థమయ్యేలా ప్రయోజనకరమైన వేరియబుల్ మరియు ఫంక్షన్ పేర్లను ఉపయోగించండి
- కాంప్లెక్స్ కాన్సెప్ట్‌ల వివరణకు వ్యాఖ్యలు జోడించండి - భావాలను వివరిస్తూ కామెంట్లు జోడించండి
- Prettier ద్వారా ఫార్మాటింగ్ చేయండి (అక్కడ అమర్చబడిన ఉంటే) - Prettier ఎక్కడుంటే అందిని ఫార్మాట్ చేయండి
### HTML/CSS ### HTML/CSS
- సేమాంటిక్ HTML5 ఎలిమెంట్స్ ఉపయోగించండి - సేమాంటిక్ HTML5 అంశాలు ఉపయోగించండి
- రెస్పాన్సివ్ డిజైన్ సూత్రాలు పాటించండి - రెస్పాన్సివ్ డిజైన్ సూత్రాలు
- క్లియర్ క్లాస్ నేమింగ్ కన్వెన్షన్స్ - క్లియర్ క్లాస్ నేమింగ్ కన్వెన్షన్స్
- CSS సాంకేతికతలను అవగాహన కోసం వ్యాఖ్యలతో వివరించండి - CSS టెక్నిక్‌లు వివరించే కామెంట్లు విద్యార్థుల కోసం
### Python ### Python
- PEP 8 శైలీ మార్గదర్శకాలు - PEP 8 స్టైల్ గైడ్‌లైన్‌లు
- సరళమైన, విద్యా కోడ్ ఉదాహరణలు - స్పష్టమైన, విద్యాసంబంధిత కోడ్ ఉదాహరణలు
- నేర్చుకునే వారికి ఉపయోగపడే టైప్ హింట్స్ - అవసరమైతే టైప్ హింట్స్ జోడించండి
### Markdown Documentation ### Markdown డాక్యుమెంటేషన్
- స్పష్టమైన శీర్షిక హియరార్కీ - క్లియర్ శీర్షిక వరుస
- భాష స్పష్టీకరణతో కోడ్ బ్లాక్స్ - భాష స్పెసిఫికేషన్ ఉన్న కోడ్ బ్లాక్స్
- అదనపు వనరులకు లింకులు - అదనపు వనరులకు లింకులు
- `images/` డైరెక్టరీలలో స్క్రీన్‌షాట్లు మరియు చిత్రాలు - `images/` డైరెక్టరీలలో స్క్రీన్‌షాట్లు మరియు చిత్రాలు
- అందుబాటుని పెంచేందుకు చిత్రాలకు ఆల్ట్ టెక్స్ట్ - ఆక్సెసిబిలిటీ కోసం చిత్రాలకు Alt టెక్స్ట్
### File Organization ### ఫైల్ ఆర్గనైజేషన్
- పాఠాలు వరుస సంఖ్యలతో (1-getting-started-lessons, 2-js-basics, మొదలైనవి) - పాఠాలు వరుస సంఖ్యలతో (1-getting-started-lessons, 2-js-basics, మొదలైనవి)
- ప్రతి ప్రాజెక్ట్ కి `solution/`, తరచుగా `start/` లేదా `your-work/` ఫోల్డర్లు ఉంటాయి - ప్రతి ప్రాజెక్ట్‌కు `solution/` మరియు తరచుగా `start/` లేదా `your-work/`ెకటరీలు ఉంటాయి
- చిత్రాలు పాఠానికి చెందిన `images/` ఫోల్డర్‌లలో భద్రపరచబడతాయి - చిత్రాలు పాఠాలకు ప్రత్యేకమైన `images/` ఫోల్డర్లలో నిల్వ చేస్తారు
- అనువాదాలు `translations/{language-code}/` నిర్మాణంలో - అనువాదాలు `translations/{language-code}/` నిర్మాణంలో ఉంటాయి
## Build and Deployment ## బిల్డ్ మరియు డిప్లాయ్‌మెంట్
### Quiz App Deployment (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 వర్క్‌ఫ్లో ద్వారా డిప్లాయ్ చేస్తుంది # ప్రధానానికి పుష్ చేసినప్పుడు GitHub Actions వర్క్‌ఫ్లో ద్వారా విడుదల చేస్తుంది
``` ```
Azure Static Web Apps సెట్టింగ్స్:
- **ఆప్ లోకేషన్**: `/quiz-app`
- **అవుట్‌పుట్ లోకేషన్**: `dist`
- **వర్క్‌ఫ్లో**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
Azure Static Web Apps కాన్ఫిగరేషన్: ### డాక్యుమెంటేషన్ PDF జనరేషన్
- **యాప్ స్థానం**: `/quiz-app`
- **అవుట్‌పుట్ స్థానం**: `dist`
- **వర్క్ఫ్లో**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Documentation PDF Generation
```bash ```bash
npm install # docsify-to-pdf ని ఇన్‌స్టాల్ చేయండి npm install # docsify-to-pdf ను ఇన్‌స్టాల్ చేయండి
npm run convert # డాక్స్ నుండి PDF సృష్టించండి npm run convert # docs నుండి PDF ను రూపొందించండి
``` ```
### Docsify Documentation ### Docsify డాక్యుమెంటేషన్
```bash ```bash
npm install -g docsify-cli # Docsify ను గ్లోబల్గా ఇన్స్టాల్ చేయండి npm install -g docsify-cli # Docsify ని గ్లోబలీ ఇన్‌స్టాల్ చేయండి
docsify serve # localhost:3000 పై సర్వ్ చేయండి docsify serve # localhost:3000 పై సర్వ్ చేయండి
``` ```
### Project-specific Builds ### ప్రాజెక్ట్-స్పెసిఫిక్ బిల్డ్స్
ప్రతి ప్రాజెక్ట్ డైరెక్టరీకి తన స్వంత బిల్డ్ ప్రక్రియ ఉండవచ్చు: ప్రతి ప్రాజెక్ట్ డైరెక్టరీకి తనంతటివిగా బిల్డ్ ప్రోసెస్ ఉండవచ్చు:
- Vue ప్రాజెక్టులు: `npm run build` ప్రొడక్షన్ బండిల్స్ సృష్టిస్తుంది - Vue ప్రాజెక్టులు: `npm run build` ప్రొడక్షన్ బండిల్స్ సృష్టిస్తుంది
- స్థిర ప్రాజెక్టులు: బిల్డ్ స్టెప్ అవసరం లేదు, ఫైళ్ళను నేరుగా సేవ్ చేయండి - స్టాటిక్ ప్రాజెక్టులు: బిల్డ్ స్టెప్ లేదు, అందుబాటులో ఉండే ఫైళ్ళను నేరుగా సేవ్ చేస్తాయి
## Pull Request Guidelines ## పుల్ రిక్వెస్ట్ గైడ్‌లైన్‌లు
### Title Format ### టైటిల్ ఫార్మాట్
మార్పు ప్రాంతాన్ని స్పష్టంగా సూచించే టైటిల్స్ వాడండి: మార్పు ప్రాంతాన్ని స్పష్టంగా తెలియజేసే హెడ్డింగ్‌లను వాడండి:
- `[Quiz-app] పాఠం X కోసం కొత్త క్విజ్ జోడించండి` - `[Quiz-app] కొత్త క్విజ్ జోడించండి పాఠం X కోసం`
- `[Lesson-3] టెరరియం ప్రాజెక్ట్ లో టైపో సరిచేయండి` - `[Lesson-3] terrarium ప్రాజెక్ట్‌లో టైపో సరిచేయండి`
- `[Translation] పాఠం 5 కి స్పానిష్ అనువాదం జోడించండి` - `[Translation] పాఠం 5కి స్పానిష్ అనువాదం జోడించండి`
- `[Docs] సెటప్ సూచనలు నవీకరించండి` - `[Docs] సెటప్ సూచనలను అప్‌డేట్ చేయండి`
### Required Checks ### అవసరమైన తనిఖీలు
PR సమర్పించే ముందు: ఓ PR పంపించే ముందు:
1. **కోడ్ నాణ్యత**: 1. **కోడ్ నాణ్యత**:
- ప్రభావిత ప్రాజెక్ట్ డైరెక్టరీలలో `npm run lint` నడపండి - ప్రభావాన్ని పొందిన ప్రాజెక్ట్ డైరెక్టరీలలో `npm run lint` నడపండి
- అన్ని లింట్ లోపాలు, హెచ్చరికలు సరి చేయండి - అన్ని లింట్ తప్పులు మరియు వార్నింగ్‌లను సరిచేయండి
2. **బిల్డ్ ధృవీకరణ**: 2. **బిల్డ్ ధృవీకరణ**:
- అవసరమైతే `npm run build` నడపండి - అవసరమైతే `npm run build` నడపండి
- ఎలాంటి బిల్డ్ లోపాలు లేవన్నారు తేల్చుకోండి - ఎలాంటి బిల్డ్ లోపాలు లేకుండా చూసుకోండి
3. **లింక్ చెల్లింపుదనం**: 3. **లింక్ ధృవీకరణ**:
- అన్ని మార్క్‌డౌన్ లింకులను పరీక్షించండి - అన్ని మార్క్‌డౌన్ లింకులను పరీక్షించండి
- చిత్ర సూచనలు పనిచేస్తున్నాయా పరిశీలించండి - చిత్ర సూచనలను ధృవీకరించండి
4. **విషయ సమీక్ష**: 4. **కంటెంట్ సమీక్ష**:
- స్పెల్లింగ్, వ్యాకరణ పొరపాట్ల కోసం పృథ్వీశుద్ధి చేయండి - స్పెల్లింగ్ మరియు వ్యాకరణం పరిశీలించండి
- కోడ్ ఉదాహరణలు సరైనవి మరియు విద్యా పరంగానూ సరైనవి - కోడ్ ఉదాహరణలు సరైనవి మరియు విద్యాసంబంధితమని నిర్ధారించండి
- అనువాదాలు మూల అర్థాన్ని కాపాడుతున్నాయా చూసుకోండి - అనువాదాలు ప్రారంభ అర్థాన్ని తప్పకుండా కలిగి ఉండాలి
### Contribution Requirements ### సహకార అవసరాలు
- 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) చూడండి
- అవసరమైతే PR వివరణలో ఇష్యూ నంబర్లు సూచించండి - అవసరమైతే PR వివరణలో ఇష్యూ సంఖ్యలను ప్రస్తావించండి
### Review Process ### సమీక్ష ప్రక్రియ
- PRలను నిర్వహకులు మరియు కమ్యూనిటీ సమీక్షిస్తారు - PRలు మేంటెయినర్లు మరియు కమ్యూనిటీ పరిశీలిస్తారు
- విద్యా స్పష్టత ప్రాధాన్య కలదు - విద్యాసంబంధిత స్పష్టత ప్రాధాన్యత దక్కుతుంది
- కోడ్ ఉదాహరణలు ప్రస్తుత ఉత్తమ అభ్యాసాలకు అనుగుణంగా ఉండాలి - కోడ్ ఉదాహరణలు ప్రస్తుత ఉత్తమ విధానాలను అనుసరించాలి
- అనువాదాలు ఖచ్చితత్వం మరియు సాంస్కృతిక అనుకూలత కోసం పరిశీలించబడతాయి - అనువాదాలు ఖచ్చితత్వం మరియు సాంస్కృతిక అనుకూలత కోసం సమీక్షించబడతాయి
## Translation System ## అనువాద వ్యవస్థ
### Automated Translation ### ఆటోమేటెడ్ అనువాదం
- GitHub Actions లో co-op-translator వర్క్‌ఫ్లో ఉపయోగిస్తుంది - GitHub Actions లో co-op-translator వర్క్‌ఫ్లో ఉపయోగిస్తుంది
- 50+ భాషలకు ఆటోమేటిక్ అనువాదాలు చేస్తుంది - 50+ భాషలకు ఆటోమేటిక్ అనువాద
- మూల ఫైళ్లు ప్రధాన డైరెక్టరీస్‌లో ఉంటాయి - మూల ఫైళ్లు ప్రధాన డైరెక్టరీల్లో ఉంటాయి
- అనువాద ఫైళ్లు `translations/{language-code}/`లో ఉంటాయి - అనువాద ఫైళ్లు `translations/{language-code}/` లో ఉంటాయి
### Adding Manual Translation Improvements ### మాన్యువల్ అనువాద మెరుగుదలలు జోడించడం
1. `translations/{language-code}/`లో ఫైల్ కనుగొనండి 1. `translations/{language-code}/`లో ఫైలు కనుగొనండి
2. నిర్మాణాన్ని కాపాడుతూ మెరుగులు చేయండి 2. నిర్మాణాన్ని కాపాడుతూ మెరుగుదలలు చేయండి
3. కోడ్ ఉదాహరణలు ప్రావృత్తి రీతిలో పనిచేస్తున్నాయో చూడండి 3. కోడ్ ఉదాహరణలు సక్రమంగా పనిచేస్తున్నట్లుగా చూసుకోండి
4. స్థానికృత క్విజ్ కంటెంట్ ను పరీక్షించండి 4. స్థానికీకరించిన క్విజ్ కంటెంట్‌ను పరీక్షించండి
### Translation Metadata ### అనువాద మెటాడేటా
అనువదించిన ఫైళ్ళలో మెటాడేటా హెడ్డర్ ఉంటుంది: అనువాద ఫైళ్లు మెటాడేటా హెడ్డర్ కలిగి ఉంటాయి:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -288,121 +288,121 @@ CO_OP_TRANSLATOR_METADATA:
} }
--> -->
``` ```
## డీబగ్గింగ్ మరియు సమస్య పరిష్కారం
## Debugging and Troubleshooting ### సాధారణ సమస్యలు
### Common Issues
**క్విజ్ యాప్ ప్రారంభం కావడం లేదు**: **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 కనీస వెర్షన్ (node >=10) తనిఖీ చేయండి - Node.js కనీస వెర్షన్ (node >=10) ఉన్నదని ధృవీకరించండి
- పోర్ట్ ఇప్పటికే వాడుకలో ఉందా శోధించండి - పోర్ట్ ఇప్పటికే వినియోగంలో ఉందో లేదో తనిఖీ చేయండి
- అన్ని డిపెండెన్సీలను `npm install` చేయండి - అన్ని డిపెండెన్సీల`npm install` తో ఇన్స్టాల్ అయ్యాయో చూసుకోండి
**బ్రౌజర్ ఎక్స్‌టెన్షన్ లోడ్ అవడం లేదు**: **Browser extension లోడ్ కావడం లేదు**:
- manifest.json సరైన ఫార్మాట్ లో ఉందో చూసుకోండి - manifest.json సరైన ఫార్మాట్‌లో ఉందా చూడండి
- బ్రౌజర్ కన్సోల్ లో పొరపాట్లు ఉన్నాయా తనిఖీ చేయండి - బ్రౌజర్ కన్సోల్ లోలోపాలను తనిఖీ చేయండి
- బ్రౌజర్-ప్రత్యేక ఎక్స్‌టెన్షన్ ఇన్స్టలేషన్ సూచనలు అనుసరించండి - బ్రౌజర్-ప్రత్యేక ఎక్స్‌టెన్షన్ ఇన్స్టలేషన్ సూచనలు అనుసరించండి
**Python చాట్ ప్రాజెక్ట్ సమస్యలు**: **Python చాట్ ప్రాజెక్ట్ సమస్యలు**:
- OpenAI ప్యాకేజీ ఇన్స్టాల్ చేసినట్టయితే చూసుకోండి: `pip install openai` - OpenAI ప్యాకేజీ ఇన్స్టాల్ చేయాలి: `pip install openai`
- GITHUB_TOKEN_ENVIRONMENT వేరియబుల్ సెట్ అయినదని ధృవీకరించండి - GITHUB_TOKEN ఎన్విరాన్మెంట్ వేరియబుల్ సెట్ ఉందని చూసుకోండి
- 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`నికిని ధృవీకరించండి
### Development Environment Tips ### అభివృద్ధి పరిసర సూచనలు
- HTML ప్రాజెక్టులకు VS Code లో Live Server ఎక్స్‌టెన్షన్ ఉపయోగించండి - HTML ప్రాజెక్టులకు VS Code Live Server ఎక్స్‌టెన్షన్ ఉపయోగించండి
- ESLint, Prettier ఎక్స్‌టెన్షన్‌లను ఇన్స్టాల్ చేసి నిరంతర ఫార్మాటింగ్ కోసం వాడండి - ESLint మరియు Prettier ఎక్స్‌టెన్షన్లు consistent ఫార్మాటింగ్ కోసం ఇన్స్టాల్ చేయండి
- JavaScript డీబగ్గింగ్ కోసం బ్రౌజర్ DevTools ఉపయోగించండి - JavaScript డీబగ్గింగ్ కోసం బ్రౌజర్ డెవ్‌టూల్స్ వాడండి
- Vue ప్రాజెక్టులకు Vue DevTools బ్రౌజర్ ఎక్స్‌టెన్షన్ ఉపయోగించండి - Vue ప్రాజెక్టులకు Vue DevTools బ్రౌజర్ ఎక్స్‌టెన్షన్ ఇన్స్టాల్ చేయండి
### Performance Considerations ### పనితీరు పరిగణనలు
- అనువాద ఫైళ్ళ సంఖ్య ఎక్కువ (50+ భాషలు) కావున పూర్తి క్లోన్‌లు పెద్దవి - 50+ భాషలతో అనువాద ఫైల్స్ బహుళంగా ఉండటం వల్ల పూర్తి క్లోన్లు పెద్దవి
- కంటెంట్ మీద మాత్రమే పని చేస్తే డెఫాల్ట్ క్లోన్ తొలగించి షాలో క్లోన్ వాడండి: `git clone --depth 1` - కంటెంట్ మీద మాత్రమే పని చేస్తుంటే షాలో క్లోన్ ఉపయోగించండి: `git clone --depth 1`
- ఇంగ్లీష్ కంటెంట్ మీద పని చేసే సమయంలో అనువాదాలను సెర్చ్ నుండి తొలగించండి - English కంటెంట్ పని సమయాల్లో అనువాదాలను సెర్చ్ నుండి వేరుపరచండి
- మొదటి సారి npm install మరియు Vite build స్పష్టంగా నడవడానికి బిల్డ్ ప్రక్రియలు కొంచెం ఆలస్యంగా ఉండొచ్చు - మొదటి ప్రస్తుతంలో (npm install, Vite build) బిల్డ్ ప్రక్రియలు మెల్లగా ఉండవచ్చు
## Security Considerations ## భద్రతా పరిగణనలు
### Environment Variables ### ఎన్విరాన్మెంట్ వేరియబుల్స్
- API కీలు రిపాజిటరీలో ఎప్పుడూ కమిట్ చెయ్యకూడదు - API కీలు ఎప్పుడూ రిపోజిటరీలో కమీట్ చేయవద్దు
- `.env` ఫైల్స్ వాడండి (ఇవి `.gitignore`లో ఉన్నాయి) - `.env` ఫైల్స్ వాడండి (ఇవి `.gitignore` లోపల ఉన్నాయి)
- అవసరమయిన ఎన్‌విరాన్‌మెంట్ వేరియబుల్స్ ప్రాజెక్ట్ README లలో వర్ణించండి - ప్రాజెక్టు READMEలలో అవసరమైన ఎన్విరాన్మెంట్ వేరియబుల్స్ డాక్యుమెంట్ చేయండి
### Python Projects ### Python ప్రాజెక్టులు
- వర్చువల్ ఎన్విరాన్మెంట్లు ఉపయోగించండి: `python -m venv venv` - వర్చువల్ ఎన్విరాన్మెంట్స్ వాడండి: `python -m venv venv`
- డిపెండెన్సీలను తాజా గా ఉంచండి - డిపెండెన్సీలను నవీకరించండి
- GitHub టోకెన్లు తక్కువ అనుమతులు కలిగి ఉండాలి - GitHub టోకెన్లు కనీస అవసరాలకు పరిమితం చేయాలి
### GitHub Models Access ### GitHub Models యాక్సెస్
- GitHub Models కు Personal Access Tokens (PAT) అవసరం - GitHub Models కోసం Personal Access Tokens (PAT) అవసరం
- టోకెన్లు ఎన్‌విరాన్‌మెంట్ వేరియబుల్స్ గా భద్రపరచండి - టోకెన్లు ఎన్విరాన్మెంట్ వేరియబుల్స్‌గా నిల్వ చేయండి
- టోకెన్లు లేదా క్రెడెన్షియల్స్ ఎప్పుడూ కమిట్ చేయవద్దు - టోకెన్లు లేదా ప్రమాణపత్రాలు ఎప్పుడూ కమీట్ చేయవద్దు
## Additional Notes ## అదనపు నోట్స్
### Target Audience ### లక్ష్య ప్రేక్షకులు
- వెబ్ అభివృద్ధిలో పూర్తి కొత్త వారు - వెబ్ డెవలప్‌మెంట్లో సంపూర్ణ ప్రారంభికులు
- విద్యార్థులు మరియు స్వీయాధ్యయనకర్తలు - విద్యార్థులు మరియు స్వయం-నియంత్రితులు
- తరగతి గదుల్లో పాఠ్యక్రమాన్ని ఉపయోగించే ఉపాధ్యాయులు - తరగతుల్లో పాఠ్యక్రమాన్ని ఉపయోగించే ఉపాధ్యాయులు
- కంటెంట్ ఆక్సెసిబిలిటీ మరియు మాటిమీద నెమ్మదిగా నైపుణ్యాలు పెంపొందించేందుకు రూపొద్దు - కంటెంట్ లభ్యతకు మరియు దశల వారీ నైపుణ్య అభివృద్ధికి రూపకల్పన చేయబడింది
### Educational Philosophy ### విద్యా తత్వం
- ప్రాజెక్ట్-ఆధారిత నేర్చుకునే విధానం - ప్రాజెక్ట్-ఆధారిత నేర్పింపు విధానం
- తరచుగా నాలెడ్జ్ చెక్స్ (క్విజ్‌లు) - తరచూ జ్ఞాన తనిఖీలు (క్విజ్‌లు)
- అమలు చేయగలిగే కోడింగ్ వ్యాయామాలు - చేతులతో కోడింగ్ వ్యాయామాలు
- వాస్తవ ప్రపంచ అనువర్తన ఉదాహరణలు - వాస్తవ ప్రపంచ అప్లికేషన్ల ఉదాహరణలు
- ఫ్రేమ్‌వర్క్‌ల ముందు ప్రాథమికాంశాలపై దృష్టి - ఫ్రేమ్‌వర్క్‌లు ముందు మూలాధారాలపై దృష్టి
### Repository Maintenance ### రిపోజిటరీ నిర్వహణ
- సజీవ కమ్యూనిటీ విద్యార్థులు మరియు సహకారకులతో - సജീവ సముదాయం: నేర్చుకునేవారు మరియు సహకారులు
- ఆపరేషన్లు మరియు కంటెంట్ సాధారణంగా నవీకరణలు - డిపెండెన్సీలు మరియు కంటెంట్‌నూ తరచూ అప్‌డేట్ చేస్తారు
- నిర్వహకులు ఇష్యూలు మరియు చర్చలను పర్యవేక్షిస్తారు - ఇష్యూలు మరియు చర్చలు మేంటెయిర్లు పర్యవేక్షిస్తారు
- అనువాద నవీకరణలు GitHub Actions ద్వారా స్వయంచాలకమే - అనువాద అప్‌డేట్స్ GitHub Actions ద్వారా ఆటోమేటెడ్
### Related Resources ### సంబంధిత వనరులు
- [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Microsoft Learn modules](https://docs.microsoft.com/learn/)
- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) - [Student Hub resources](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 పాఠ్యక్రమాలు అందుబాటులో ఉన్నాయి
### Working with Specific Projects ### నిర్దిష్ట ప్రాజెక్టులతో పని
ప్రత్యేక ప్రాజెక్టుల వివరాలకు README ఫైళ్ళను చూడండి: ప్రతి ప్రాజెక్టు README ఫైళ్లను చూడండి:
- `quiz-app/README.md` - Vue 3 క్విజ్ అనువర్తనం - `quiz-app/README.md` - Vue 3 క్విజ్ అప్లికేషన్
- `7-bank-project/README.md` - బాంకింగ్ అనువర్తనం మరియు ధృవీకరణతో - `7-bank-project/README.md` - బ్యాంకింగ్ అప్లికేషన్ మరియు ఆథెంటికేషన్
- `5-browser-extension/README.md` - బ్రౌజర్ ఎక్స్‌టెన్షన్ అభివృద్ధి - `5-browser-extension/README.md` - బ్రౌజర్ ఎక్స్‌టెన్షన్ అభివృద్ధి
- `6-space-game/README.md` - కేన్వాస్ ఆధారిత ఆట అభివృద్ధి - `6-space-game/README.md` - కెన్వాస్-ఆధారిత గేమ్ డెవలప్‌మెంట్
- `9-chat-project/README.md` - AI చాట్ అసిస్టెంట్ ప్రాజెక్ట్ - `9-chat-project/README.md` - AI చాట్ అసిస్టెంట్ ప్రాజెక్ట్
### Monorepo Structure ### మోనోరిపోజిటరీ నిర్మాణం
ఇది సంప్రదాయ మోనోరిపో కానప్పటికీ, ఈ సంకలనం అనేక స్వతంత్ర ప్రాజెక్టులను కలిగి ఉంది: పారంపరిక మోనోరిపో కాదు, కానీ ఇందులో బహుళ స్వతంత్ర ప్రాజెక్టులు ఉన్నాయి:
- ప్రతి పాఠం స్వతంత్రంగా ఉంటుంది - ప్రతి పాఠం స్వయంగా పూర్తయినది
- ప్రాజెక్టులు ఒకరితో ఒకరు డిపెండెన్సీలు పంచుకోరువు - ప్రాజెక్టులు డిపెండెన్సీలు పంచుకోరు
- ఇతరులపై ప్రభావం లేకుండా వ్యక్తిగత ప్రాజెక్టులపై పని చేయండి - వేరే ప్రాజెక్టులపై ప్రభావం లేకుండా వ్యక్తిగత ప్రాజెక్టులపై పని చేయండి
- మొత్తం పాఠ్యక్రమ అనుభవం కోసం మొత్తం రిపాజిటరీ ని క్లోన్ చేయండి - పూర్తి పాఠ్యక్రమ అనుభవం కోసం పూర్తి రిపోను క్లోన్ చేయండి
--- ---
<!-- 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,243 +1,254 @@
# వెబ్ అభివృద్ధి ప్రారంభమైన వారికోసం - ఒక పాఠ్యాంశ # Web Development for Beginners - ఒక పాఠ్యక్రమ
మైక్రోసాఫ్ట్ క్లౌడ్ అడ్వొకేట్స్ రూపకల్పన చేసిన మా 12 వారాల సమగ్ర కోర్సుతో వెబ్ అభివృద్ధి మూలాభాస్ నేర్చుకోండి. 24 పాఠాలన్నీ జావాస్క్రిప్ట్, CSS, మరియు HTML పై చేతితో చేయగల ప్రాజెక్ట్స్ ద్వారా, terrariums, బ్రౌజర్ ఎక్స్‌టెన్షన్స్, మరియు స్పేస్ గేమ్స్ వంటి ఒప్షన్లపై లోతుగా తెలుసుకుంటారు. క్విజ్‌లు, చర్చలు, మరియు ప్రాక్టికల్ అసైన్‌మెంట్‌లతో ఎంగేజ్ అవ్వండి. మీ నైపుణ్యాలను మెరుగు పరుచుకోండి మరియు మా సమర్థమైన ప్రాజెక్ట్ ఆధారిత ఉపాధ్యాయం ద్వారా మీ జ్ఞానాన్ని సవ్యంగా నిలుపుకోవడంలో సహాయం పొందండి. మీ కోడింగ్ ప్రయాణాన్ని ఈరోజు ప్రారంభించండి! మైక్రోసాఫ్ట్ క్లౌడ్ అడ్వకేట్లతో మా 12-వారం సమగ్ర కోర్సుతో వెబ్ డెవలప్‌మెంట్ బేసిక్స్ నేర్చుకోండి. 24 పాఠాల ప్రతిదీ జావాస్క్రిప్ట్, CSS, HTML లో టీరేరియమ్‌లు, బ్రౌజర్ ఎక్స్‌టెన్షన్లు, స్పేస్ గేమ్స్ వంటి ప్రాక్టికల్ ప్రాజెక్టుల ద్వారా లోతుగా తెలుసుకొంటుంది. క్విజ్‌లు, చర్చలు, అనుభవ పరీక్షలతో ఇతరులతో పాల్గొనండి. మా ప్రభావవంతమైన ప్రాజెక్ట్ ఆధారిత పాఠ్యశైలితో మీ నైపుణ్యాలను బలోపేతం చేసి, మీ జ్ఞానాన్ని సద్వినియోగం చేసుకోండి. మీ కోడింగ్ ప్రయాణాన్ని ఈ రోజు ప్రారంభించండి!
Azure AI Foundry Discord కమ్యూనిటీతో చేరండి Azure AI Foundry Discord కమ్యూనిటీతో చేరండి
Follow these steps to get started using these resources: [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
1. **రిపాజిటరీని Fork చేయండి**: క్లిక్ చేయండి [![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. **రిపాజిటరీని Clone చేయండి**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` ఈ వనరులను ఉపయోగించడం ప్రారంభించడానికి ఈ దశలను అనుసరించండి:
3. [**Azure AI Foundry Discord లో చేరండి మరియు నిపుణులు, fellow డెవలపర్లు కలవండి**](https://discord.com/invite/ByRwuEEgH4) 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`
3. [**Azure AI Foundry Discord లో చేరండి మరియు నిపుణులు మరియు సహ అభివృద్ధিকল্পులతో కలుసుకోండి**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 బహుభాషా మద్దతు ### 🌐 బహుభాషా మద్దతు
#### GitHub Action ద్వారా మద్దతు (ఆటోమేటెడ్ & ఎప్పుడూ తాజా) #### GitHub యాక్షన్ ద్వారా మద్దతు (ఆటోమేటెడ్ & ఎప్పుడూ తాజాలుగా)
> **స్థానికంగా క్లోన్ చేయాలనుకుంటున్నారా?** > **స్థానికంగా క్లోన్ చేయాలా?**
> ఈ రిపాజిటరీలో 50+ భాషల అనువాదాలు ఉన్నందున ఫైల్ డౌన్‌లోడ్ సైజ్ పెద్దది అవుతుంది. అనువాదాలు లేకుండా క్లోన్ చేయడానికి sparse checkout ను ఉపయోగించండి: > ఈ రిపాజిటరీ 50+ భాషా అనువాదాలను కలిగి ఉంది, ఇది డౌన్లోడ్ పరిమాణాన్ని గణనీయంగా పెంచుతుంది. అనువాదాలు లేకుండా క్లోన్ చేయడానికి, స్పార్స్ చెకౌట్ ఉపయోగించండి:
> ```bash > ```bash
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
> cd Web-Dev-For-Beginners > cd Web-Dev-For-Beginners
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ``` > ```
> ఇది మీకు కోర్సును పూర్తి చేయడానికి కావలసిన అన్ని విషయాలను వేగంగా డౌన్‌లోడ్ చేసుకోవడంలో సహాయపడుతుంది. > ఇది మీరు ఈ కోర్సును పూర్తి చేయడానికి అవసరమైన అన్నింటినీ అందిస్తుంది మరింత వేగంగా డౌన్లోడ్ అవుతుంది.
**మరిన్ని అనువాద భాషలు మద్దతు కావాలనుకుంటే ఇక్కడ ఉన్నాయి [here](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)
#### 🧑‍🎓 _మీరు విద్యార్థివా?_ #### 🧑‍🎓 _మీరు విద్యార్థి అయితే?_
విజిట్ చేయండి [**Student Hub పేజీ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) అక్కడ మీరు ప్రారంభ అవసరాలు, విద్యార్థి ప్యాక్స్ మరియు ఉచిత సర్టిఫికెట్ వోచర్ పొందే మార్గాలు కనుగొంటారు. ఇది మీరు తరచూ బుక్‌మార్క్ చేసుకుని చూడవలసిన పేజీ, ఎందుకంటే మేము ప్రతి నెలకు కంటెంట్ మార్చుతాము. [**విద్యార్థి హబ్ పేజీ**](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 మోడ్‌ని uses చేసుకోకపోయినా అది కేవలం టెక్స్ట్ ఉత్పత్తి చేయడమే కాకుండా ఫైళ్ళను సృష్టించడం, సవరించడం, కమాండ్లు నడపడం కూడా చేయగలదు. కొత్త ఛాలెంజ్ ఇవ్వబడింది, చాలా అధ్యాయాలలో "GitHub Copilot Agent Challenge 🚀" కోసం చూడండి. ఇది మీరు GitHub Copilot మరియు Agent మోడ్ ఉపయోగించి పూర్తి చేయవలసిన ఒక కొత్త ఛాలెంజ్. మీరు Agent మోడ్ ను ఇంతవరకు ఉపయోగించలేదు అయితే, ఇది కేవలం టెక్స్ట్ సృష్టించడమే కాకుండా ఫైళ్లను సృష్టించగలదు, ఎడిట్ చేయగలదు, కమాండ్లను నడపగలదు మరియు మరిన్ని చేయగలదు.
### 📣 ప్రకటన - _Generative AI ఉపయోగించి కొత్త ప్రాజెక్ట్_ ### 📣 ప్రకటన - _Generative AI ఉపయోగించి కొత్త ప్రాజెక్ట్_
కొత్త AI అసిస్టెంట్ ప్రాజెక్ట్ జోడించబడింది, తనిఖీ చేయండి [ప్రాజెక్ట్](./9-chat-project/README.md) కేవలం జోడించబడిన కొత్త AI అసిస్టెంట్ ప్రాజెక్ట్ చూడండి [project](./9-chat-project/README.md)
### 📣 ప్రకటన - _Generative AI కోసం కొత్త పాఠ్యక్రమ_ JavaScript కు విడుదలైంది
మా కొత్త Generative AI పాఠ్యక్రమాన్ని verpచేయకడి!
### 📣 ప్రకటన - _జావాస్క్రిప్ట్ కోసం Generative AI పై కొత్త పాఠ్యా_ ప్రారంభించడానికి సందర్శించండి [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
మా కొత్త Generative AI పాఠ్యాంశాన్ని మిస్ కావద్దు! ![Background](../../translated_images/te/background.148a8d43afde5730.webp)
ప్రారంభించడానికి [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) సందర్శించండి! - ప్రాథమికాలు నుండి RAG వరకు అన్ని విషయాలు పాఠాలు ఉన్నాయి.
- GenAI మరియు మాతో కూడిన companion యాప్ ఉపయోగించి చారిత్రక పాత్రలతో పరస్పరం పాల్గొనండి.
- రసమైన మరియు ఆకర్షణీయమైన కథనం, మీరు కాలంతో ప్రయాణిస్తున్నారు!
- మౌలికాలు నుండి RAG వరకు అన్ని విషయాలను కవర్ చేయడం. ![character](../../translated_images/te/character.5c0dd8e067ffd693.webp)
- Generative 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)
## 🌱 మొదలు పెట్టడం ## 🌱 ప్రారంభించడం
> **ఉపాధ్యాయులు**, ఈ పాఠ్యాంశాన్ని ఎలా ఉపయోగించాలో కొన్ని సూచనలు [ఇక్కడ](for-teachers.md) వెల్లడించాము. మీరు మా అభిప్రాయం [మా చర్చా ఫోరమ్‌లో](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) తెలియజేయండి! > **ఆడ్యాపకులు**, ఈ పాఠ్యక్రమాన్ని ఎలా ఉపయోగించాలో కొన్ని సలహాలు మేము ఇచ్చాము [for-teachers.md](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 చేయండి**: ఈ పేజీ టాప్-రైట్ మూలలోని "Fork" బటన్‌పై క్లిక్ చేయండి. 1. **రిపాజిటరీని ఫోర్క్ చేయండి**: ఈ పేజీ యొక్క పై-కుడి మూలలో ఉన్న "Fork" బటన్ పై క్లిక్ చేయండి.
2. **రిపాజిటరీని Clone చేయండి**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **రిపాజిటరీని క్లోన్ చేయండి**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### కోడ్స్‌పేస్‌లో పాఠ్యాంశ నడపడం #### Codespace లో పాఠ్యక్రమ నడపడం
మీ సృష్టించిన ఈ రిపాజిటరీ కాపీ లో, **Code** బటన్ క్లిక్ చేసి **Open with Codespaces** ఎంచుకోండి. ఇది మీకు కొత్త Codespace ని సృష్టిస్తుంది. మీరు సృష్టించిన ఈ రిపాజిటరీ కాపీ లో, **Code** బటన్ పై క్లిక్ చేసి **Open with Codespaces** ఎంచుకోండి. ఇది మీ కోసం కొత్త Codespace ని సృష్టిస్తుంది.
#### మీ కంప్యూటరులో స్థానికంగా పాఠ్యాంశం నడపడం ![Codespace](../../translated_images/te/createcodespace.0238bbf4d7a8d955.webp)
మీ కంప్యూటరులో ఈ పాఠ్యాంశం నడపడానికి, మీరు ఒక టెక్స్ట్ ఎడిటర్, బ్రౌజర్ మరియు కమాండ్ లైన్ టూల్ అవసరం. మా మొదటి పాఠం, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), మీరు ఎన్నుకోవడానికి వివిధ ఎంపికలను మీకు చూపిస్తుంది. #### మీ కంప్యూటర్ లో స్థానికంగా పాఠ్యక్రమం నడపడం
మా సిఫార్సు [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) నుండి డౌన్లోడ్ చేసుకోవచ్చు. ఈ పాఠ్యక్రమాన్ని మీ కంప్యూట‌ర్‌లో నడిపించేందుకు, టెక్స్ట్ ఎడిటర్, బ్రౌజర్ మరియు కమాండ్ లైన్ టూల్ అవసరం. మా మొదటి పాఠం, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), ఈ టూల్స్ యొక్క వివిధ ఎంపికలను మీకు చూపిస్తుంది.
1. మీ రిపాజిటరీని మీ కంప్యూటరులో క్లోన్ చేయండి. దీనికి **Code** బటన్ క్లిక్ చేసి URLను కాపీ చేసుకోండి: మా సిఫార్సు [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) నుండి డౌన్లోడ్ చేసుకోవచ్చు.
1. మీ రిపాజిటరీని మీ కంప్యూటర్‌కు క్లోన్ చేయండి. మీరు దీన్ని **Code** బటన్ క్లిక్ చేసి URL కాపీ చేయడం ద్వారా చేయవచ్చు:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
అప్పుడు, [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) ను తెరిచి, మీరు కితప్పిన URLతో `<your-repository-url>` ను మార్చి క్రింది కమాండ్‌ను నడపండి: తరువాత, [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) ను ఓపెన్ చేసి, మీరు కాపీ చేసిన URLతో `<your-repository-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) - Visual Studio Code లో HTML పేజీలను ప్రివ్యూ చేయడానికి > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code లో HTML పేజీలను ప్రివ్యూ చేయడానికి
> * [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) - మీరు కోడ్ వేగంగా రాయడంలో సహాయం చేయడానికి
## 📂 ప్రతి పాఠంలో ఉంది: ## 📂 ప్రతి పాఠం లో:
- ఐచ్ఛిక స్కెచ్ నోట్ - ఐచ్ఛిక స్కెచ్‌నోట్
- ఐచ్ఛిక సహాయక వీడియో - ఐచ్ఛిక సప్లేమెంటల్ వీడియో
- పాఠం ముందు వార్మ్-అప్ క్విజ్ - పాఠం ముందు వార్మ్-అప్ క్విజ్
- రాసిన పాఠం - రాసిన పాఠం
- ప్రాజెక్ట్-ఆధారిత పాఠాల కోసం, ప్రాజెక్ట్‌ను ఎలా నిర్మించాలో దశల వారీ మార్గదర్శకాలు - ప్రాజెక్ట్ ఆధారిత పాఠాలకై, ప్రాజెక్ట్ నిర్మాణం గురించి దశల వారీ గైడ్‌లు
- జ్ఞాన పరీక్షలు - జ్ఞాన పరీక్షలు
- ఒక సవాలు - ఒక సవాలు
- సహాయక పఠనం - సప్లేమెంటల్ పఠనం
- అసైన్మెంట్ - అసైన్మెంట్
- [పాఠం తరువాతి క్విజ్](https://ff-quizzes.netlify.app/web/) - [పాఠం అనంతరం క్విజ్](https://ff-quizzes.netlify.app/web/)
> **క్విజ్‌ల గురించి ఒక నోట**: అన్ని క్విజ్‌లు Quiz-app ఫోల్డర్‌లో ఉన్నాయి, మొత్తం 48 క్విజ్‌లు ప్రతి ఒకటి మూడు ప్రశ్నలతో. ఇవి [ఇక్కడ](https://ff-quizzes.netlify.app/web/) అందుబాటులో ఉన్నాయి; క్విజ్ అప్లికేషన్ స్థానికంగా నడపవచ్చు లేదా Azure కు పంపించవచ్చు; `quiz-app` ఫోల్డర్‌లో సూచనలను అనుసరించండి. > **క్విజ్‌ల గురించి ఒక నోట<EFBFBD>ి**: అన్ని క్విజ్‌లు Quiz-app ఫోల్డర్‌లో ఉన్నాయి, మొత్తం 48 క్విజ్‌లు, ప్రతి క్విజ్‌లో మూడు ప్రశ్నలు. అవి [ఇక్కడ](https://ff-quizzes.netlify.app/web/) అందుబాటులో ఉన్నాయి; క్విజ్ యాప్‌ను స్థానికంగా నడపవచ్చు లేదా Azure కి డిప్లాయ్ చేయవచ్చు; `quiz-app` ఫోల్డర్ నందు సూచనలను అనుసరించండి.
## 🗃️ పాఠాలు ## 🗃️ పాఠాలు
| | ప్రాజెక్ట్ పేరు | నేర్పే అంశాలు | అధ్యయన లక్ష్యాలు | లింకు తోపాటు పాఠం | రచయిత | | | ప్రాజెక్ట్ పేరు | నేర్పబడే కాన్సెప్ట్లు | నేర్చుకునే లక్ష్యాలు | లింక్ చేయబడిన పాఠం | రచయిత |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Getting Started | ప్రోగ్రామింగ్ పరిచయం మరియు పనికి ఉపయోగించే పరికరాలు | ఎక్కువ ప్రోగ్రామింగ్ భాషల ప్రాథమిక సూత్రాలు మరియు ప్రొఫెషనల్ డెవలపర్లకు సహాయపడే సాఫ్ట్‌వేర్ గురించి నేర్చుకోండి | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | జాస్మిన్ | | 01 | మొదలు పెట్టడం | ప్రోగ్రామింగ్ పరిచయం మరియు వాణిజ్య పనిముట్లు | చాలా ప్రోగ్రామింగ్ భాషల ప్రాథమిక నిబంధనలు మరియు ప్రొఫెషనల్ డెవలోపర్స్ పని చేసే సాఫ్ట్వేర్ గురించి నేర్చుకోండి | [ప్రోగ్రామింగ్ భాషల పరిచయం మరియు వాణిజ్య పనిముట్లు](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | జాస్మిన్ |
| 02 | Getting Started | GitHub ప్రాధమికాలు, జట్టుతో కలిసి పనిచేసే విధానం | మీ ప్రాజెక్టులో GitHub ను ఎలా ఉపయోగించాలో, కోడ్ బేస్‌పై ఇతరులతో ఎలా సహకరించాలో నేర్చుకోండి | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | ఫ్లోర్ | | 02 | మొదలు పెట్టడం | GitHub ప్రమాణాలు, ఒక జట్టు తో పని చేయడం | మీ ప్రాజెక్టులో GitHub ఎలా ఉపయోగించాలో, ఇతరులతో కోడ్ బేస్ పై ఎలా కలిసి పనిచేయాలో తెలుసుకోండి | [GitHub పరిచయం](./1-getting-started-lessons/2-github-basics/README.md) | ఫ్లోర్ |
| 03 | Getting Started | యాక్సెసిబిలిటీ | వెబ్ యాక్సెసిబిలిటీ యొక్క ప్రాథమికాలు నేర్చుకోండి | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | క్రిస్టోఫర్ | | 03 | మొదలు పెట్టడం | యాక్సెసిబిలిటీ | వెబ్ యాక్సెసిబిలిటీ ప్రాథమికాలు నేర్చుకోండి | [యాక్సెసిబిలిటీ మూలాల](./1-getting-started-lessons/3-accessibility/README.md) | క్రిస్టోఫర్ |
| 04 | JS Basics | JavaScript డేటా రకాల గురించి | JavaScript డేటా రకాల మూలాలు | [Data Types](./2-js-basics/1-data-types/README.md) | జాస్మిన్ | | 04 | JS ప్రాథమికాలు | జావాస్క్రిప్ట్ డేటా తరకాలు | జావాస్క్రిప్ట్ డేటా తరకాల ప్రాథమికాలు | [డేటా తరకాలు](./2-js-basics/1-data-types/README.md) | జాస్మిన్ |
| 05 | JS Basics | ఫంక్షన్స్ మరియు మెథడ్స్ | యాప్ యొక్క లాజిక్ ప్రవాహాన్ని నియంత్రించడానికి ఫంక్షన్స్ మరియు మెదడ్స్ గురించి నేర్చుకోండి | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | జాస్మిన్ మరియు క్రిస్టోఫర్ | | 05 | JS ప్రాథమికాలు | ఫంక్షన్లు మరియు మెథడ్లు | అనువర్తనం లోజిక్ ఫ్లోను నిర్వహించడానికి ఫంక్షన్లు మరియు మెథడ్లు గురించి తెలుసుకోండి | [ఫంక్షన్లు మరియు మెథడ్లు](./2-js-basics/2-functions-methods/README.md) | జాస్మిన్ మరియు క్రిస్టోఫర్ |
| 06 | JS Basics | JS తో నిర్ణయాలు తీసుకోవడం | నిర్ణయాలు తీసుకోవడం ఎలా చేయాలో నీతించుకోండి | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | జాస్మిన్ | | 06 | JS ప్రాథమికాలు | JSతో నిర్ణయాలు తీసుకోవడం | మీ కోడ్‌లో పరిస్థితులను సృష్టించడానికి నిర్ణయం తీసుకునే పద్ధతులు నేర్చుకోండి | [నిర్ణయాలు తీసుకోవడం](./2-js-basics/3-making-decisions/README.md) | జాస్మిన్ |
| 07 | JS Basics | అర్రేస్ మరియు లూప్స్ | JavaScript లో అర్రేస్ మరియు లూప్స్ తో డేటాతో పనిచేయండి | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | జాస్మిన్ | | 07 | JS ప్రాథమికాలు | అర్రెయ్స్ మరియు లూప్స్ | జావాస్క్రిప్ట్‌లో అర్రెయ్స్ మరియు లూప్స్‌ను ఉపయోగించి డేటాతో పని చేయండి | [అర్రెయ్స్ మరియు లూప్స్](./2-js-basics/4-arrays-loops/README.md) | జాస్మిన్ |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML ఆచరణలో | ఆన్‌లైన్ టెర్రేరియం తయారీలో HTML నిర్మాణం చేయండి, లేఅవుట్ రోపణపై దృష్టి పెట్టండి | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | జెన్ | | 08 | [టెరేరియం](./3-terrarium/solution/README.md) | HTML ప్రయోగం | ఆన్‌లైన్ టెరేరియం సృష్టించడానికి HTML నిర్మాణం చేయండి, లేఅవుట్ తయారిపై దృష్టి పెట్టండి | [HTML పరిచయం](./3-terrarium/1-intro-to-html/README.md) | జెన్ |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS ఆచరణలో | ఆన్‌లైన్ టెర్రేరియం డిజైన్ చేసేందుకు CSS సృష్టించండి, బేసిక్ CSS మరియు పేజీ రిస్పాన్సివ్ చేయడం మీద దృష్టి పెట్టండి | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | జెన్ | | 09 | [టెరేరియం](./3-terrarium/solution/README.md) | CSS ప్రయోగం | ఆన్‌లైన్ టెరేరియం‌ను స్టైల్ చేయడానికి CSS నిర్మించండి, CSS ప్రాథమికాలపై దృష్టి పెట్టండి, పేజీ రిస్పాన్సివ్ చేయడం సహా | [CSS పరిచయం](./3-terrarium/2-intro-to-css/README.md) | జెన్ |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript క్లొజర్స్, DOM మేనిప్యులేషన్ | టెర్రేరియం ను డ్రాగ్/డ్రాప్ ఇంటర్‌ఫేస్‌గా రూపొందించేందుకు JavaScript ను నిర్మించండి, క్లొజర్స్ మరియు DOM మేనిప్యులేషన్ పై దృష్టి పెట్టండి | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | జెన్ | | 10 | [టెరేరియం](./3-terrarium/solution/README.md) | JavaScript closures, DOM మేనేజ్‌మెంట్ | టెరేరియం డ్రాగ్/డ్రాప్ ఇంటర్ఫేస్‌గా పని చేయడానికి జావాస్క్రిప్ట్ రూపొందించండి, closures మరియు DOM మానిప్యులేషన్ పై దృష్టి పెట్టండి | [JavaScript closures, DOM మేనేజ్‌మెంట్](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | జెన్ |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | టైపింగ్ గేమ్ నిర్మించడం | మీ JavaScript యాప్ లాజిక్‌ను కీబోర్డ్ ఈవెంట్‌ల ద్వారా నడిపించడం ఎలా చేయాలో నేర్చుకోండి | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | క్రిస్టోఫర్ | | 11 | [టైపింగ్ గేమ్](./4-typing-game/solution/README.md) | టైపింగ్ గేమ్ నిర్మించండి | మీ జావాస్క్రిప్ట్ యాప్ లాజిక్‌ను కీబోర్డ్ ఈవెంట్స్ ద్వారా ఎలా నడిపించాలో నేర్చుకోండి | [ఈవెంట్-డ్రైవెన్ ప్రోగ్రామింగ్](./4-typing-game/typing-game/README.md) | క్రిస్టోఫర్ |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | బ్రౌజర్లతో పని చేయడం | బ్రౌజర్లు ఎలా పనిచేస్తాయో, వాటి చరిత్ర, బ్రౌజర్ ఎక్స్‌టెన్షన్ యొక్క మొదటి అంశాలను ఎలా వెనక్కి సాగదీయాలో తెలుసుకోండి | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | జెన్ | | 12 | [గ్రీన్ బ్రౌసర్ ఎక్స్‌టెన్షన్](./5-browser-extension/solution/README.md) | బ్రౌసర్స్ తో పని చేయడం | బ్రౌసర్స్ ఎలా పనిచేస్తాయో, వాటి చరిత్ర, మొదటి బ్రౌసర్ ఎక్స్‌టెన్షన్ ఎలిమెంట్స్‌ను ఎలా తయారుచేయాలో నేర్చుకోండి | [బ్రౌసర్స్ గురించి](./5-browser-extension/1-about-browsers/README.md) | జెన్ |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ఫారం తయారుచేయడం, APIకు కాల్ చేయడం, స్థానిక నిల్వలో వేరియబుల్స్ నిల్వచేయడం | బ్రౌజర్ ఎక్స్‌టెన్షన్ యొక్క JavaScript అంశాలను నిర్మించి, స్థానిక నిల్వలో నిల్వ చేసిన వేరియబుల్స్ ఉపయోగించి APIని కాల్ చేయండి | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | జెన్ | | 13 | [గ్రీన్ బ్రౌసర్ ఎక్స్‌టెన్షన్](./5-browser-extension/solution/README.md) | ఫారం తయారీ, API పిలుపు మరియు లోకల్ స్టోరేజ్ లో వేరియబుల్స్ నిల్వ చేయడం | బ్రౌసర్ ఎక్స్‌టెన్షన్ లో JavaScript ఎలిమెంట్స్ ను రూపొందించండి, లోకల్ స్టోరేజ్ లో నిల్వ చేసిన వేరియబుల్స్ ఉపయోగించి API పిలవండి | [APIs, ఫారమ్స్ మరియు లోకల్ స్టోరేజ్](./5-browser-extension/2-forms-browsers-local-storage/README.md) | జెన్ |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | బ్రౌజర్ బ్యాక్‌గ్రౌండ్ ప్రాసెస్‌లు, వెబ్ పనితీరు | ఎక్స్‌టెన్షన్ ఐకాన్‌ను నిర్వహించడానికి బ్రౌజర్ బ్యాక్‌గ్రౌండ్ ప్రాసెస్‌లను ఉపయోగించండి; వెబ్ పనితీరు మరియు కొంత ఆప్టిమైజేషన్ గురించి నేర్చుకోండి | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | జెన్ | | 14 | [గ్రీన్ బ్రౌసర్ ఎక్స్‌టెన్షన్](./5-browser-extension/solution/README.md) | బ్రౌసర్ నేపథ్య ప్రక్రియలు, వెబ్ పనితీరు | ఎక్స్‌టెన్షన్ ఐకాన్ నిర్వహించడానికి బ్రౌసర్ నేపథ్య ప్రక్రియలను ఉపయోగించండి; వెబ్ పనితీరు మరియు కొన్ని ఆప్టిమైజేషన్‌ల గురించి తెలుసుకోండి | [నేపథ్య పనులు మరియు పనితీరు](./5-browser-extension/3-background-tasks-and-performance/README.md) | జెన్ |
| 15 | [Space Game](./6-space-game/solution/README.md) | JavaScript తో మరింత అభివృద్ధి గేమ్ డెవలప్‌మెంట్ | క్లాసులు మరియు కాంపోజిషన్ ఉపయోగించి వారసత్వం, Pub/Sub నమూనా గురించి నేర్చుకోండి, గేమ్ నిర్మాణానికి సిద్ధంగా ఉండండి | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | క్రిస్ | | 15 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | JavaScript తో అధునాతన గేమ్ అభివృద్ధి | క్లాసెస్ మరియు కంపోజిషన్ ఉపయోగించి వారసత్వం మరియు Pub/Sub నమూనా గురించి తెలుసుకోండి, గేమ్ నిర్మాణానికి పరిచయంగా | [అధునాతన గేమ్ అభివృద్ధి పరిచయం](./6-space-game/1-introduction/README.md) | క్రిస్ |
| 16 | [Space Game](./6-space-game/solution/README.md) | క్యాన్వాస్ డ్రాయింగ్ | స్క్రీన్‌పై ఎలిమెంట్లను గీయడానికి ఉపయోగించే Canvas API గురించి నేర్చుకోండి | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | క్రిస్ | | 16 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | కేన్వాస్ కు డ్రాయింగ్ | స్క్రీన్‌కు ఎలిమెంట్స్ డ్రా చేయడానికి ఉపయోగించే కేన్వాస్ API గురించి తెలుసుకోండి | [కేన్వాస్ కు డ్రాయింగ్](./6-space-game/2-drawing-to-canvas/README.md) | క్రిస్ |
| 17 | [Space Game](./6-space-game/solution/README.md) | స్క్రీన్‌పై ఎలిమెంట్లను కదిలించడం | కార్టేషియన్ కోఆర్డినేట్లు మరియు Canvas API ఉపయోగించి ఎలిమెంట్లకు మోషన్ ఎలా వస్తుందో గుర్తించండి | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | క్రిస్ | | 17 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | స్క్రీన్ చుట్టూ ఎలిమెంట్స్ కదలించడం | కార్టీసియన్ కోఆర్డినేట్స్ మరియు కేన్వాస్ API ఉపయోగించి ఎలిమెంట్స్‌కి మోషన్ ఎలా వస్తుందో కనుగొనండి | [ఎలిమెంట్స్ చుట్టూ కదలడం](./6-space-game/3-moving-elements-around/README.md) | క్రిస్ |
| 18 | [Space Game](./6-space-game/solution/README.md) | ఢీకు గుర్తింపు | ఎలిమెంట్లు ఒకటితో ఒకటి ఢీకు పడి స్పందించేటట్లు చేయండి, కీలను నొక్కినప్పుడు ప్రతిస్పందన కలిగి, గేమ్ పనితీరును నిర్ధారించే కూల్‌డౌన్ ఫంక్షన్ ఇవ్వండి | [Collision Detection](./6-space-game/4-collision-detection/README.md) | క్రిస్ | | 18 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | ఘర్షణ గుర్తింపు | ఎలిమెంట్స్‌ను ఒకదాన్ని మరోదానితో ఘర్షణ చేయించి, కీప్రెస్‌లను ఉపయోగించి ప్రతిస్పందన ఇస్తూ, గేమ్ పనితీరును నిర్ధారించడానికి కూల్‌డౌన్ ఫంక్షన్ అందించండి | [ఘర్షణ గుర్తింపు](./6-space-game/4-collision-detection/README.md) | క్రిస్ |
| 19 | [Space Game](./6-space-game/solution/README.md) | స్కోరు ఉంచడం | గేమ్ స్థితిగతులు మరియు పనితీరుతో సంబంధించి గణిత లెక్కింపులు నిర్వహించండి | [Keeping Score](./6-space-game/5-keeping-score/README.md) | క్రిస్ | | 19 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | స్కోర్ నిర్వహణ | గేమ్ స్థితి మరియు పనితీరు ఆధారంగా గణిత గణనలు చేయండి | [స్కోర్ నిర్వహణ](./6-space-game/5-keeping-score/README.md) | క్రిస్ |
| 20 | [Space Game](./6-space-game/solution/README.md) | గేమ్ ముగింపు మరియు రీస్టార్ట్ | గేమ్ ముగింపు మరియు రీస్టార్ట్ పై నేర్చుకోండి, అసెట్స్ సరిచూసుకోవటం మరియు వేరియబుల్ విలువలను రీసెట్ చేయడం | [The Ending Condition](./6-space-game/6-end-condition/README.md) | క్రిస్ | | 20 | [స్పేస్ గేమ్](./6-space-game/solution/README.md) | గేమ్ ముగింపు మరియు రీస్టార్ట్ | గేమ్ ముగింపు మరియు రీస్టార్ట్ గురించి తెలుసుకోండి, దీనిలో ఆస్తులు శుభ్రపరిచి, వేరియబుల్ విలువలను రీసెట్ చేయడం కూడా అందుబాటులో ఉంది | [ముగింపు షరతు](./6-space-game/6-end-condition/README.md) | క్రిస్ |
| 21 | [Banking App](./7-bank-project/solution/README.md) | వెబ్ యాప్‌లో HTML టెంప్లేట్లు మరియు రూట్లు | రూటింగ్ మరియు HTML టెంప్లేట్లను ఉపయోగించి మల్టిపేజ్ వెబ్‌సైట్ నిర్మాణాన్ని ఎలా సృష్టించాలో నేర్చుకోండి | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | యోహాన్ | | 21 | [బ్యాంకింగ్ యాప్](./7-bank-project/solution/README.md) | వెబ్ యాప్ లో HTML టెంప్లేట్స్ మరియు రూట్స్ | రౌటింగ్ మరియు HTML టెంప్లేట్లను ఉపయోగించి బహుళ పేజీ వెబ్‌సైట్ ఆర్కిటెక్చర్ నిర్మాణం ఎలా చేయాలో నేర్చుకోండి | [HTML టెంప్లేట్స్ మరియు రూట్స్](./7-bank-project/1-template-route/README.md) | యోహాన్ |
| 22 | [Banking App](./7-bank-project/solution/README.md) | లాగిన్ మరియు రిజిస్ట్రేషన్ ఫారం నిర్మాణం | ఫారమ్స్ తయారీ మరియు వాలిడేషన్ రొటీన్‌లను నిర్వహించడం గురించి నేర్చుకోండి | [Forms](./7-bank-project/2-forms/README.md) | యోహాన్ | | 22 | [బ్యాంకింగ్ యాప్](./7-bank-project/solution/README.md) | లాగిన్ మరియు రిజిస్ట్రేషన్ ఫారం నిర్మాణం | ఫారమ్స్ నిర్మించడం మరియు వాలిడేషన్ రూటీన్స్ నిర్వహణ గురించి తెలుసుకోండి | [ఫారమ్స్](./7-bank-project/2-forms/README.md) | యోహాన్ |
| 23 | [Banking App](./7-bank-project/solution/README.md) | డేటా పొందటం మరియు ఉపయోగించే పద్ధతులు | మీ యాప్‌లో డేటా ప్రవాహం ఎలా జరుగుతుందో, దాన్ని ఎలా తీసుకోవాలో, నిల్వ చేసుకోవాలో మరియు తొలగించాలో | [Data](./7-bank-project/3-data/README.md) | యోహాన్ | | 23 | [బ్యాంకింగ్ యాప్](./7-bank-project/solution/README.md) | డేటా తీసుకోవడం మరియు ఉపయోగించే విధానం | మీ యాప్‌లో డేటా ఎలా ప్రవహిస్తుంది, దానిని ఎలా తీసుకుంటారు, నిల్వ చేస్తారు మరియు ఎలా తొలగిస్తారు అనే విషయాలు | [డేటా](./7-bank-project/3-data/README.md) | యోహాన్ |
| 24 | [Banking App](./7-bank-project/solution/README.md) | స్టేట్ మేనేజ్మెంట్ సూత్రాలు | మీ యాప్ స్టేట్ ను ఎలా నిర్వహిస్తుందో, ప్రోగ్రామాటిక్గా దాన్ని ఎలా నియంత్రించాలో నేర్చుకోండి | [State Management](./7-bank-project/4-state-management/README.md) | యోహాన్ | | 24 | [బ్యాంకింగ్ యాప్](./7-bank-project/solution/README.md) | స్టేట్ మేనేజ్‌మెంట్ కాన్సెప్ట్లు | మీ యాప్ స్టేట్‌ను ఎలా నిలబెట్టుకుంటుంది మరియు ప్రోగ్రామింగ్ ద్వారా దానిని ఎలా నిర్వహించాలో తెలుసుకోండి | [స్టేట్ మేనేజ్‌మెంట్](./7-bank-project/4-state-management/README.md) | యోహాన్ |
| 25 | [Browser/VScode Code](../../8-code-editor) | VScode తో పని చేయడం | కోడ్ ఎడిటర్‌ను ఎలా ఉపయోగించాలో నేర్చుకోండి| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | క్రిస్ | | 25 | [Browser/VScode కోడ్](../../8-code-editor) | VScode తో పని చేయడం | కోడ్ ఎడిటర్ ఉపయోగించడం నేర్చుకోండి| [VScode కోడ్ ఎడిటర్ ఉపయోగించడం](./8-code-editor/1-using-a-code-editor/README.md) | క్రిస్ |
| 26 | [AI Assistants](./9-chat-project/README.md) | AI తో పని చేయడం | మీ స్వంత AI అసిస్టెంట్‌ను ఎలా నిర్మించాలో నేర్చుకోండి | [AI Assistant project](./9-chat-project/README.md) | క్రిస్ | | 26 | [AI అసిస్టెంట్స్](./9-chat-project/README.md) | AI తో పని చేయడం | మీ స్వంత AI అసిస్టెంట్‌ని ఎలా నిర్మించాలో నేర్చుకోండి | [AI అసిస్టెంట్ ప్రాజెక్ట్](./9-chat-project/README.md) | క్రిస్ |
## 🏫 పాఠశాల ## 🏫 పాఠ శాస్త్ర సూత్రా
ా పాఠ్యক্রমం రెండు ప్రధాన పాఠశాల సిద్ధాంతాలతో రూపొందించబడింది: న పాఠ్యక్రమం రెండు ప్రధాన పాఠశాస్త్ర సూత్రాలతో రూపొందించబడింది:
* ప్రాజెక్ట్ ఆధారిత అభ్యాసం * ప్రాజెక్ట్ ఆధారిత నేర్చుకోవడం
* తరచుగా క్విజ్‌లు * తరచుగా క్విజ్‌లు
ఈ ప్రోగ్రా JavaScript, HTML, CSS ప్రాథమికాలను, అలాగే నేటి వెబ్ డెవలపర్లు ఉపయోగించే తాజా పరికరాలు మరియు సాంకేతికతలను నేర్పిస్తుంది. విద్యార్థులు టైపింగ్ గేమ్, వర్చువల్ టెర్రేరియం, పర్యావరణ అనుకూల బ్రౌజర్ ఎక్స్‌టెన్షన్, స్పేస్-ఇన్వేడర్ శైలిగేమ్, మరియు వ్యాపారాల కోసం బ్యాంకింగ్ యాప్ నిర్మించడం ద్వారా అనుభవాన్ని పొందగలరు. శ్రేణి చివరికి, విద్యార్థులు వెబ్ డెవలప్‌మెంట్ పై దృఢమైన అవగాహన పొందుతారు. ఈ ప్రోగ్రామ్ జావాస్క్రిప్ట్, HTML, CSS ప్రాథమికాలు మరియు నేటి వెబ్ డెవలపర్లు ఉపయోగించే తాజా టూల్స్, సాంకేతికతలను బోధిస్తుంది. విద్యార్థులు ఒక టైపింగ్ గేమ్, వర్చువల్ టెరేరియం, పర్యావరణ హిత బ్రౌసర్ ఎక్స్‌టెన్షన్, స్పేస్ ఇన్వేడర్ స్టైల్ గేమ్ మరియు వ్యాపారాలకు బ్యాంకింగ్ యాప్‌ను తయారు చేయడం ద్వారా అనుభవం పొందగలుగుతారు. సిరీస్ చివరికి, విద్యార్థులు వెబ్ డెవలప్మెంట్‌లో స్థిరమైన అవగాహన పొందతారు.
> 🎓 మీరు Microsoft Learn లోని [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) గా తీసుకోవచ్చు!
కంటెంట్ ప్రాజెక్టులకు అనుగుణంగా ఉండడం ద్వారా, విద్యార్థులకు పాఠ్యంపాటు మరింత ఆసక్తికరంగా మారుతుంది మరియు భావనల నిలుపుదల పెరుగుతుంది. మేము JavaScript ప్రాథమికాలను పరిచయపెట్టేందుకు కొన్ని ప్రారంభ పాఠాలను కూడా రాయగా, "[Beginners Series to: 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 గురించి "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" వీడియో సిరీస్ ద్వారా నేర్చుకోవడం. ఫ్రేమ్‌ర్క్స్ పరిచయం చయకుండా, ఒక వెబ్ డెవలపర్‌గా అవసరమైన ప్రాథమిక నైపుణ్యాలపై దృష్టి పెట్టబడి రూపొందించబడిన ఈ పాఠ్యక్రమాన్ని పూర్తి చేసిన తర్వాత, 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](CODE_OF_CONDUCT.md) మరియు [Contributing](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` అని టైప్ చేయండి. వెబ్‌సైట్ localhost:3000 పోర్ట్లో సేవ్ అవుతుంది: `localhost:3000`.
## 📘 PDF ## 📘 పీడీఎఫ్ఎం
అన్ని పాఠాల PDF ను [ఇక్కడ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) కనుగొనవచ్చు. అన్ని పాఠాలు ఉన్న PDF దాన్ని [ఇక్కడ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) లో చూడవచ్చు.
## 🎒 ఇతర కోర్సులు ## 🎒 ఇతర కోర్సులు
మా టీమ్ ఇతర కోర్సులు కూడా తయారు చేస్తోంది! వీటిని చూడండి: మా బృందం మరిన్ని కోర్సులు తయారు చేస్తోంది! చూసుకోండి:
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### లాంగ్చైన్ ### 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 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)
--- ---
### ఆజ్యూర్ / ఎడ్జ్ / MCP / ఏజెంట్స్ ### Azure / Edge / MCP / Agents
[![ప్రారంభోత్సవులు కోసం 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)
[![ప్రారంభోత్సవులు కోసం ఎడ్జ్ 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 ఏజెంట్స్](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)
--- ---
### జనరేటివ్ AI సిరీస్ ### Generative AI Series
[![ప్రారంభోత్సవులు కోసం జనరేటివ్ 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 (జావా)](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 (జావాస్క్రిప్ట్)](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)
--- ---
### కోర్ లెర్నింగ్ ### Core Learning
[![ప్రారంభోత్సవులు కోసం 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 Series
[![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)
[![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)
[![కోపైలట్ అడ్వెంచర్](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 -->
## సహాయం పొందుట ## సహాయం పొందడం
మీరు అడ్డుకట్టబడినట్లయితే లేదా AI యాప్‌లను నిర్మించే విషయంలో ఏవైనా ప్రశ్నలు ఉంటే, MCP గురించి చర్చలలో సార్థక అభ్యసకులు మరియు అనుభవజ్ఞుల డెవలపర్లు చేరండి. ఇది ప్రశ్నలు స్వాగతించబడతాయి మరియు జ్ఞానం స్వేచ్ఛగా పంచుకుంటారు అటువంటి సపోర్టివ్ కమ్యూనిటీ. మీరు అడ్డుకున్నారా లేదా AI యాప్‌లను వృద్ధి చేయడంపై ఏవైనా ప్రశ్నలు ఉన్నాయా? MCP గురించి చర్చలలో మిత్ర శిక్షణార్థులు మరియు అనుభవజ్ఞులైన డెవలపర్లతో చేరండి. ఇది ప్రశ్నలు స్వాగతించబడే, జ్ఞానం స్వేచ్ఛగా పంచుకునే సహాయక సంఘం.
[![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)
మీరు నిర్మిస్తున్నప్పుడు ఉత్పత్తి గురించి అభిప్రాయాలు లేదా లోపాలుంటే సందర్శించండి: మీకు ఉత్పత్తి అభిప్రాయం లేదా నిర్మాణ సమయంలో లోపాలు ఉంటే సందర్శించండి:
[![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)
## లైసెన్స్ ## లైసెన్స్
ఈ రిపాజిటరీ MIT లైసెన్స్ కింద లైసెన్స్ చేయబడింది. మరిన్ని సమాచారం కోసం [LICENSE](../../LICENSE) ఫైల్‌ను చూడండి. ఈ రిపోజిటరీ MIT లైసెన్స్ కింద లైసెన్స్ పొందింది. మరిన్ని సమాచారం కోసం [LICENSE](../../LICENSE) ఫైల్‌ను చూడండి.
--- ---
<!-- 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 -->

@ -0,0 +1,53 @@
# Microsoft యొక్క Web-Dev-For-Beginners రెపోజిటరీ కోసం రోడ్‌మ్యాప్
**ఈ రెపోజిటరీ జావాస్క్రిప్ట్, HTML, మరియు CSS పై దృష్టి సారిస్తూ వెబ్ అభివృద్ధి ప్రాథమికాలను నేర్చుకునేందుకు రోడ్‌మ్యాప్ అందిస్తుంది. పాఠ్యक्रम సుతారుగా ఉంటుంది మరియు మొత్తం లేదా భాగాలుగా తీసుకోవచ్చు, 12 వారం కాలంలో 24 పాఠాలు ఉన్నాయి.**
## ముఖ్యమైన ముఖ్యదశలు
* **వారు 1-3:**
* ప్రోగ్రామింగ్ భాషలు మరియు వ్యాపార పరికరాల పరిచయం
* GitHub మౌలికాలు
* యాక్సెసిబిలిటీ
* JS ప్రాథమికాలు: డేటా రకాల, ఫంక్షన్లు మరియు మెథడ్లు
* JS తో నిర్ణయాలు తీసుకోవడం
* **వారు 4-6:**
* ఆరేలు మరియు లూపులు
* టెరేరియం: HTML అభ్యాసంలో
* CSS అభ్యాసంలో
* జావాస్క్రిప్ట్ క్లోజర్స్
* DOM మానిప్యులేషన్
* **వారు 7-9:**
* టైపింగ్ గేమ్: ఈవెంట్-చాళిత ప్రోగ్రామింగ్
* గ్రీన్ బ్రౌజర్ ఎక్స్‌టెన్షన్: బ్రౌజర్లతో పని చేయడం
* ఫారం నిర్మించడం, API కాల్ చేయడం మరియు లోకల్ స్టోరేజ్ లో వేరియబుల్స్ నిల్వ చేయడం
* బ్రౌజర్ లో బ్యాక్‌గ్రౌండ్ ప్రాసెసెస్
* వెబ్ పనితనం
* **వారు 10-12:**
* స్పేస్ గేమ్: జావాస్క్రిప్ట్ తో అధునాతన గేమ్ అభివృద్ధి
* కాన్వాస్ కు డ Zeich తీవ్రడం
* స్క్రీన్ మీద మూలకాలను చలనం చేయడం
* ఢీ కొలిజన్ గుర్తింపు
* స్కోర్ ఉంచడం, గేమ్ ముగింపు మరియు పునఃప్రారంభం
* బ్యాంకింగ్ యాప్: వెబ్ యాప్ లో HTML టెంప్లేట్లు మరియు రూట్లు
* లాగిన్ మరియు నమోదు ఫారం నిర్మించడం
* డేటా రాబట్టడం మరియు ఉపయోగించే పద్ధతులు
* స్థితి నిర్వహణ సూత్రాలు
## నేర్చుకున్న ఫలితాలు
**ఈ రోడ్‌మ్యాప్ పూర్తి చేయడంతో, విద్యార్థులు టైపింగ్ గేమ్, వర్చువల్ టెరేరియం, పర్యావరణ అనుకూల బ్రౌజర్ ఎక్స్‌టెన్షన్, స్పేస్-ఇన్వేడర్-స్టైల్ గేమ్ మరియు వ్యాపారాల కోసం బ్యాంకింగ్ యాప్ నిర్మాణంలో ప్రత్యక్ష అనుభవం పొందుతారు. అలాగే వారు వెబ్ అభివృద్ధి ప్రాధమికాలను బాగా అర్థం చేసుకుంటారు.**
## అదనపు వనరులు
* ఈ రెపోజిటరీ మరింత చదువుకోటానికి, ట్యుటోరియల్స్, కోడ్ ఉదాహరణలు, మరియు సవాళ్లను అందిస్తుంది.
* Microsoft Learn ప్లాట్‌ఫారం వివిధ వెబ్ అభివృద్ధి కోర్సులు మరియు నేర్చుకునే మార్గాలను అందిస్తుంది.
* Stack Overflow మరియు MDN Web Docs వంటి ఆన్‌లైన్ కమ్యూనిటీలు వెబ్ డెవలపర్లకు విలువైన మద్దతు మరియు వనరులను అందిస్తాయి.
**ఈ రోడ్‌మ్యాప్ మీ వెబ్ అభివృద్ధి ప్రయాణంలో సహాయపడాలని ఆశిస్తున్నాను!**
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**వివరణ**:
ఈ డాక్యూమెంట్ [Co-op Translator](https://github.com/Azure/co-op-translator) అనే AI అనువాద సేవను ఉపయోగించి అనువదించబడింది. మా accuracy కోసం ప్రయత్నిస్తేమో, ఆటోమేటెడ్ అనువాదాలలో పొరపాట్లు లేదా అపారదర్శకతలు ఉండవచ్చు అనే దయచేసి గమనించండి. స్థానిక భాషలో ఉన్న మూల డాక్యూమెంట్ ని అధికారిక మూలంగా పరిగణించాలి. కీలక సమాచారానికి, వృత్తిపరమైన మానవ అనువాదం సిఫార్సు చేయబడుతుంది. ఈ అనువాదం వాడకంతో కలిగే ఏవైనా తప్పు అర్థం చేసుకోవడాలు లేదా తప్పుగా అర్థం చేసుకునే పరిస్థితులకు మేము బాధ్యత వహించము.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
Loading…
Cancel
Save