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

pull/1781/head
localizeflow[bot] 6 months ago
parent 982375efbc
commit 9feaf40a01

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-03-27T23:10:41+00:00", "translation_date": "2026-04-06T17:53:48+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "lt" "language_code": "lt"
}, },
@ -516,8 +516,8 @@
"language_code": "lt" "language_code": "lt"
}, },
"README.md": { "README.md": {
"original_hash": "a2c9eed480687319517c08a6319e5536", "original_hash": "b885c87c7544109b78d6684daad6cba6",
"translation_date": "2026-03-06T17:12:06+00:00", "translation_date": "2026-04-06T17:48:22+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "lt" "language_code": "lt"
}, },

@ -2,42 +2,42 @@
## Projekto apžvalga ## Projekto apžvalga
Tai mokomasis mokymo planas, skirtas pradedantiesiems mokyti pagrindus apie interneto kūrimą. Šis mokymo planas yra išsamus 12 savaičių kursas, sukurtas Microsoft Cloud Advocates komandos, apimantis 24 praktinius užsiėmimus apie JavaScript, CSS ir HTML. Tai yra mokymo programos saugykla, skirta pradedantiesiems mokyti interneto kūrimo pagrindų. Mokymo programa yra visapusiškas 12 savaičių kursas, sukurtas Microsoft Cloud Advocates, apimantis 24 praktinius užsiėmimus apie JavaScript, CSS ir HTML.
### Pagrindinės dalys ### Pagrindinės sudedamosios dalys
- **Mokomoji medžiaga**: 24 struktūrizuoti užsiėmimai, suskirstyti į projektinius modulius - **Mokomasis turinys**: 24 struktūruotos pamokos, organizuotos pagal projektus
- **Praktiniai projektai**: Terariumas, Spausdinimo žaidimas, Naršyklės plėtinys, Kosmoso žaidimas, Banko programa, Kodo redaktorius ir AI pokalbių asistentas - **Praktiniai projektai**: Terarium, Rašymo žaidimas, Naršyklės plėtinys, Kosminis žaidimas, Banko programa, Kodo redaktorius ir AI pokalbių asistentas
- **Interaktyvūs testai**: 48 testai po 3 klausimus kiekviename (prieš ir po pamokos vertinimai) - **Interaktyvūs testai**: 48 testai po 3 klausimus kiekviename (prieš ir po pamokos vertinimai)
- **Daugiakalbė palaikymas**: Automatiniai vertimai į daugiau nei 50 kalbų per GitHub Actions - **Daugiakalbė palaikymas**: automatizuoti vertimai į daugiau nei 50 kalbų per GitHub Actions
- **Technologijos**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI projektams) - **Technologijos**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI projektams)
### Architektūra ### Architektūra
- Mokomasis saugykla su pamokų struktūra - Mokomoji saugykla su pamokomis pagrįsta struktūra
- Kiekviename pamokos kataloge yra README, kodo pavyzdžiai ir sprendimai - Kiekviena pamoka turi savo aplanką su README, kodo pavyzdžiais ir sprendimais
- Atskiri savarankiški projektai skirtinguose kataloguose (quiz-app, įvairūs pamokų projektai) - Atskiri projektai atskiruose kataloguose (quiz-app, įvairūs pamokų projektai)
- Vertimų sistema, naudojanti GitHub Actions (co-op-translator) - Vertimų sistema naudojant GitHub Actions (co-op-translator)
- Dokumentacija teikiama per Docsify ir prieinama PDF formatu - Dokumentacija pateikiama per Docsify ir prieinama PDF formatu
## Sąrankos komandos ## Diegimo komandos
Ši saugykla pirmiausia skirta mokomosios medžiagos naudojimui. Darbas su konkrečiais projektais: Ši saugykla skirta pirmiausia mokomajam turiniui vartoti. Dirbant su konkrečiais projektais:
### Pagrindinė saugyklos sąranka ### Pagrindinės saugyklos diegimas
```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 sąranka (Vue 3 + Vite) ### Testų programėlės diegimas (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Paleisti kūrimo serverį npm run dev # Paleisti kūrimo serverį
npm run build # Statyti gamybai npm run build # Kurti gamybai
npm run lint # Vykdyti ESLint npm run lint # Vykdyti ESLint
``` ```
@ -56,10 +56,10 @@ npm run format # Formatuoti su Prettier
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Laikykitės naršyklės specifinių plėtinių įkėlimo instrukcijų # Vadovaukitės naršyklės specifinėmis plėtinių įkėlimo instrukcijomis
``` ```
### Kosmoso žaidimo projektai ### Kosminio žaidimo projektai
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
@ -67,7 +67,7 @@ npm install
# Atidarykite index.html naršyklėje arba naudokite Live Server # Atidarykite index.html naršyklėje arba naudokite Live Server
``` ```
### Pokalbių projekto (Python backend) sąranka ### Pokalbių projekto (Python backend) diegimas
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
@ -78,118 +78,118 @@ python api.py
## Kūrimo darbo eiga ## Kūrimo darbo eiga
### Turinio prisidedantiems ### Turinio kūrėjams
1. **Sukurti atšaką** saugyklos savo GitHub paskyroje 1. **Padarykite saugyklos fork’ą** į savo GitHub paskyrą
2. **Klonuoti atšaką** lokaliai 2. **Klonuokite savo fork’ą** vietoje
3. **Sukurti naują šaką** savo pakeitimams 3. **Sukurkite naują šaką** savo pakeitimams
4. Redaguoti pamokų turinį arba kodo pavyzdžius 4. Redaguokite pamokų turinį arba kodo pavyzdžius
5. Išbandyti kodo pakeitimus atitinkamuose projekto kataloguose 5. Išbandykite kodo pakeitimus susijusiuose projekto kataloguose
6. Pateikti pakeitimų užklausas pagal prisidėjimo gaires 6. Pateikite pull request’us pagal indėlio taisykles
### Mokiniams ### Mokiniams
1. Atšaka arba klonas saugyklos 1. Padarykite fork’ą arba klonuokite saugyklą
2. Sekti pamokų katalogus eilės tvarka 2. Sekite pamokų katalogus nuosekliai
3. Skaityti kiekvieno užsiėmimo README failus 3. Skaitykite README failus kiekvienoje pamokoje
4. Atlikti testus prieš pamoką adresu https://ff-quizzes.netlify.app/web/ 4. Užbaikite priešpamokinius testus adresu https://ff-quizzes.netlify.app/web/
5. Dirbti su kodo pavyzdžiais pamokų kataloguose 5. Dirbkite su kodo pavyzdžiais pamokų aplankuose
6. Atlikti užduotis ir iššūkius 6. Atlikite užduotis ir iššūkius
7. Atlikti testus po pamokos 7. Išbandykite po pamokos testus
### Tiesioginis kūrimas ### Tiesioginis kūrimas
- **Dokumentacija**: paleisti `docsify serve` šakniniame kataloge (prievadas 3000) - **Dokumentacija**: paleiskite `docsify serve` pagrindiniame kataloge (3000 portas)
- **Quiz App**: paleisti `npm run dev` quiz-app kataloge - **Testų programėlė**: paleiskite `npm run dev` quiz-app kataloge
- **Projektai**: naudoti VS Code Live Server plėtinį HTML projektams - **Projektai**: naudokite VS Code Live Server plėtinį HTML projektams
- **API projektai**: paleisti `npm start` atitinkamuose API kataloguose - **API projektai**: paleiskite `npm start` atitinkamuose API kataloguose
## Testavimo instrukcijos ## Testavimo instrukcijos
### Quiz App testavimas ### Testų programėlės testavimas
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Patikrinkite kodo stiliaus problemas npm run lint # Patikrinkite kodo stiliaus problemas
npm run build # Patvirtinkite, kad kūrimas sėkmingas npm run build # Patvirtinkite, kad sukūrimas pavyksta
``` ```
### Banko API testavimas ### Banko API testavimas
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Patikrinti kodo stiliaus problemas npm run lint # Patikrinkite kodo stiliaus klaidas
node server.js # Patvirtinti, kad serveris startuoja be klaidų node server.js # Patikrinkite, ar serveris paleidžiamas be klaidų
``` ```
### Bendras testavimo požiūris ### Bendras testavimo metodas
- Tai mokomasis saugykla be išsamių automatinių testų - Tai yra mokomoji saugykla be išsamiai automatizuotų testų
- Rankinis testavimas daugiausia sutelktas į: - Rankinis testavimas orientuotas į:
- Kodo pavyzdžiai veikia be klaidų - Kodo pavyzdžių veikimą be klaidų
- Dokumentacijos nuorodos veikia tinkamai - Nuorodų dokumentacijoje veikimą
- Projektų kūrimas sėkmingas - Sėkmingą projektų surinkimą
- Pavyzdžiai atitinka gerąsias praktikas - Pavyzdžių atitikimą geriausioms praktikoms
### Prieš pateikiant patikrinimai ### Patikrinimai prieš pateikiant pakeitimus
- Paleisti `npm run lint` kataloguose su package.json - Paleiskite `npm run lint` kataloguose su package.json
- Patikrinti, ar markdown nuorodos galioja - Patikrinkite, ar markdown nuorodos veikia
- Išbandyti kodo pavyzdžius naršyklėje arba Node.js - Išbandykite kodo pavyzdžius naršyklėje arba Node.js
- Patvirtinti, kad vertimai išlaiko tinkamą struktūrą - Įsitikinkite, kad vertimai išlaiko struktūrą
## Kodo stiliaus gairės ## Kodo stiliaus gairės
### JavaScript ### JavaScript
- Naudoti modernią ES6+ sintaksę - Naudokite modernią ES6+ sintaksę
- Laikytis standartinių ESLint konfigūracijų projektuose - Laikykitės standartinių ESLint konfigūracijų projektuose
- Naudoti prasmingus kintamųjų ir funkcijų pavadinimus mokymuisi - Naudokite prasmingus kintamųjų ir funkcijų pavadinimus mokomajam aiškumui
- Pridėti komentarus, paaiškinančius sąvokas mokiniams - Rašykite komentarus, paaiškinančius koncepcijas mokiniams
- Formatuoti naudojant Prettier, kur tai konfigūruota - Formatuokite naudodami Prettier, jei konfigūruota
### HTML/CSS ### HTML/CSS
- Semantiški HTML5 elementai - Semantiniai HTML5 elementai
- Reaguojantis dizainas - Atsakingo dizaino principai
- Aiškios klasių pavadinimų konvencijos - Aiškios klasių vardų konvencijos
- Komentarai, paaiškinantys CSS metodikas mokiniams - Komentarai paaiškinantys CSS technikas mokiniams
### Python ### Python
- PEP 8 stiliaus gairės - PEP 8 stiliaus gairės
- Aiškūs, mokomieji kodo pavyzdžiai - Aiškūs, mokomieji kodo pavyzdžiai
- Rekomenduojami tipų užuominomis, kur naudingas mokymuisi - Tipų užuominos, kur naudingos mokymuisi
### Markdown dokumentacija ### Markdown dokumentacija
- Aiški antraščių hierarchija - Aiški antraščių hierarchija
- Kodo blokai su kalbos nurodymu - Kodo blokai su kalbos žymėjimu
- Nuorodos į papildomus išteklius - Nuorodos į papildomus šaltinius
- Ekrano nuotraukos ir vaizdai `images/` kataloguose - Ekrano nuotraukos ir paveikslėliai `images/` kataloguose
- Alternatyvus tekstas vaizdams prieinamumui - Alt tekstas paveikslėliams prieinamumui
### Failų organizavimas ### Failų organizavimas
- Pamokos numeruotos seka (1-getting-started-lessons, 2-js-basics ir t.t.) - Pamokos numeruojamos nuosekliai (1-getting-started-lessons, 2-js-basics ir kt.)
- Kiekviename projekte yra `solution/` ir dažnai `start/` arba `your-work/` katalogai - Kiekvienas projektas turi `solution/` ir dažnai `start/` arba `your-work/` katalogus
- Vaizdai saugomi konkrečių pamokų `images/` aplankuose - Paveikslėliai saugomi kiekvienos pamokos `images/` aplankuose
- Vertimai `translations/{language-code}/` struktūroje - Vertimai saugomi `translations/{kalbos-kodas}/` struktūroje
## Kūrimas ir diegimas ## Surinkimas ir diegimas
### Quiz App diegimas (Azure Static Web Apps) ### Testų programėlės diegimas (Azure Static Web Apps)
quiz-app konfigūruotas Azure Static Web Apps diegimui: Quiz-app sukonfigūruotas Azure Static Web Apps diegimui:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Sukuria dist/ aplanką npm run build # Sukuria dist/ aplanką
# Diegia per GitHub Actions darbo eigą į pagrindinę šaką paspaudus # Diegia per GitHub Actions darbo eigą, kai į pagrindinę šaką įdedama nauja versija
``` ```
Azure Static Web Apps konfigūracija: Azure Static Web Apps konfigūracija:
- **Programos vieta**: `/quiz-app` - **Programėlės vieta**: `/quiz-app`
- **Išvesties vieta**: `dist` - **Išvesties vieta**: `dist`
- **Darbo eiga**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Darbo eiga**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
@ -197,82 +197,82 @@ Azure Static Web Apps konfigūracija:
```bash ```bash
npm install # Įdiekite docsify-to-pdf npm install # Įdiekite docsify-to-pdf
npm run convert # Sugeneruokite PDF iš dokumentų npm run convert # Generuoti PDF iš dokumentų
``` ```
### Docsify dokumentacija ### Docsify dokumentacija
```bash ```bash
npm install -g docsify-cli # Įdiekite Docsify globaliai npm install -g docsify-cli # Įdiekite Docsify globaliai
docsify serve # Aptarnauti localhost:3000 docsify serve # Tiekite per localhost:3000
``` ```
### Projektų specifiniai kūrimo procesai ### Projektams būdingi surinkimo veiksmai
Kiekvienas projekto katalogas gali turėti savą kūrimo procesą: Kiekviename projekto kataloge gali būti savas surinkimo procesas:
- Vue projektai: `npm run build` sukuria produkcinius paketus - Vue projektai: `npm run build` sukuria gamybinius paketus
- Statiniai projektai: Nereikia kūrimo žingsnio, failai tiekiami tiesiogiai - Statiniai projektai: nėra surinkimo žingsnio, failai tiesiogiai tiekiami
## Pull Request gairės ## Pull request gairės
### Pavadinimo formatas ### Pavadinimų formatas
Naudoti aiškius, apibūdinančius pavadinimus, nurodančius pakeitimo sritį: Naudokite aiškius, aprašomuosius pavadinimus, nurodančius pakeitimo sritį:
- `[Quiz-app] Add new quiz for lesson X` - `[Quiz-app] Įdėti naują testą pamokai X`
- `[Lesson-3] Fix typo in terrarium project` - `[Lesson-3] Ištaisytas rašybos klaida terariumo projekte`
- `[Translation] Add Spanish translation for lesson 5` - `[Translation] Įterptas ispaniškas vertimas pamokai 5`
- `[Docs] Update setup instructions` - `[Docs] Atnaujintos diegimo instrukcijos`
### Reikalingi patikrinimai ### Būtini patikrinimai
Prieš pateikiant PR: Prieš pateikiant PR:
1. **Kodo kokybė**: 1. **Kodo kokybė**:
- Paleisti `npm run lint` paveiktuose projekto kataloguose - Paleiskite `npm run lint` paveiktuose projekto kataloguose
- Ištaisyti visas lint klaidas ir įspėjimus - Ištaisyti visus lint klaidų ir įspėjimų pranešimus
2. **Kūrimo patikra**: 2. **Surinkimo patikra**:
- Jeigu taikoma, paleisti `npm run build` - Jei taikoma, paleiskite `npm run build`
- Užtikrinti, kad nebūtų kūrimo klaidų - Užtikrinkite, kad nėra surinkimo klaidų
3. **Nuorodų tikrinimas**: 3. **Nuorodų tikrinimas**:
- Išbandyti visas markdown nuorodas - Išbandykite visas markdown nuorodas
- Patikrinti, ar vaizdų nuorodos veikia - Patikrinkite paveikslėlių nuorodas
4. **Turinio peržiūra**: 4. **Turinio peržiūra**:
- Taisyti rašybos ir gramatikos klaidas - Redagavimas dėl rašybos ir gramatikos
- Užtikrinti, kad kodo pavyzdžiai būtų teisingi ir mokomieji - Užtikrinkite, kad kodo pavyzdžiai yra teisingi ir mokomieji
- Patikrinti, kad vertimai atitinka originalią prasmę - Patikrinkite, ar vertimai išlaiko originalią prasmę
### Prisidėjimo reikalavimai ### Indėlio reikalavimai
- Sutikti su Microsoft CLA (automatinis patikrinimas pirmo PR metu) - Sutikite su Microsoft CLA (automatizuotas patikrinimas pirmam PR)
- Laikytis [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Laikykitės [Microsoft atvirojo kodo elgesio kodekso](https://opensource.microsoft.com/codeofconduct/)
- Perskaityti [CONTRIBUTING.md](./CONTRIBUTING.md) išsamioms gairėms - Žr. [CONTRIBUTING.md](./CONTRIBUTING.md) dėl išsamesnių gairių
- Nurodyti atitinkamus problemų numerius PR aprašyme, jei taikoma - Nurodykite problemų numerius PR aprašyme, jei taikoma
### Peržiūros procesas ### Peržiūros procesas
- PR peržiūri prižiūrėtojai ir bendruomenė - PR peržiūri prižiūrėtojai ir bendruomenė
- Prioritetas skiriamas mokymosi aiškumui - Prioritetas skiriamas mokomajam aiškumui
- Kodo pavyzdžiai turi atitikti dabartines gerąsias praktikas - Kodo pavyzdžiai turi atitikti dabartines geriausias praktikas
- Vertimai tikrinami dėl tikslumo ir kultūrinio atitikimo - Vertimai peržiūrimi dėl tikslumo ir kultūrinės tinkamumo
## Vertimų sistema ## Vertimų sistema
### Automatizuoti vertimai ### Automatizuotas vertimas
- Naudoja GitHub Actions su co-op-translator darbo eiga - Naudoja GitHub Actions su co-op-translator darbo eiga
- Automatiškai verčia į daugiau nei 50 kalbų - Automatiškai verčia į daugiau nei 50 kalbų
- Šaltinių failai pagrindiniuose kataloguose - Šaltinio failai pagrindiniuose kataloguose
- Išversti failai `translations/{language-code}/` kataloguose - Išversti failai saugomi `translations/{kalbos-kodas}/` kataloguose
### Rankinių vertimų patobulinimų pridėjimas ### Rankinių vertimų patobulinimų pridėjimas
1. Rasti failą `translations/{language-code}/` kataloge 1. Raskite failą `translations/{kalbos-kodas}/`
2. Atlikti pataisas, išlaikant struktūrą 2. Atlikite patobulinimus saugodami struktūrą
3. Užtikrinti, kad kodo pavyzdžiai veiktų 3. Įsitikinkite, kad kodo pavyzdžiai veikia
4. Išbandyti lokalizuotą testų turinį 4. Išbandykite lokalizuotą testų turinį
### Vertimų metaduomenys ### Vertimų metaduomenys
@ -293,116 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### Dažnos problemos ### Dažnos problemos
**Quiz app nepaleidžiamas**: **Testų programėlė nepaleidžiama**:
- Patikrinti Node.js versiją (rekomenduojama v14+) - Patikrinkite Node.js versiją (rekomenduojama v14+)
- Ištrinti `node_modules` ir `package-lock.json`, paleisti `npm install` iš naujo - Ištrinkite `node_modules` ir `package-lock.json`, vėl paleiskite `npm install`
- Patikrinti prievadų konfliktus (numatyta: Vite naudoja 5173 prievadą) - Pasitikrinkite, ar nėra prievado konflikto (numatyta: Vite naudoja 5173 prievadą)
**API serveris nepaleidžiamas**: **API serveris nepaleidžiamas**:
- Patvirtinti, kad Node.js versija atitinka reikalavimus (node >=10) - Patikrinkite, ar Node.js versija atitinka reikalavimus (node >=10)
- Patikrinti, ar prievadas nėra užimtas - Įsitikinkite, kad prievadas nėra užimtas
- Įsitikinti, kad visos priklausomybės įdiegtos su `npm install` - Užtikrinkite, kad įdiegti visi priklausymai su `npm install`
**Naršyklės plėtinys neužsikrauna**: **Naršyklės plėtinys nesikrauna**:
- Patikrinti, ar manifest.json formatas teisingas - Patikrinkite, ar manifest.json tinkamai suformatuotas
- Peržiūrėti naršyklės konsolę klaidų - Peržiūrėkite naršyklės konsolę dėl klaidų
- Vadovautis naršyklės plėtinio diegimo instrukcijomis - Laikykitės naršyklės specifinių plėtinių diegimo instrukcijų
**Python pokalbių projekto problemos**: **Python pokalbių projekto problemos**:
- Įsitikinti, kad įdiegta OpenAI biblioteka: `pip install openai` - Įsitikinkite, kad įdiegtas OpenAI paketas: `pip install openai`
- Patikrinti, ar nustatytas GITHUB_TOKEN aplinkos variable - Patikrinkite, ar nustatytas GITHUB_TOKEN aplinkos kintamasis
- Patikrinti GitHub Models prieigos leidimus - Patikrinkite GitHub modelių prieigos leidimus
**Docsify nedemonstruoja dokumentų**: **Docsify nesuteikia dokumentacijos**:
- Įdiegti docsify-cli globaliai: `npm install -g docsify-cli` - Įdiekite docsify-cli globaliai: `npm install -g docsify-cli`
- Paleisti iš saugyklos šaknies - Paleiskite iš saugyklos šaknies katalogo
- Patikrinti, ar egzistuoja `docs/_sidebar.md` - Įsitikinkite, kad egzistuoja `docs/_sidebar.md`
### Kūrimo aplinkos patarimai ### Kūrimo aplinkos patarimai
- Naudoti VS Code su Live Server plėtiniu HTML projektams - Naudokite VS Code su Live Server plėtiniu HTML projektams
- Įdiegti ESLint ir Prettier plėtinius nuosekliam formatavimui - Įdiekite ESLint ir Prettier plėtinius vientisam formatavimui
- Naudoti naršyklės DevTools JavaScript derinimui - Naudokite naršyklės DevTools JavaScript derinimui
- Vue projektams įdiegti Vue DevTools naršyklės plėtinį - Vue projektams įdiekite Vue DevTools naršyklės plėtinį
### Veikimo našumas ### Veikimo optimizavimas
- Daug išverstų failų (daugiau nei 50 kalbų) reiškia didelius klonus - Daug išverstų failų (daugiau nei 50 kalbų) reiškia, kad pilni klonai yra dideli
- Naudoti sekliu klonavimą, jei dirbama tik su turiniu: `git clone --depth 1` - Naudokite seklią klonavimą, jei dirbate tik su turiniu: `git clone --depth 1`
- Išskirti vertimus paieškose dirbant su anglų kalba - Vertimus išskirkite iš paieškų dirbant su anglų turiniu
- Kūrimo procesai gali būti lėti pirmo paleidimo metu (npm install, Vite build) - Surinkimo procesai gali būti lėtesni pirmą kartą (npm install, Vite build)
## Saugumo aspektai ## Saugumo svarstymai
### Aplinkos kintamieji ### Aplinkos kintamieji
- API raktai neturi būti saugomi saugykloje - API raktai niekada neturėtų būti įtraukti į saugyklą
- Naudoti `.env` failus (jau įtraukta į `.gitignore`) - Naudokite `.env` failus (jau įtraukti į `.gitignore`)
- Dokumentuoti reikalingus aplinkos kintamuosius README failuose - Dokumentuokite reikalingus aplinkos kintamuosius projekto README
### Python projektai ### Python projektai
- Naudoti virtualias aplinkas: `python -m venv venv` - Naudokite virtualias aplinkas: `python -m venv venv`
- Laikyti priklausomybes atnaujintas - Laikykite priklausomybes atnaujintas
- GitHub tokenai turi turėti minimalias reikalingas teises - GitHub token’ai turi turėti tik minimalias reikalingas teises
### GitHub Models prieiga ### GitHub modelių prieiga
- Reikalingi asmeniniai prieigos tokenai (PAT) GitHub Models - Reikia asmeninių prieigos tokenų (PAT) GitHub modeliams
- Tokenai laikomi aplinkos kintamuosiuose - Token’us saugokite kaip aplinkos kintamuosius
- Niekuomet neįtraukti tokenų ar prisijungimo duomenų į saugyklą - Niekada nenaudokite commit’inant tokenų ar prisijungimo duomenų
## Papildomos pastabos ## Papildomos pastabos
### Tikslinė auditorija ### Tikslinė auditorija
- Absoliutūs pradedantieji interneto kūrime - Visi pradedantieji interneto kūrime
- Studentai ir savarankiški mokymosi dalyviai - Studentai ir savarankiškai besimokantys
- Mokytojai, naudojantys mokymo planą klasėse - Mokytojai, naudojantys mokymo programą klasėse
- Turinys pritaikytas prieinamumui ir palaipsniui įgūdžių ugdymui - Turinys pritaikytas prieinamumui ir palaipsniui įgyjamam įgūdžių augimui
### Mokymosi filosofija ### Mokymosi filosofija
- Projektinis mokymasis - Mokymasis per projektus
- Dažni žinių patikrinimai (testai) - Dažni žinių patikrinimai (testai)
- Praktiniai programavimo užsiėmimai - Praktiniai kodo rašymo pratimai
- Realūs taikymo pavyzdžiai - Realūs pritaikymo pavyzdžiai
- Dėmesys pagrindams prieš karkasus - Dėmesys pagrindams prieš technologijų karkasus
### Saugyklos priežiūra ### Saugyklos priežiūra
- Aktyvi mokinių ir prisidedančių bendruomenė - Aktyvi mokinių ir prisidėjusiųjų bendruomenė
- Reguliarūs priklausomybių ir turinio atnaujinimai - Reguliarūs atnaujinimai priklausomybių ir turinio srityje
- Problemos ir diskusijos prižiūrimos vykdytojų - Problemos ir diskusijos stebimos prižiūrėtojų
- Vertimų atnaujinimai automatizuoti per GitHub Actions - Vertimų atnaujinimai automatiškai per GitHub Actions
### Susiję ištekliai ### Susiję ištekliai
- [Microsoft Learn moduliai](https://docs.microsoft.com/learn/) - [Microsoft Learn moduliai](https://docs.microsoft.com/learn/)
- [Studentų centro ištekliai](https://docs.microsoft.com/learn/student-hub/) - [Studentų centras](https://docs.microsoft.com/learn/student-hub/)
- Rekomenduojama naudoti [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) mokymuisi - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) rekomenduojamas mokiniams
- Papildomi kursai: generatyvus AI, duomenų mokslas, ML, IoT - Papildomi kursai: Generatyvinis AI, Duomenų mokslas, ML, IoT programos
### Darbas su konkrečiais projektais ### Darbas su konkrečiais projektais
Išsamias instrukcijas apie atskirus projektus žr. README failuose: Išsamias instrukcijas žr. README failuose:
- `quiz-app/README.md` - Vue 3 viktorinos programa - `quiz-app/README.md` - Vue 3 testų programėlė
- `7-bank-project/README.md` - Banko programa su autentifikacija - `7-bank-project/README.md` - Banko programa su autentifikacija
- `5-browser-extension/README.md` - Naršyklės plėtinių kūrimas - `5-browser-extension/README.md` - Naršyklės plėtinio kūrimas
- `6-space-game/README.md` - Canvas pagrindu veikiantis žaidimas - `6-space-game/README.md` - Canvas pagrindu sukurtas žaidimas
- `9-chat-project/README.md` - AI pokalbių asistento projektas - `9-chat-project/README.md` - AI pokalbių asistento projektas
### Monorepo struktūra ### Monorepo struktūra
Nors nėra tradicinė monorepo saugykla, ši saugykla talpina kelis nepriklausomus projektus: Nors tai nėra tradicinis monorepozitorijus, ši saugykla talpina kelis nepriklausomus projektus:
- Kiekviena pamoka savaime užbaigta - Kiekviena pamoka yra savarankiška
- Projektai nesidalina priklausomybėmis - Projektai nesidalija priklausomybėmis
- Galima dirbti su atskirais projektais nepaveikiant kitų - Dirbkite su atskirais projektais nesutrigdami kitų
- Norint gauti pilną mokymo patirtį, rekomenduojama klonuoti visą saugyklą - Klonuokite visą repo norėdami turėti visą mokymo programą
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Atsakomybės apribojimas**: **Atsakomybės apribojimas**:
Šis dokumentas buvo išverstas naudojant dirbtinio intelekto vertimo paslaugą [Co-op Translator](https://github.com/Azure/co-op-translator). Nors siekiame tikslumo, atkreipkite dėmesį, kad automatizuoti vertimai gali turėti klaidų arba netikslumų. Originalus dokumentas gimtąja kalba turėtų būti laikomas autoritetingu šaltiniu. Kritiniais atvejais rekomenduojama naudotis profesionalių žmonių vertimais. Mes neatsakome už bet kokius nesusipratimus ar neteisingas interpretacijas, kylančias iš šio vertimo naudojimo. Šis dokumentas buvo išverstas naudojant dirbtinio intelekto vertimo paslaugą [Co-op Translator](https://github.com/Azure/co-op-translator). Nors siekiame tikslumo, prašome atkreipti dėmesį, kad automatiniai vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba laikomas autoritetingu šaltiniu. Svarbiai informacijai rekomenduojamas profesionalus žmogaus vertimas. Mes neatsakome už bet kokius nesusipratimus ar neteisingus aiškinimus, atsirandančius naudojant šį vertimą.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -10,29 +10,29 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Interneto svetainių kūrimas pradedantiesiems – Mokymo programa # Interneto svetainių kūrimas pradedantiesiems – mokymo planas
Išmokite interneto svetainių kūrimo pagrindus su mūsų 12 savaičių išsamiu kursu, kurį rengia Microsoft Cloud Advocates komanda. Kiekvienoje iš 24 pamokų gilinsitės į JavaScript, CSS ir HTML per praktinius projektus, tokius kaip terariumai, naršyklės plėtiniai ir kosmoso žaidimai. Dalyvaukite viktorinose, diskusijose ir praktiniuose užduotyse. Tobulinkite savo įgūdžius ir optimizuokite žinių įsisavinimą efektyvios projektinės pedagogikos dėka. Pradėkite savo programavimo kelią jau šiandien! Išmokite interneto svetainių kūrimo pagrindus per mūsų 12 savaičių išsamų kursą, kurį veda Microsoft Cloud Advocates komanda. Kiekviena iš 24 pamokų detalizuojama JavaScript, CSS ir HTML temas, dirbant su praktiniais projektais, tokiais kaip terariumai, naršyklės plėtiniai ir erdvės žaidimai. Dalyvaukite viktorinose, diskusijose ir praktiniuose užduotyse. Tobulinkite savo įgūdžius ir optimizuokite žinių įsisavinimą naudojant mūsų efektyvią projektinę pedagogiką. Pradėkite savo programavimo kelionę jau šiandien!
Prisijunkite prie Azure AI Foundry Discord bendruomenės Prisijunkite prie Azure AI Foundry Discord bendruomenės
[![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)
Vadovaukitės žemiau nurodytais žingsniais, kad pradėtumėte naudotis šiomis priemonėmis: Atlikite šiuos žingsnius, kad pradėtumėte naudotis šiomis priemonėmis:
1. **Padarykite šaką (“Fork”)**: Spustelėkite [![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. **Padarykite Forką**: Spauskite [![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. **Klonuokite saugyklą**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klonuokite Saugyklą**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Prisijunkite prie Azure AI Foundry Discord, susipažinkite su ekspertais ir kitais programuotojais**](https://discord.com/invite/ByRwuEEgH4) 3. [**Prisijunkite prie Azure AI Foundry Discord ir susitikite su ekspertais bei kitais kūrėjais**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Daugialypė kalbų palaikymas ### 🌐 Daugiakalbė parama
#### Palaikoma per GitHub Action (automatizuota ir visada naujausia) #### Palaikoma per GitHub Action (automatizuota ir visuomet atnaujinta)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](./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](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](./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)
> **Norite klonuoti vietoje?** > **Norite klonuoti lokalizuotai?**
> >
> Ši saugykla apima daugiau nei 50 kalbų vertimų, todėl reikšmingai padidėja atsisiuntimo dydis. Norėdami klonuoti be vertimų, naudokite partial checkout: > Šioje saugykloje yra daugiau kaip 50 kalbų vertimų, dėl ko labai padidėja atsisiuntimo dydis. Jei norite klonuoti be vertimų, naudokite sparse checkout:
> >
> **Bash / macOS / Linux:** > **Bash / macOS / Linux:**
> ```bash > ```bash
@ -48,233 +48,233 @@ Vadovaukitės žemiau nurodytais žingsniais, kad pradėtumėte naudotis šiomis
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> Tai suteikia viską, ko reikia kursui atlikti, žymiai greičiau atsisiunčiant. > Taip gausite viską, ko reikia kursui atlikti, žymiai greičiau atsisiųsdami.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Jei norite, kad būtų palaikomos papildomos vertimų kalbos, jos išvardytos [čia](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Jei norite, kad būtų pridedamos papildomos palaikomos kalbos, jos išvardytos [čia](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Atidaryti Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Ar esate studentas?_ #### 🧑‍🎓 _Ar esi studentas?_
Apsilankykite [**Studentų centro puslapyje**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kur rasite pradedančiųjų išteklius, studentų paketus ir net būdus gauti nemokamą sertifikato kuponą. Šis puslapis verta įtraukti į žymes ir kartas nuo karto patikrinti, nes kas mėnesį atnaujinsime turinį. Aplankyk [**Studentų centrą puslapį**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kur rasi pradedančiųjų resursus, studentų paketus ir net galimybes gauti nemokamą sertifikato kuponą. Tai puslapis, kurį verta pažymėti ir periodiškai tikrinti, nes mes kas mėnesį atnaujiname turinį.
### 📣 Pranešimas – Nauji GitHub Copilot Agent režimo iššūkiai! ### 📣 Pranešimas – Nauji GitHub Copilot Agent režimo iššūkiai!
Pridėtas naujas iššūkis – ieškokite "GitHub Copilot Agent Challenge 🚀" daugelyje skyrių. Tai naujas iššūkis, kurį galite atlikti naudodami GitHub Copilot ir Agent režimą. Jei dar nenaudojote Agent režimo, jis ne tik generuoja tekstą, bet ir gali kurti bei redaguoti failus, vykdyti komandas ir dar daugiau. Pridėtas naujas iššūkis – ieškokite "GitHub Copilot Agent Challenge 🚀" daugelyje skyrių. Tai naujas iššūkis, skirtas atlikti naudojant GitHub Copilot ir Agent režimą. Jei dar nenaudojote Agent režimo, jis ne tik generuoja tekstą, bet gali ir kurti bei redaguoti failus, vykdyti komandas ir daugiau.
### 📣 Pranešimas – _Naujas projektas, sukurtas naudojant Generatyvinį AI_ ### 📣 Pranešimas – _Naujas projektas generuojant dirbtiniu intelektu_
Naujas AI asistentas projektas ką tik pridėtas, pažiūrėkite [projektą](./9-chat-project/README.md) Pridėtas naujas AI Asistento projektas, pažiūrėkite [projektą](./9-chat-project/README.md)
### 📣 Pranešimas – _Nauja programa_ apie Generatyvinį AI JavaScript kalbai ką tik išleista ### 📣 Pranešimas – _Naujasis Generatyvinio DI kursas JavaScript buvo ką tik išleistas_
Nepraleiskite mūsų naujo Generatyvinio AI kurso! Nepraleiskite mūsų naujo Generatyvinio DI mokymo plano!
Apsilankykite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ir pradėkite! Aplankykite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ir pradėkite!
![Background](../../translated_images/lt/background.148a8d43afde5730.webp) ![Background](../../translated_images/lt/background.148a8d43afde5730.webp)
- Pamokos apimančios viską nuo pagrindų iki RAG. - Pamokos, apimančios viską nuo pagrindų iki RAG.
- Sąveika su istorinių personažų naudojant GenAI ir mūsų kompanioninę programėlę. - Sąveikaukite su istorinių veikėjų personažais naudodami GenAI ir mūsų palydovinę programėlę.
- Smagi ir įtraukianti pasakojimo forma, tarsi keliautumėte laiku! - Linksma ir įtraukianti istorija, keliausite laiku!
![character](../../translated_images/lt/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/lt/character.5c0dd8e067ffd693.webp)
Kiekvienoje pamokoje pateikiama užduotis, žinių patikrinimas ir iššūkis, kurie nukreips jus mokytis tokių temų kaip: Kiekviena pamoka apima užduotį, žinių patikrinimą ir iššūkį, kuris padės išmokti:
- Komandų rašymas ir jų kūrimo inžinerija - Užklausų ir užklausų inžinerijos
- Teksto ir vaizdų programėlių kūrimas - Teksto ir vaizdo programėlių generavimo
- Paieškos programėlės - Paieškos programėlių
Apsilankykite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ir pradėkite! Aplankykite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ir pradėkite!
## 🌱 Pradžia ## 🌱 Pradžia
> **Mokytojai**, mes [įtraukėme kelis pasiūlymus](for-teachers.md), kaip naudoti šią mokymo programą. Labai laukiame jūsų atsiliepimų [mūsų diskusijų forume](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Mokytojai**, mes paruošėme [kelias rekomendacijas](for-teachers.md), kaip naudotis šiuo mokymo planu. Labai laukiame jūsų atsiliepimų [mūsų diskusijų forume](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Mokiniai](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, kiekvienai pamokai pradėkite nuo priešpaskaitinės viktorinos, po to skaitykite paskaitos medžiagą, atlikite įvairias veiklas ir patikrinkite savo supratimą po paskaitos viktorina. **[Mokiniai](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, kiekvienos pamokos pradžioje pradėkite nuo priešpaskaitinės viktorinos, vėliau peržiūrėkite paskaitos medžiagą, atlikite įvairias užduotis ir pasitikrinkite savo supratimą paskaitos pabaigos viktorinoje.
Norėdami geriau mokytis, susisiekite su savo bendraklasiais ir dirbkite kartu prie projektų! Diskusijos skatinamos mūsų [diskusijų forume](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kuriame mūsų moderatoriai pasiruošę atsakyti į jūsų klausimus. Siekiant pagerinti mokymosi patirtį, susisiekite su savo bendraamžiais ir dirbkite kartu prie projektų! Skatintinos diskusijos mūsų [diskusijų forume](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kuriame dirba mūsų moderatorių komanda, pasirengusi atsakyti į jūsų klausimus.
Tolesniam mokymuisi labai rekomenduojame tyrinėti [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) dėl papildomų mokymosi medžiagų. Norėdami toliau tobulėti, rekomenduojame peržiūrėti [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) papildomoms mokomosioms medžiagoms.
### 📋 Aplinkos paruošimas ### 📋 Aplinkos paruošimas
Ši mokymo programa turi paruoštą vystymo aplinką! Pradėdami galite pasirinkti vykdyti programą [Codespace](https://github.com/features/codespaces/) aplinkoje (naršyklėje, nereikia nieko įdiegti) arba vietoje savo kompiuteryje naudodami teksto redaktorių, pvz., [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Šiam mokymo planui yra paruošta plėtros aplinka! Pradėdami galite pasirinkti vykdyti kursą [Codespace](https://github.com/features/codespaces/) aplinkoje (_naršyklėje, nereikia diegti jokių programų_), arba lokaliai savo kompiuteryje naudodami teksto redaktorių, pvz., [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Sukurkite savo saugyklą #### Sukurkite savo saugyklą
Kad galėtumėte lengvai išsaugoti savo darbus, rekomenduojama sukurti savo šios saugyklos kopiją. Tai galite padaryti spustelėję **Naudoti šabloną (Use this template)** mygtuką puslapio viršuje. Tai sukurs naują saugyklą jūsų GitHub paskyroje su šios mokymo programos kopija. Kad lengvai išsaugotumėte savo darbus, rekomenduojama sukurti savo šios saugyklos kopiją. Tai galite padaryti paspaudę mygtuką **Use this template** šio puslapio viršuje. Tai sukurs naują saugyklą jūsų GitHub paskyroje su šio mokymo plano kopija.
Vadovaukitės šiais žingsniais: Atlikite šiuos veiksmus:
1. **Padarykite šaką (“Fork”)**: Spustelėkite mygtuką „Fork“ viršutiniame dešiniajame kampe. 1. **Padarykite Fork**: Spauskite "Fork" mygtuką viršutiniame dešiniajame puslapio kampe.
2. **Klonuokite saugyklą**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Klonuokite Saugyklą**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Vykdymas Codespace aplinkoje #### Kursą vykdykite Codespace aplinkoje
Jūsų sukurtos kopijos saugykloje spustelėkite mygtuką **Code** ir pasirinkite **Open with Codespaces**. Tai sukurs naują Codespace aplinką darbui. Jūsų sukurtos saugyklos lange spauskite **Code** mygtuką ir pasirinkite **Open with Codespaces**. Tai sukurs naują Codespace, kuriame galėsite dirbti.
![Codespace](../../translated_images/lt/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/lt/createcodespace.0238bbf4d7a8d955.webp)
#### Vykdymas vietoje kompiuteryje #### Kursą vykdykite lokaliai savo kompiuteryje
Norėdami vykdyti šią mokymo programą vietoje savo kompiuteryje, jums reikės teksto redaktoriaus, naršyklės ir komandų eilutės įrankio. Mūsų pirmoji pamoka, [Įvadas į programavimo kalbas ir darbo įrankius](../../1-getting-started-lessons/1-intro-to-programming-languages), supažindins su įvairiomis šių įrankių galimybėmis, kad galėtumėte pasirinkti, kas jums tinka geriausiai. Norėdami vykdyti kursą lokaliai savo kompiuteryje, jums reikės teksto redaktoriaus, naršyklės ir komandų eilutės įrankio. Mūsų pirma pamoka [Programavimo kalbų ir darbo įrankių įvadas](../../1-getting-started-lessons/1-intro-to-programming-languages) supažindins jus su įvairiomis šių įrankių pasirinkimo galimybėmis, kad galėtumėte pasirinkti tinkamiausią.
Rekomenduojame naudoti [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kaip redaktorių, kuris taip pat turi integruotą [Terminalą](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code galite atsisiųsti [čia](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Rekomenduojame naudoti [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) kaip redaktorių, kuris taip pat turi integruotą [Terminalą](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code galite parsisiųsti [čia](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Nuklonuokite savo saugyklą į savo kompiuterį. Tai galite padaryti paspaudę mygtuką **Code** ir nukopijavę URL: 1. Nuklonuokite savo saugyklą į savo kompiuterį. Tai galite padaryti spustelėję mygtuką **Code** ir nukopijavę URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
Tada atidarykite [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) aplinkoje ir paleiskite šią komandą, pakeisdami `<your-repository-url>` nukopijuotu URL: Tada atidarykite [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) aplinkoje ir vykdykite šią komandą, pakeisdami `<your-repository-url>` į ką tik nukopijuotą URL:
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Atidarykite aplanką Visual Studio Code. Tai galite padaryti paspaudę **File** > **Open Folder** ir pasirinkę ką tik nuklonuotą aplanką. 2. Atidarykite aplanką Visual Studio Code. Tai galite padaryti spustelėję **File** > **Open Folder** ir pasirinkdami ką tik nuklonuotą aplanką.
> Rekomenduojami Visual Studio Code papildiniai: > Rekomenduojami Visual Studio Code plėtiniai:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) – HTML puslapių peržiūrai Visual Studio Code aplinkoje > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML puslapių peržiūrai Visual Studio Code aplinkoje
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) – skirti greičiau rašyti kodą > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - padeda greičiau rašyti kodą
## 📂 Kiekviena pamoka apima: ## 📂 Kiekviena pamoka apima:
- papildomą eskizą - neprivalomą sketchnote užrašą
- papildomą vaizdo įrašą - neprivalomą papildomą vaizdo įrašą
- įžanginį klausimų testą prieš pamoką - šiltinimo viktoriną prieš pamoką
- rašytinę pamoką - rašytinę pamoką
- projekto pagrindu sukurtas pamokas su žingsnis po žingsnio gidu, kaip sukurti projektą - projektinėse pamokose – žingsnis po žingsnio instrukcijas, kaip sukurti projektą
- žinių patikrinimus - žinių patikrinimus
- iššūkį - iššūkį
- papildomą literatūrą - papildomą skaitymą
- namų darbą - užduotį
- [pabaigos testą](https://ff-quizzes.netlify.app/web/) - [pamokos pabaigos viktoriną](https://ff-quizzes.netlify.app/web/)
> **Pastaba apie testus**: Visi testai yra Quiz-app aplanke, iš viso 48 testai po tris klausimus kiekviename. Jie pasiekiami [čia](https://ff-quizzes.netlify.app/web/), testų programėlę galima paleisti vietoje arba išdėstyti Azure; vykdykite nurodymus `quiz-app` aplanke. > **Pastaba apie viktorinas**: Visos viktorinos yra Quiz-app aplanke, iš viso 48 viktorinos po tris klausimus kiekvienoje. Jas rasite [čia](https://ff-quizzes.netlify.app/web/) – viktorinų programėlę galima paleisti lokaliai arba diegti Azure; sekite nurodymus `quiz-app` aplanke.
## 🗃️ Pamokos ## 🗃️ Pamokos
| | Projekto pavadinimas | Mokomi konceptai | Mokymosi tikslai | Susieta pamoka | Autorius | | | Projekto pavadinimas | Mokomi konceptai | Mokymosi tikslai | Susietos pamokos | Autorius |
| :-: | :--------------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-----------------------: | | :-: | :---------------------------------------------------------------: | :-------------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------: | :-----------------------: |
| 01 | Pradžioje | Programavimo įvadas ir naudojamos priemonės | Sužinokite pagrindinius daugumos programavimo kalbų principus ir apie programas, kurios padeda profesionaliems kūrėjams atlikti darbą | [Programavimo kalbų ir įrankių įvadas](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Pradžia | Programavimo pagrindai ir naudojami įrankiai | Sužinokite pagrindinius daugumos programavimo kalbų pagrindus ir apie programinę įrangą, padedančią profesionalams | [Įvadas į programavimo kalbas ir įrankius](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Pradžioje | GitHub pagrindai, įskaitant darbą komandoje | Kaip naudoti GitHub savo projekte, kaip bendradarbiauti su kitais prie kodo bazės | [GitHub įvadas](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Pradžia | GitHub pagrindai, įskaitant komandinius darbus | Kaip naudotis GitHub projekte, kaip bendradarbiauti dirbant su kodo baze | [Įvadas į GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Pradžioje | Prieinamumas | Sužinokite apie interneto prieinamumo pagrindus | [Prieinamumo pagrindai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Pradžia | Prieinamumas | Sužinokite interneto prieinamumo pagrindus | [Prieinamumo pagrindai](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS pagrindai | JavaScript duomenų tipai | JavaScript duomenų tipų pagrindai | [Duomenų tipai](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | JS pagrindai | JavaScript duomenų tipai | JavaScript duomenų tipų pagrindai | [Duomenų tipai](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS pagrindai | Funkcijos ir metodai | Sužinokite apie funkcijas ir metodus valdyti programos logiką | [Funkcijos ir metodai](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | | 05 | JS pagrindai | Funkcijos ir metodai | Sužinokite apie funkcijas ir metodus, valdančius programos logikos eigą | [Funkcijos ir metodai](./2-js-basics/2-functions-methods/README.md) | Jasmine ir Christopher |
| 06 | JS pagrindai | Sprendimų priėmimas su JS | Išmokite kurti sąlygas savo kode naudodami sprendimų priėmimo metodus | [Sprendimų priėmimas](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | JS pagrindai | Sprendimų priėmimas JS | Sužinokite, kaip sukurti sąlygas savo kode naudojant sprendimų priėmimo būdus | [Sprendimų kūrimas](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS pagrindai | Masyvai ir ciklai | Dirbkite su duomenimis naudodami masyvus ir ciklus JavaScript | [Masyvai ir ciklai](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | JS pagrindai | Masyvai ir ciklai | Darbas su duomenimis naudojant masyvus ir ciklus JavaScript | [Masyvai ir ciklai](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikoje | Sukurkite HTML kodo dalį internetiniam terariumui, daugiausia dėmesio skiriant išdėstymui | [Įvadas į HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikoje | Sukurkite HTML, kad sukurtumėte internetinį terariumą, koncentruojantis į išdėstymo kūrimą | [Įvadas į HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikoje | Sukurkite CSS stilių internetiniam terariumui, pažindami CSS pagrindus ir kaip padaryti puslapį responsyvų | [Įvadas į CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikoje | Sukurkite CSS, kad stilizuotumėte internetinį terariumą, įskaitant pagrindus ir atsaką į skirtingų ekranų dydžius | [Įvadas į CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript uždarymai, DOM manipuliacija | Sukurkite JavaScript, kad terariumas veiktų kaip drag/drop sąsaja, daugiausia dėmesio skiriant uždaromosioms funkcijoms ir DOM manipuliacijai | [JavaScript uždarymai, DOM manipuliacija](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closure ir DOM manipuliavimas | Parašykite JavaScript, kad terariumas veiktų kaip vilkimo / metimo sąsaja, koncentruojantis į closure ir DOM manipuliavimą | [JavaScript Closure ir DOM manipuliavimas](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Parašyk žaidimą | Sužinokite, kaip naudoti klaviatūros įvykius valdyti JavaScript programos logiką | [Įvykių valdomas programavimas](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Rašymo žaidimas](./4-typing-game/solution/README.md) | Sukurkite rašymo žaidimą | Sužinokite, kaip naudoti klaviatūros įvykius valdyti jūsų JavaScript programos logiką | [Įvykių valdymas](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Darbas su naršyklėmis | Sužinokite, kaip veikia naršyklės, jų istoriją ir kaip sukurti naršyklės plėtinio pagrindinius elementus | [Apie naršykles](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Žalioji naršyklės plėtinys](./5-browser-extension/solution/README.md) | Darbas su naršyklėmis | Sužinokite, kaip veikia naršyklės, jų istoriją ir kaip sukurti pirmuosius naršyklės plėtinio elementus | [Apie naršykles](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Formos kūrimas, API iškvietimas ir kintamųjų saugojimas vietinėje atmintyje | Sukurkite naršyklės plėtinio JavaScript dalį, kuri iškviečia API, naudodama vietinėje atmintyje saugomus kintamuosius | [API, formos ir vietinė atmintis](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Žalioji naršyklės plėtinys](./5-browser-extension/solution/README.md) | Formos kūrimas, API kvietimas ir kintamųjų saugojimas local storage | Parašykite naršyklės plėtinio JavaScript elementus, kad kvietumėte API naudodami kintamuosius saugojamus local storage | [API, formos ir local storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Naršyklės fono procesai, svetainės našumas | Naudokite naršyklės fono procesus plėtinio piktogramos valdymui; sužinokite apie svetainės našumą ir optimizacijas | [Fono užduotys ir našumas](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Žalioji naršyklės plėtinys](./5-browser-extension/solution/README.md) | Naršyklės fono procesai, žiniatinklio našumas | Naudokite naršyklės foninius procesus plėtinio ikonų valdymui; sužinokite apie žiniatinklio našumą bei optimizacijas | [Fono darbai ir našumas](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Pažengęs žaidimų kūrimas su JavaScript | Sužinokite apie paveldėjimą naudojant klases ir kompoziciją bei Pub/Sub modelį, rengiantis kurti žaidimą | [Įvadas į pažangų žaidimų kūrimą](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Sudėtingesnis žaidimų kūrimas su JavaScript | Sužinokite apie paveldėjimą naudojant klases ir kompoziciją, taip pat Pub/Sub modelį žaidimo kūrimui | [Įvadas į pažangų žaidimų kūrimą](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Piešimas ant drobės | Sužinokite apie Canvas API, naudojamą elementams piešti ekrane | [Piešimas ant drobės](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Piešimas ant drobės | Sužinokite apie Canvas API, kuris leidžia piešti elementus ekrane | [Piešimas ant drobės](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Elementų judinimas ekrane | Sužinokite, kaip elementai gali judėti naudodami Dekarto koordinates ir Canvas API | [Judančių elementų valdymas](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Elementų judinimas ekrane | Sužinokite, kaip elementai gali judėti naudojant kartezines koordinates ir Canvas API | [Elementų judinimas ekrane](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Susidūrimo aptikimas | Padarykite, kad elementai susidurtų ir reaguotų vienas į kitą naudojant klaviatūros mygtukus bei įveskite pertraukos funkciją, kad žaidimas veiktų sklandžiai | [Susidūrimo aptikimas](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Kolizijos aptikimas | Sukurkite elementų susidūrimus ir reakcijas į rakto paspaudimus, įdiekite „cooldown“ funkciją žaidimo našumui užtikrinti | [Kolizijos aptikimas](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Rezultatų skaičiavimas | Atlikite matematinius skaičiavimus pagal žaidimo būseną ir rezultatus | [Rezultatų skaičiavimas](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Taškų skaičiavimas | Atlikite matematikos skaičiavimus pagal žaidimo būseną ir rezultatus | [Taškų skaičiavimas](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Žaidimo užbaigimas ir paleidimas iš naujo | Sužinokite apie žaidimo užbaigimą ir paleidimą iš naujo, įskaitant resursų išvalymą ir kintamųjų reikšmių atstatymą | [Žaidimo pabaigos sąlyga](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Kosmoso žaidimas](./6-space-game/solution/README.md) | Žaidimo pabaiga ir paleidimas iš naujo | Sužinokite apie žaidimo pabaigą ir iš naujo paleidimą, įskaitant išteklių valymą ir kintamųjų reikšmių atstatymą | [Pabaigos sąlyga](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML šablonai ir maršrutinimas internetinėje programoje | Sužinokite, kaip sukurti daugiapusės svetainės struktūrą naudojant maršrutinimą ir HTML šablonus | [HTML šablonai ir maršrutinimas](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Banko programa](./7-bank-project/solution/README.md) | HTML šablonai ir maršrutizacija web programoje | Sužinokite, kaip sukurti daugiapusės svetainės architektūrą naudojant maršrutizavimą ir HTML šablonus | [HTML šablonai ir maršrutizacija](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Prisijungimo ir registracijos formos kūrimas | Sužinokite apie formų kūrimą ir validacijos tvarkymą | [Formos](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Banko programa](./7-bank-project/solution/README.md) | Prisijungimo ir registracijos formos kūrimas | Sužinokite apie formų kūrimą ir validacijos tvarkymą | [Formos](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Duomenų gavimo ir naudojimo metodai | Kaip duomenys patenka į programėlę, kaip juos gauti, saugoti ir išmesti | [Duomenys](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banko programa](./7-bank-project/solution/README.md) | Duomenų gavimo ir naudojimo būdai | Kaip duomenys teka jūsų programoje, kaip juos gauti, saugoti ir išmesti | [Duomenys](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Būsenos valdymo konceptai | Sužinokite, kaip programa išlaiko būseną ir kaip ją valdyti programuojant | [Būsenos valdymas](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banko programa](./7-bank-project/solution/README.md) | Būsenos valdymo konceptai | Sužinokite, kaip jūsų programa saugo būseną ir kaip ją valdyti programiškai | [Būsenos valdymas](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Naršyklės/VScode kodas](../../8-code-editor) | Darbas su VScode | Sužinokite, kaip naudotis kodo redaktoriumi | [Naudojant VScode redaktorių](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Naršyklės / VScode kodas](../../8-code-editor) | Darbas su VScode | Išmokite naudotis kodo redaktoriumi | [Naudokite VScode redaktorių](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [Dirbtinio intelekto asistentai](./9-chat-project/README.md) | Darbas su DI | Sužinokite, kaip sukurti savo DI asistentą | [DI asistento projektas](./9-chat-project/README.md) | Chris | | 26 | [AI asistentai](./9-chat-project/README.md) | Darbas su AI | Išmokite sukurti savo AI asistentą | [AI asistento projektas](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogika ## 🏫 Pedagogika
Mūsų mokymo programa sukurta atsižvelgiant į du pagrindinius pedagoginius principus: Mūsų mokymo programa sukurta remiantis dviem pagrindinėmis pedagoginėmis taisyklėmis:
* projektų pagrindu mokymasis * mokymasis per projektus
* dažni testai * dažnos viktorinos
Programa moko JavaScript, HTML ir CSS pagrindų, taip pat naujausių įrankių ir technikų, kurias naudoja šiandienos interneto kūrėjai. Studentai galės įgyti praktinės patirties kurdami rašymo žaidimą, virtualų terariumą, ekologišką naršyklės plėtinį, erdvės užpuoliko stiliaus žaidimą ir verslo bankinę programėlę. Baigę šią programą studentai turės tvirtą supratimą apie interneto kūrimą. Programa moko JavaScript, HTML ir CSS pagrindus bei naujausius įrankius ir metodus, kuriuos naudoja šių dienų interneto kūrėjai. Studentai turės galimybę įgyti praktinės patirties kuriant rašymo žaidimą, virtualų terariumą, ekologišką naršyklės plėtinį, kosmoso invazijos tipo žaidimą ir verslo banko programėlę. Baigus šį ciklą studentai įgis tvirtą supratimą apie interneto kūrimą.
> 🎓 Šias pirmas kelias pamokas šioje mokymo programoje galite atlikti kaip [Mokymosi kelią](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) Microsoft Learn platformoje! > 🎓 Pirmas kelias šios programos pamokas galite atlikti kaip [Mokymosi kelią](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) Microsoft Learn platformoje!
Užtikrindami, kad turinys atitiktų projektus, procesas tampa įdomesnis studentams ir padeda geriau įsisavinti koncepcijas. Taip pat parengėme kelias pradines pamokas apie JavaScript pagrindus, suporuotas su vaizdo įrašu iš „[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)“ vaizdo įrašų kolekcijos, kurių kai kurie autoriai prisidėjo prie šios programos kūrimo. Užtikrinant, kad turinys atitiktų projektus, procesas tampa labiau įtraukiantis studentams, o konceptų įsisavinimas pagerėja. Taip pat parašėme keletą pradinio lygio pamokų JavaScript pagrindams supažindinti, jas lydi video iš „[Pradedančiųjų serijos į JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)“ kolekcijos, kurios autorių dalyvavo ir šioje programoje.
Be to, žemas testas prieš pamoką nukreipia studentų dėmesį į mokymosi temą, o antras testas po pamokos užtikrina papildomą įsisavinimą. Ši mokymo programa sukurta būti lanksti ir įdomi, ją galima atlikti visą arba dalinai. Projektai prasideda nuo paprastų ir tampa vis sudėtingesni per 12 savaičių ciklą. Be to, žemesnio slenksčio viktorina prieš pamoką nukreipia studentų dėmesį mokytis temą, o antroji viktorina po pamokos užtikrina geresnį įsisavinimą. Ši programa sukurta taip, kad būtų lanksti ir smagi, ją galima atlikti visa arba dalimis. Projektai prasideda nedideli ir pamažu tampa vis sudėtingesni per visą 12 savaičių ciklą.
Nors sąmoningai vengėme pristatyti JavaScript karkasus, kad sutelktume dėmesį į pagrindinius įgūdžius, reikalingus interneto kūrėjui, geras tolesnis žingsnis baigus šią programą būtų išmokti apie Node.js per kitą vaizdo įrašų kolekciją: „[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)“. Nors sąmoningai vengėme įvesti JavaScript karkasus, kad susikoncentruotume į pagrindinius įgūdžius, reikalingus kaip interneto kūrėjui prieš pereinant prie karkasų, gera tolesnė žingsnis būtų išmokti apie Node.js per kitą video kolekciją: „[Pradedančiųjų serija į Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)“.
> Apsilankykite mūsų [Elgesio kodekse](CODE_OF_CONDUCT.md) ir [Prisidėjimo](CONTRIBUTING.md) gairėse. Laukiame jūsų konstruktyvios grįžtamosios informacijos! > Apsilankykite mūsų [Elgesio kodekse](CODE_OF_CONDUCT.md) ir [Dalyvavimo taisyklėse](CONTRIBUTING.md). Laukiame jūsų konstruktyvių atsiliepimų!
## 🧭 Offline prieiga ## 🧭 Offline prieiga
Šią dokumentaciją galite paleisti offline naudodami [Docsify](https://docsify.js.org/#/). Fork’inkite šį repo, [įdiekite Docsify](https://docsify.js.org/#/quickstart) savo kompiuteryje, tada rakto aplanke paleiskite komandą `docsify serve`. Svetainė bus pateikta per 3000 porto adresu jūsų localhost: `localhost:3000`. Šią dokumentaciją galite naudoti offline naudodami [Docsify](https://docsify.js.org/#/). Nuklonuokite šį repo, [įdiekite Docsify](https://docsify.js.org/#/quickstart) savo vietinėje mašinoje, tada šio repo šakniniame aplanke paleiskite `docsify serve`. Svetainė bus pasiekiama per 3000 prievadą jūsų localhost: `localhost:3000`.
## 📘 PDF ## 📘 PDF
PDF su visomis pamokomis rasite [čia](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). Visų pamokų PDF galite rasti [čia](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Kitos Pamokos ## 🎒 Kiti kursai
Mūsų komanda kuria ir kitas pamokas! Peržiūrėkite: Mūsų komanda kuria ir kitus kursus! Pažiūrėkite:
<!-- 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 pradedantiesiems](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 pradedantiesiems](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) [![LangChain pradedantiesiems](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 / Agentai ### Azure / Edge / MCP / Agentai
[![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 pradedantiesiems](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 pradedantiesiems](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 pradedantiesiems](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 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 agentai pradedantiesiems](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)
--- ---
### Generatyvioji Dirbtinis Intelektas serija ### Generatyviosios AI serija
[![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) [![Generatyvi AI pradedantiesiems](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) [![Generatyvi 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) [![Generatyvi 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 (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) [![Generatyvi 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)
--- ---
### Pagrindinis Mokymasis ### Pagrindiniai mokymai
[![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 pradedantiesiems](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) [![Duomenų mokslas pradedantiesiems](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 pradedantiesiems](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[![Cybersecurity 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) [![Kibernetinis saugumas pradedantiesiems](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[![Web 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) [![Tinklapių kūrimas pradedantiesiems](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 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) [![IoT pradedantiesiems](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 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) [![XR kūrimas pradedantiesiems](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
--- ---
### Copilot Serija ### Copilot serija
[![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 AI programuotojams](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 C#/.NET programuotojams](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 nuotykiai](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 -->
## Pagalbos gavimas ## Pagalba
Jei užstringate arba turite klausimų apie DI programų kūrimą. Prisijunkite prie kitų besimokančių ir patyrusių programuotojų diskusijose apie MCP. Tai palaikanti bendruomenė, kurioje klausimai laukiami, o žinios dalijamos laisvai. Jei užstrigote arba turite klausimų apie AI programėlių kūrimą. Prisijunkite prie bendraminčių ir patyrusių programuotojų diskusijų apie MCP. Tai palaikanti bendruomenė, kurioje klausimai laukiami, o žinios laisvai dalijamos.
[![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)
Jei turite produktų atsiliepimų arba pastebite klaidų kurdami, apsilankykite: Jei turite produktų atsiliepimų arba randate klaidų kūrimo metu, apsilankykite:
[![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)
## Licencija ## Licencija
Šis saugykla yra licencijuota pagal MIT licenciją. Daugiau informacijos rasite faile [LICENSE](../../LICENSE). Šis saugykla licencijuota pagal MIT licenciją. Daugiau informacijos žr. faile [LICENSE](../../LICENSE).
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Atsakomybės ribojimas**: **Atsakomybės apribojimas**:
Šis dokumentas buvo išverstas naudojant dirbtinio intelekto vertimo paslaugą [Co-op Translator](https://github.com/Azure/co-op-translator). Nors stengiamės užtikrinti tikslumą, atkreipkite dėmesį, kad automatizuoti vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba turėtų būti laikomas autoritetingu šaltiniu. Esant svarbiai informacijai, rekomenduojama pasitelkti profesionalų žmogaus vertimą. Mes neprisiimame atsakomybės už bet kokius nesusipratimus ar neteisingus aiškinimus, kylančius dėl šio vertimo naudojimo. Šis dokumentas buvo išverstas naudojant AI vertimo paslaugą [Co-op Translator](https://github.com/Azure/co-op-translator). Nors siekiame tikslumo, prašome atkreipti dėmesį, kad automatiniai vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba turėtų būti laikomas autoritetingu šaltiniu. Kritiškai svarbiai informacijai rekomenduojamas profesionalus žmogiškas vertimas. Mes neatsakome už jokius nesusipratimus ar neteisingus aiškinimus, kilusius naudojant šį vertimą.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-03-27T23:08:22+00:00", "translation_date": "2026-04-06T17:49:59+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "my" "language_code": "my"
}, },
@ -516,8 +516,8 @@
"language_code": "my" "language_code": "my"
}, },
"README.md": { "README.md": {
"original_hash": "a2c9eed480687319517c08a6319e5536", "original_hash": "b885c87c7544109b78d6684daad6cba6",
"translation_date": "2026-03-06T16:56:19+00:00", "translation_date": "2026-04-06T17:44:35+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "my" "language_code": "my"
}, },

@ -2,27 +2,27 @@
## Project Overview ## Project Overview
ဤသည်မှာ အခြေခံအဆင့် ဝက်ဘ် ဖွံ့ဖြိုးတိုးတက်မှုကို သင်ကြားရန် အတွက် ပညာရေး သင်ရိုးညွှန်းတမ်း သိမ်းဆည်းရာ ရှိသော repository ဖြစ်သည်။ သင်ရိုးညွှန်းတမ်းတွင် Microsoft Cloud Advocates မှ တီထွင်ထားသော ၁၂ ပတ်ကြာ သင်တန်းလုံလောက်ပြီး JavaScript, CSS နှင့် HTML ကို အကျဉ်းချုပ် ပါဝင်တဲ့ လက်တွေ့သင်ခန်းစာ ၂၄ ခု ပါဝင်သည်။ ဒီဟာက web ဖန်တီးမှု အခြေခံသင်ခန်းစာတွေကို အစမှစသင်ကြားဖို့ အတွက် ပညာရေး အတွက် သင်ကြားမှု လေ့လာရေး စာစောင်တစ်ခု ဖြစ်ပါတယ်။ ဒီသင်ကြားရေးအစီအစဉ်ဟာ Microsoft Cloud Advocates တွေက ဖန်တီးထားတဲ့ ၁၂ ပတ်ကြာ သင်ရိုးအစီအစဉ် ပြည့်စုံပြီး၊ JavaScript, CSS နဲ့ HTML ကို အခြေခံဖြင့် ပြုလုပ်ထားတဲ့ လက်တွေ့လေ့ကျင့်ခန်း ၂၄ ခု ပါဝင်ပါတယ်။
### Key Components ### Key Components
- **ပညာရေး အကြောင်းအရာ**: ၂၄ ခုသော ဖွဲ့စည်းထားသော သင်ခန်းစာများကို ပရောဂျက်အခြေပြု ပုံစံဖြင့် စီစဉ်ထားသည် - **ပညာရေး အကြောင်းအရာ**: စီမံချက်အခြေခံ မော်ဂျူးများအဖြစ် အစီအစဉ်ပြုလုပ်ထားသော ၂၄ ခန်းသင်ခန်းစာများ
- **လက်တွေ့ ပရောဂျက်များ**: Terrarium၊ Typing Game၊ Browser Extension၊ Space Game၊ Banking App၊ Code Editor နှင့် AI Chat Assistant - **လက်တွေ့ပရောဂျက်များ**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, နဲ့ AI Chat Assistant
- **အပြန်အလှန် စစ်တမ်းများ**: သင်ခန်းစာနှင့် မတိုင်မှီ/နောက်ပိုင်း စစ်တမ်း ၄၈ ခု၊ မေးခွန်းသုံးခုစီပါဝင်သည် - **အပြန်အလှန် စမ်းသပ်မေးခွန်းများ**: ခန်းသင်ခန်းစာများမတိုင်မီနဲ့ပြီးနောက် အစီအစဉ် ၄၈ ခု၊ မေးခွန်း ၃ ခုစီ ပါဝင်သည်
- **ဘာသာစကား များစွာ ထောက်ခံမှု**: GitHub Actions ဖြင့် ၅၀ ကျော်သော ဘာသာစကားများအတွက် အလိုအလျောက် ဘာသာပြန်မှုများ - **ဘာသာစကား အတန်းပြိုင်ပံ့ပိုးမှု**: GitHub Actions အသုံးပြုပြီး ဘာသာပြန်မှု ၅၀ ကျော်ကို အလိုအလျောက်ပြုလုပ်ခြင်း
- **နည်းပညာများ**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI ပရောဂျက်များအတွက်) - **နည်းပညာများ**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI ပရောဂျက်များအတွက်)
### Architecture ### Architecture
- သင်ခန်းစာအခြေပြု ပညာရေး repository - သင်ခန်းစာအခြေခံ ပညာရေး အရင်းအမြစ်
- သင်ခန်းစာ folder တစ်ခုစီတွင် README, code ဥပမာများနှင့် ဖြေရှင်းချက်များ ပါဝင်သည် - ထိုသင်ခန်းစာကို ဖိုင်အတွင်း README, ကုဒ်ဥပမာ၊ ဖြေရှင်းနည်းများ ပါရှိသည်
- quiz-app နှင့် အခြား သီးခြားပရောဂျက်များအတွက် အလွတ် directory များ - ပရောဂျက်များကို စတင်ဖိုင်ခွဲခြင်းဖြင့် (quiz-app, အကွာအဝေးရှိသောသင်ခန်းစာပရောဂျက်များ)
- GitHub Actions အသုံးပြုပြီး ဘာသာပြန် မော်ဒယ်စနစ် (co-op-translator) - GitHub Actions ဖြင့် ဘာသာပြန်မှုစနစ် တည်ဆောက်ထားသည် (co-op-translator)
- Docsify အသုံးပြု၍ စာတမ်းရေးဆွဲမှု ပြုလုပ်ပြီး PDF အဖြစ် ရနိုင်သည် - Docsify ဖြင့် စာတမ်းစာတမ်းများ ပေးပို့ပြီး PDF အဖြစ်လည်း ရနိုင်
## Setup Commands ## Setup Commands
ဤ repository သည် ပညာရေး အကြောင်းအရာ စမ်းသုံးခြင်း အထူးပြုထားသည်။ အထူးပရောဂျက်များနှင့် ဆောင်ရွက်ရန်အတွက် - ဒီရေှာပလာ ဖြင့် ပညာရေးအကြောင်းအရာ အသုံးပြုရန်သာ ရည်ရွယ်ထားသည်။ သီးသန့် ပရောဂျက်များကို အလုပ်လုပ်ရန်။
### Main Repository Setup ### Main Repository Setup
@ -36,9 +36,9 @@ cd Web-Dev-For-Beginners
```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 ကို chạy ပါ npm run lint # ESLint ကို လည်ပတ်ပါ
``` ```
### Bank Project API (Node.js + Express) ### Bank Project API (Node.js + Express)
@ -46,9 +46,9 @@ npm run lint # ESLint ကို chạy ပါ
```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 ### Browser Extension Projects
@ -56,7 +56,7 @@ npm run format # Prettier ဖြင့် ဖော်မက် ပြုလ
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# ဘရောက်ဇာအလိုက် ထပ်ဆောင်းပုံတင်ခြင်း လမ်းညွှန်ချက်များကိုလိုက်နာပါ # ဘရောက်ဇာအလိုက် သီးခြား extension ဖွင့်သည့် ညွှန်ကြားချက်များအား လိုက်နာရန်
``` ```
### Space Game Projects ### Space Game Projects
@ -64,7 +64,7 @@ npm install
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# index.html ကို browser မှာ ဖွင့်ပါ သို့မဟုတ် Live Server ကို အသုံးပြုပါ # index.html ကို browser မှာဖွင့်ပါ သို့မဟုတ် Live Server ကိုသုံးပါ
``` ```
### Chat Project (Python Backend) ### Chat Project (Python Backend)
@ -72,7 +72,7 @@ npm install
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# GITHUB_TOKEN ပတ်ဝန်းကျင် သတ်မှတ်ချက်ကို သတ်မှတ်ပါ # GITHUB_TOKEN ပတ်ဝန်းကျင်အပြောင်းအလဲတတ်သော သတ်မှတ်ပါ
python api.py python api.py
``` ```
@ -80,29 +80,29 @@ python api.py
### For Content Contributors ### For Content Contributors
1. သင်၏ GitHub မှာ repository ကို **fork** ပြုလုပ်ပါ 1. **သင့် GitHub အကောင့်သို့ repo ကို fork လုပ်ပါ**
2. သင်၏ fork ကို လုပ်ဆောင်ရန် **clone** လုပ်ပါ 2. **သင့် fork ကို ဒေသတွင်း clone လုပ်ပါ**
3. ပြင်ဆင်မှုများအတွက် **branch အသစ်** ဖန်တီးပါ 3. **မပြောင်းလဲမှုအတွက် ဧရိယာအသစ်တစ်ခု ဖန်တီးပါ**
4. သင်ခန်းစာ အကြောင်းအရာ သို့မဟုတ် code ဥပမာများ ဆက်လက်ပြင်ဆင်ပါ 4. သင်ခန်းစာ အကြောင်းအရာ သို့မဟုတ် ကုဒ်ဥပမာများ ပြင်ဆင်ပါ
5. သက်ဆိုင်ရာ ပရောဂျက် directory များတွင် code ပြင်ဆင်မှုများ စမ်းသပ်ပါ 5. သက်ဆိုင်ရာ ပရောဂျက်ဖိုလ်ဒါများတွင် ကုဒ်ပြောင်းလဲမှုများ စမ်းသပ်ပါ
6. အညွှန်းလိုက်၍ pull request များတင်ပါ 6. ပံ့ပိုးမှု လမ်းညွှန်ချက်အတိုင်း pull request များတင်သွင်းပါ
### For Learners ### For Learners
1. Repository ကို fork သို့မဟုတ် clone လုပ်ပါ 1. Repo ကို fork လုပ် သို့မဟုတ် clone လုပ်ပါ
2. သင်ခန်းစာ directory များကို အဆင့်လိုက် သွားပါ 2. သင်ခန်းစာဖိုလ်ဒါများကို တရားဝင်လိုက်နာ ပြီး သွားပါ
3. တစ်ခုစီသင်ခန်းစာ README ဖတ်ပါ 3. ခန်းသင်စာများအတွက် README ဖိုင်များ ဖတ်ပါ
4. https://ff-quizzes.netlify.app/web/ တွင် သင်ခန်းစာ မတိုင်မှီ စစ်တမ်းများ ဖြေဆိုပါ 4. https://ff-quizzes.netlify.app/web/ တွင် သင်ခန်းစာမတိုင်မီ စစ်ဆေးမေးခွန်းများ ဖြေဆိုပါ
5. သင်ခန်းစာ folder တွင် code ဥပမာများ လေ့လာပါ 5. သင်ခန်းစာဖိုလ်ဒါများအတွင်း ကုဒ်ဥပမာများနှင့် လေ့ကျင့်ပါ
6. အလုပ်အပ်နှင့် စိန်ခေါ်မှုများ ပြီးမြောက်ပါ 6. အလုပ်များနှင့် စိန်ခေါ်မှုများ ပြီးမြောက်ပါ
7. သင်ခန်းစာ ပြီးနောက် စစ်တမ်းများ ဖြေဆိုပါ 7. သင်ခန်းစာပြီးနောက် စစ်ဆေးမေးခွန်းများ ဖြေပါ
### Live Development ### Live Development
- **စာတမ်းရေးဆွဲခြင်း**: root တွင် `docsify serve` လုပ်ပါ (port 3000) - **စာတမ်းစာရွက်များ**: root တွင် `docsify serve` နှင့် ကိုင်တွယ်ပါ (port 3000)
- **Quiz App**: quiz-app directory တွင် `npm run dev` ပြုလုပ်ပါ - **Quiz App**: quiz-app ဖိုလ်ဒါ၌ `npm run dev` ကို အသုံးပြုပါ
- **ပရောဂျက်များ**: HTML ပရောဂျက်များအတွက် VS Code Live Server extension အသုံးပြုပါ - **ပရောဂျက်များ**: HTML ပရောဂျက်များအတွက် VS Code Live Server extension သုံးပါ
- **API ပရောဂျက်များ**: သက်ဆိုင်ရာ API directory တွင် `npm start` ပြုလုပ်ပါ - **API ပရောဂျက်များ**: သက်ဆိုင်ရာ API ဖိုလ်ဒါများတွင် `npm start` ကို run လုပ်ပါ
## Testing Instructions ## Testing Instructions
@ -110,8 +110,8 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # သို့သော် အညွှန်းစတိုင်ပြဿနာများကို စစ်ဆေးပါ npm run lint # ကုတ်ပုံစံပြဿနာများကို စစ်ဆေးပါ
npm run build # ဆောက်လုပ်မှုအောင်မြင်သည်ကို အတည်ပြုပါ npm run build # တည်ဆောက်မှု အောင်မြင်မှုကို သေချာပါစေ
``` ```
### Bank API Testing ### Bank API Testing
@ -119,164 +119,164 @@ npm run build # ဆောက်လုပ်မှုအောင်မြ
```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 ### General Testing Approach
- ဤသည်မှာ တိကျသော အလိုအလျောက် စမ်းသပ်မှု မပါဝင်သော ပညာရေး repository ဖြစ်သည် - ဒီဟာက ပညာရေးအတွက် ဖြစ်ပြီး စက်ရုပ် စမ်းသပ်မှု ပြည့်စုံမရှိပါ
- လက်တို စမ်းသပ်မှုတွင် အောက်ပါအချက်များ အဓိကထားသည် - - လက်တွေ့စမ်းသပ်ခြင်း အခြေခံချက်များမှာ –
- Code ဥပမာများ အမှား မရှိစွာ လည်ပတ်ခြင်း - ကုဒ်ဥပမာများ အမှားမရှိ များကို ပြေးနိုင်မှု
- စာတမ်းရေးဆွဲမှု လင့်ခ်များ တိကျမှန်ကန်စွာ ဆက်သွယ်နိုင်ခြင်း - စာတမ်းစာရွက်အတွင်း လင့်ခ်များ တိကျမှု
- ပရောဂျက် တည်ဆောက်မှု အောင်မြင်စွာ ပြီးစီးခြင်း - ပရောဂျက်များ အဆင်သင့် ပြီးဆုံးမှု
- ဥပမာများသည် အကောင်းဆုံးကွင်းဆက်နှင့် ကိုက်ညီမှု - ဥပမာများ စံပြနည်းလမ်းများကို လိုက်နာခြင်း
### Pre-submission Checks ### Pre-submission Checks
- package.json ပါရှိသည့် directory များတွင် `npm run lint` လုပ်ပါ - package.json တွင်ရှိသောဖိုလ်ဒါများတွင် `npm run lint` ရောစစ်ပါ
- markdown လင့်ခ်များမှန်ကန်မှု စစ်ဆေးပါ - Markdown လင့်ခ်များမှာ မှန်ကန်မှု ရှိ/မရှိ စစ်ဆေးပါ
- Browser သို့မဟုတ် Node.js တွင် code ဥပမာများ စမ်းသပ်ပါ - Browser သို့မဟုတ် Node.js တွင် ကုဒ်ဥပမာများ စစ်ဆေးပါ
- ဘာသာပြန်မှုများ၏ ဖွဲ့စည်းမှု တိကျမှန်ကန်မှုစစ်ဆေးပါ - ဘာသာပြန်မှုများ ရိုးရှင်းမှု ထိန်းသိမ်းထားမှု စစ်ဆေးပါ
## Code Style Guidelines ## Code Style Guidelines
### JavaScript ### JavaScript
- လက်ရှိ ES6+ စတိုင်သုံးရန် - ခေတ်သစ် ES6+ စနစ်များ သုံးပါ
- များသော project များတွင် ESLint configuration ကိုလိုက်နာရန် - ပရောဂျက်များတွင် ဖော်ပြထားသော standard ESLint ညွှန်ကြားချက်များ လိုက်နာပါ
- ပညာရေးအတွက် သင်အား လွယ်ကူစေရန် အဓိပ္ပါယ်ရှိ variable နဲ့ function နာမည်များသုံးရန် - ပညာရေးအတွက် ရည်ရွယ်ချက်နဲ့ အသုံးပြုသည့် ပြောင်းလဲမှုနှင့် function အမည်များ အသုံးပြုပါ
- သင်ကြားမှုအတွက် ကြားဖြတ်ချက်များ ထည့်ရန် - သင်ယူသူများအတွက် အကြောင်းအရာရှင်းလင်းမှု အတွက် မှတ်ချက် ထည့်ပါ
- Prettier ဖြင့် format ပြုလုပ်မှု (configuration ရှိသည့်နေရာတွင်) - Prettier ဖြင့် ဖော်မတ်လုပ်ပါ (သတ်မှတ်ထားသောနေရာတွင်)
### HTML/CSS ### HTML/CSS
- Semantic HTML5 elements အသုံးပြုရန် - Semantic HTML5 element များအမြဲ သုံးပါ
- Responsive ဒီဇိုင်း အခြေခံချက်များ - Responsive ဒီဇိုင်း သဘောတရားများ လိုက်နာပါ
- သန့်ရှင်းပြီး ရှင်းလင်းသော class နာမည်များ - Class နာမည် သက်ဆိုင်ရာ သဘောထားအတိုင်း အသုံးပြုပါ
- သင်သားများ အတွက် CSS နည်းပညာ ရှင်းလင်းပြောကြားမှုများ - CSS နည်းလမ်းများ အသုံးပြုမှု ရှင်းလင်းအောင် မှတ်ချက် ထည့်ပါ
### Python ### Python
- PEP 8 စတိုင်လ်လမ်းညွှန်များ - PEP 8 စတိုင် ညွှန်ကြားချက်
- သင်ထောက်အကူဖြစ်သော ကျယ်ပြန့်သော code ဥပမာများ - ပညာရေးအတွက် သန့်ရှင်းပြီး ရှင်းလင်းသော ကုဒ်ဥပမာများ
- အသုံးပြုသူအတွက် အကူအညီဖြစ်မည့် Type hints ထည့်သုံးရန် - သင်ယူရန် အတွက် သက်ဆိုင်သောနေရာတွင် တိုင်းတမ်းရေးပါ
### Markdown Documentation ### Markdown Documentation
- ရှင်းရှင်းလင်းလင်း ခေါင်းစဉ်အဆင့်ခွဲခြားမှု - ခေါင်းစဉ်ဆက်တက်မှု သေချာစွာ ပါဝင်မှု
- ဘာသာပြန်သည့် language နဲ့ code-block များ - ဘာသာစကား သတ်မှတ်ချက်ပါ အကုဒ်ဘလော့ခ်များ
- အပိုဆောင်းအရင်းအမြစ် သွားရောက်ရန် link များ - ထပ်ဆောင်း အရင်းအမြစ်များချိတ်ဆက်မှု
- `images/` folder များရှိ screenshot နှင့် ပုံများ - `images/` ဖိုလ်ဒါတွင် စက္ကန့်ပုံများ နဲ့ ဓာတ်ပုံများ
- ပုံများအတွက် accessibility အတွက် Alt text ထည့်ရန် - ဓာတ်ပုံများအတွက် နားလည်စေသည့် alt စာသား
### File Organization ### File Organization
- သင်ခန်းစာများကို နံပါတ်စဉ်လိုက် ဖြစ်ရန် (1-getting-started-lessons, 2-js-basics စသဖြင့်) - သင်ခန်းစာများ သင်ခန်းစာ အမှတ် အလိုက် နေရာချထားမှု (1-getting-started-lessons, 2-js-basics, စသည်)
- project အသီးသီးတွင် `solution/` နှင့် မကြာခဏ `start/` သို့မဟုတ် `your-work/` directory များရှိသည် - ပရောဂျက်များတွင် `solution/` နဲ့ မကြာခဏ `start/` သို့မဟုတ် `your-work/` ဖိုလ်ဒါများ ပါဝင်သည်
- ပုံများကို သင်ခန်းစာအလိုက်သိုလှောင်ထားသော `images/` folder တွင်ရှိသည် - သင်ခန်းစာအလိုက် `images/` ဖိုလ်ဒါများတွင် ဓာတ်ပုံများ ထိန်းသိမ်းမှု
- ဘာသာပြန်ဖိုင်များကို `translations/{language-code}/` structure ဖြင့်ထားသည် - ဘာသာပြန်ချက်များကို `translations/{language-code}/` ဖိုလ်ဒါတွင်ထားသည်
## Build and Deployment ## Build and Deployment
### Quiz App Deployment (Azure Static Web Apps) ### Quiz App Deployment (Azure Static Web Apps)
quiz-app ကို Azure Static Web Apps deployment အတွက် တပ်ဆင်ထားသည် - quiz-app ကို Azure Static Web Apps အတွက် ပြင်ဆင်ထားသည် -
```bash ```bash
cd quiz-app cd quiz-app
npm run build # dist/ ဖိုလ်ဒါကို ဖန်တီးသည် npm run build # dist/ ဖိုဒါကို ဖန်တီးသည်
# main သို့ push လုပ်သောအခါ GitHub Actions workflow မှတဆင့် တင်ပို့သည် # main သို့ push လုပ်သောအခါ GitHub Actions workflow ဖြင့် တပ်ဆင်သည်
``` ```
Azure Static Web Apps configuration: Azure Static Web Apps ပြင်ဆင်မှု-
- **App location**: `/quiz-app` - **App တည်နေရာ**: `/quiz-app`
- **Output location**: `dist` - **ထုတ်ပေးရာ တည်နေရာ**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Documentation PDF Generation ### Documentation PDF Generation
```bash ```bash
npm install # docsify-to-pdf ကို 설치 하십시오 npm install # docsify-to-pdf ကိုထည့်သွင်းပါ
npm run convert # docs မှ PDF ကို 생성하십시오 npm run convert # docs မှ PDF ဖိုင်ဖန်တီးပါ
``` ```
### Docsify Documentation ### Docsify Documentation
```bash ```bash
npm install -g docsify-cli # Docsify ကို ကမ္ဘာလုံးဆိုင်ရာ ထည့်သွင်းပါ npm install -g docsify-cli # Docsify ကို တစ်ကမ္ဘာလုံးတွင် ထည့်သွင်းပါ
docsify serve # localhost:3000 တွင် စနစ်ဆောင်ပါ docsify serve # localhost:3000 တွင် Serve လုပ်ပါ
``` ```
### Project-specific Builds ### Project-specific Builds
ပရောဂျက် directory တစ်ခုချင်းစီတွင် build လုပ်ငန်းစဉ် များလည်း ရှိနိုင်သည် - ပရောဂျက်ဖိုလ်ဒါ တစ်ခုချင်းစီမှာ ဘယ်လို Build လုပ်ရမယ်ဆိုတာက ဤသို့ ဖြစ်နိုင်သည် -
- Vue ပရောဂျက်များ: `npm run build` မှာ production bundle များဖန်တီးသည် - Vue ပရောဂျက်များ: `npm run build` ဖြင့် ထုတ်လုပ်မှု ဘယ်လ်များ ဖန်တီးခြင်း
- Static ပရောဂျက်များ: build လုပ်ရန် မလိုအပ်ပါ၊ ဖိုင်များကိုတန်းတူ serve ပြုလုပ်သည် - Static ပရောဂျက်များ: Build အဆင့်မလိုအပ်ဘဲ အမြဲတမ်း File များကို ဝန်ဆောင်မှုလုပ်ခြင်း
## Pull Request Guidelines ## Pull Request Guidelines
### Title Format ### Title Format
ပြင်ဆင်မှု လုပ်ဆောင်သော နေရာကို ပြသသည့် ရှင်းလင်းအသိပေးခေါင်းစဉ်များ၌ များသုံးရန် - ပြောင်းလဲမှု နေရာကို သေချာ ဖော်ပြနိုင်တဲ့ ခေါင်းစဉ်များ အသုံးပြုပါ -
- `[Quiz-app] သင်ခန်းစာ X အတွက် quiz အသစ်ထည့်ပါ` - `[Quiz-app] Lesson X အတွက် Quiz အသစ် ထည့်သွင်းခြင်း`
- `[Lesson-3] terrarium ပရောဂျက်တွင် အမှားတစ်ခု ပြင်ဆင်ပါ` - `[Lesson-3] Terrarium ပရောဂျက်ရှိ အမှား ပြင်ဆင်ခြင်း`
- `[Translation] သင်ခန်းစာ ၅ အတွက် စပိန်ဘာသာ ပြန်တင်ဘှဲ့ပါ` - `[Translation] Lesson 5 အတွက် စပိန်ဘာသာ ပြန်ထည့်ခြင်း`
- `[Docs] Setup အဆင့်ညွှန်ကြားချက်များ အပ်ဒိတ်ပြုလုပ်ပါ` - `[Docs] Setup လမ်းညွှန်ချက်များ အပ်ဒိတ်ခြင်း`
### Required Checks ### Required Checks
PR တင်မည့်အချိန် မတိုင်မီ - PR တင်မဲ့အချိန်မှာ သေချာ စစ်ဆေးရန် -
1. **Code ပြည့်စုံမှု** 1. **ကုဒ်အရည်အသွေး**:
- သက်ဆိုင်ရာ project directory များတွင် `npm run lint` ကို လုပ်ပါ - သက်ဆိုင်ရာ ပရောဂျက်ဖိုလ်ဒါတွင် `npm run lint` ပြေးပါ
- အမှားများနှင့် အသိပေးချက်များကို ပြင်ဆင်ပါ - လင့်တ် error များနဲ့ သတိပေးချက်များကိုအားလုံး ပြင်ဆင်ပါ
2. **Build စစ်ဆေးခြင်း** 2. **Build အတည်ပြုခြင်း**:
- လိုအပ်ပါက `npm run build` ပြုလုပ်ပါ - Build လုပ်စရာရှိလျှင် `npm run build` ပြေးပါ
- build အမှား မရှိပါစေ - Build error မရှိစေရန် သေချာ စစ်ဆေးပါ
3. **Link စစ်ဆေးခြင်း** 3. **Link စစ်ဆေးခြင်း**:
- Markdown လင့်ခ်များအားလုံးကို စမ်းသပ်ပါ - Markdown link များအားလုံး စစ်ဆေးပါ
- ဓာတ်ပုံများ ရှိမရှိ စစ်ဆေးပါ - ဓာတ်ပုံများ လင့်ခ် တွေရေးသည် မှန်ကြောင်း စစ်ဆေးပါ
4. **အကြောင်းအရာ စစ်တမ်း** 4. **အကြောင်းအရာ သုံးသပ်ခြင်း**:
- စာလုံးပျက်မှားနှင့် သဒ္ဒါ အမှား မရှိစေရန် စစ်ဆေးပါ - သဒ္ဒါစစ်ဆေးပြီး စာလုံးပြားထဲမှားချက် မရှိစေရန် သေချာစစ်ပါ
- Code ဥပမာများ မှန်ကန်ပြီး သင်ကြားမှုရှိစေရန် စစ်ဆေးပါ - ကုဒ်ဥပမာများ မှန်ကန်ပြီး ပညာရေးအရ သင်ကြားမှုကောင်းမောင်းမှုရှိစေရန် ကြိုးစားပါ
- ဘာသာပြန်မှုများ အဓိပ္ပါယ်မပြောင်းဘဲ တိကျမှုရှိစေရန် စစ်ဆေးပါ - ဘာသာပြန်မှုများ ရိုးရိုးသားသား ပြန်လည်မည့် အကြောင်းအရာ တူညီမှုရှိစေရန် စစ်ဆေးပါ
### Contribution Requirements ### 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 ဖေါ်ပြချက်တွင် issue နံပါတ်များကို ရည်ညွှန်းပါ - PR မှာ သက်ဆိုင်ရာ issue နံပါတ်များ ကိုဖော်ပြပါ
### Review Process ### Review Process
- PR များသည် Maintainer များနှင့် အသိုင်းအဝိုင်းအားဖြင့် စစ်ဆေးသည် - PR များကို ထိန်းသိမ်းသူများနဲ့ နည်းပညာ ဖက် အသိုင်းအဝိုင်းက စစ်ဆေးပေးပါလိမ့်မယ်
- ပညာရေး ရှင်းလင်းမှုကို အလေးထားသည် - ပညာရေးအတွက် ရှင်းလင်းတင်ပြမှုကို ဦးစားပေးပါ
- Code ဥပမာများသည် လက်ရှိအကောင်းဆုံးနည်းလမ်းများနှင့် မညီမှု မရှိစေရန် ကြိုတင်စစ်ဆေးသည် - ကုဒ်ဥပမာများ အကောင်းဆုံး Practices များနဲ့ လိုက်နာမှုရှိစေရန် ကြိုးစားပါ
- ဘာသာပြန်မှုများအား တိကျမှုနှင့် ယဉ်ကျေးမှုအရ သက်ဆိုင်မှုရှိစေရန် ပြန်လည်သုံးသပ်သည် - ဘာသာပြန်မှုများကို တိကျမှုနဲ့ ယဉ်ကျေးမှုအသုံးအနှုန်းမှန်ကန်မှုရှိစေရန် စစ်ဆေးပါ
## Translation System ## Translation System
### Automated Translation ### Automated Translation
- GitHub Actions သုံးပြီး co-op-translator workflow အသုံးပြုသည် - GitHub Actions အသုံးပြုထားပြီး co-op-translator workflow ဖြင့် အလိုအလျောက် ဘာသာပြန်သည်
- ၅၀ ကျော်သော ဘာသာစကားများအတွက် အလိုအလျောက် ဘာသာပြန်ပေးသည် - ၅၀ ကျော် ဘာသာစကားများသို့ အချက်အလက်များ ဘာသာပြန်သည်
- မူလဖိုင်များသည် main directory များတွင်ရှိသည် - မူလဖိုင်များကို main directories မှာထားသည်
- ဘာသာပြန်ထားသော ဖိုင်များကို `translations/{language-code}/` ထဲတွင် သိမ်းဆည်းထားသည် - ဘာသာပြန်ပြီးဖိုင်များကို `translations/{language-code}/` ဖိုလ်ဒါတွင် ထားသည်
### Adding Manual Translation Improvements ### Adding Manual Translation Improvements
1. `translations/{language-code}/` တွင် ဖိုင်များကို ရှာတွေ့ပါ 1. `translations/{language-code}/` မှ ဖိုင် ရှာပါ
2. ဖွဲ့စည်းမှုမပြောင်းလဲဘဲ တိုးတက်မှုများ ပြုလုပ်ပါ 2. ဖိုင်ကို အတူတကွ ပြုပြင်မှု ပြုလုပ်ပါ၊ ဖိုင် ဖွဲ့စည်းမှု ထိန်းသိမ်းပါ
3. Code ဥပမာများ မပျက်မကွက် ဆက်လက်လုပ်ဆောင်နိုင်စေရန် သတိပြုပါ 3. ကုဒ်ဥပမာများ လုပ်ငန်းမှန်ကန်နေစေရန် သေချာစစ်ပါ
4. ညှိနှိုင်းထားသော Quiz အကြောင်းအရာ များကို စမ်းသပ်ပါ 4. ဒေသခံ Quiz အကြောင်းအရာရှိလျှင် စမ်းသပ်ပါ
### Translation Metadata ### Translation Metadata
ဘာသာပြန် ဖိုင်များတွင် မီတာဒေတာ ခေါင်းစီးပါဝင်သည် - ဘာသာပြန်ထားသော ဖိုင်များတွင် metadata header ပါဝင်သည် -
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -293,116 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### Common Issues ### Common Issues
**Quiz app တက်ရန် မအောင်မြင်ခြင်း**: **Quiz app က စတင်မရပါ** -
- Node.js ဗားရှင်း (v14+) ကို စစ်ဆေးပါ - Node.js ဘားရှင်း (v14+ အကြံပြု)
- `node_modules` နှင့် `package-lock.json` ဖိုင်များ ဖျက်ပြီး `npm install` ပြန်တင်ပါ - `node_modules` နဲ့ `package-lock.json` ဖျက်ပြီး `npm install` လုပ်ပါ
- Port ပိုင်း ယှဉ်ပြိုင်မှုရှိနိုင်မရှိ စစ်ဆေးပါ (default: Vite သည် port 5173 သုံးသည်) - Port ပြဿနာရှိမရှိ စစ်ဆေးပါ (Vite က default port 5173 သုံးသည်)
**API server မတက်ခြင်း**: **API server ကို စတင်လို့ မရပါ** -
- Node.js ဗားရှင်းအနည်းဆုံး node >=10 ဖြစ်မဖြစ် စစ်ဆေးပါ - Node.js version(node >=10) သင့်တော်မှတ်ချက် စစ်ဆေးပါ
- Port သုံးနေခြင်း ရှိမရှိ စစ်ဆေးပါ - Port တွေ သုံးဆောင်နေတာရှိမရှိ စစ်ပါ
- `npm install` ဖြင့် အားလုံး dependencies ထည့်သွင်းထားခြင်း စစ်ဆေးပါ - သက်ဆိုင်ရာ dependencies ကို `npm install` ဖြင့် ထည့်သွင်းပါ
**Browser extension မတက်ခြင်း**: **Browser extension မတင်နိုင်ပါ** -
- manifest.json ဖိုင် format မှန်ကန်မှုစစ်ပါ - manifest.json ကို မှန်ကန်စွာ ဖောင်းခြင်း
- Browser console တွင် အမှားများရှိမရှိ စစ်ဆေးပါ - Browser console error များ စစ်ဆေးပါ
- Browser အလိုက် extension ထည့်သွင်းနည်းများ လိုက်နာပါ - Browser-specific extension ထည့်သွင်းနည်း လမ်းညွှန်ချက် လိုက်နာပါ
**Python chat project အခက်အခဲများ**: **Python chat project တွင် ပြဿနာရှိပါက** -
- OpenAI package ထည့်သွင်းထားၿပီးဖြစ်စေရန် `pip install openai` - OpenAI package ထည့်သွင်းထားရန်: `pip install openai`
- GITHUB_TOKEN environment variable ဖော်ပြထားရေးစစ်ပါ - GITHUB_TOKEN environment variable ထည့်ထားခြင်းရှိ/မရှိစစ်ပါ
- GitHub Models အသုံးခွင့်ရှိရေးစစ်ဆေးပါ - GitHub Models access permission ရှိ/မရှိ စစ်ဆေးပါ
**Docsify က စာတမ်း မတက်ခြင်း**: **Docsify က စာရွက် မပေးဆောင်ပါ** -
- 글로벌အဆင့် docsify-cli ထည့်သွင်းရန် `npm install -g docsify-cli` - docsify-cli ကို global ဖြင့် install လုပ်ပါ: `npm install -g docsify-cli`
- Repository ရဲ့ root directory မှ စတင်ပါ - repository root directory မှ run ပါ
- `docs/_sidebar.md` ရှိမရှိ စစ်ဆေးပါ - `docs/_sidebar.md` ဖိုင် ရှိ/မရှိ စစ်ဆေးပါ
### Development Environment Tips ### Development Environment Tips
- HTML project များအတွက် VS Code Live Server extension အား အသုံးပြုပါ - HTML ပရောဂျက်များအတွက် VS Code Live Server extension သုံးပါ
- ESLint နှင့် Prettier extension များ ထည့်သွင်းထားပြီး ဖြည်းညည်းစွာ format ပြုလုပ်ပါ - ESLint နဲ့ Prettier extensions ကို ထည့်သွင်းပါ
- JavaScript debugging အတွက် browser DevTools ကို အသုံးပြုပါ - JavaScript debugging အတွက် Browser DevTools သုံးပါ
- Vue project များအတွက် Vue DevTools browser extension ထည့်သွင်းပါ - Vue ပရောဂျက်များအတွက် Vue DevTools browser extension ထည့်သွင်းပါ
### Performance Considerations ### Performance Considerations
- ဘာသာပြန်ဖိုင် အရေအတွက် များ (၅၀ ကျော် ဘာသာစကား) ဖြစ်သောကြောင့် full clone များ ကြီးမားသည် - ဘာသာပြန်ဖိုင် ၅၀ ကျော်ရှိခြင်းကြောင့် full clone များကြီးမားပါသည်
- အကြောင်းအရာသာ အလုပ်လုပ်မည့်အခါ shallow clone (`git clone --depth 1`) အသုံးပြုပါ - Content တစ်ခုချင်းလုပ်မှသာ shallow clone သုံးပါ: `git clone --depth 1`
- English အကြောင်းအရာ နှင့်အလုပ်လုပ်သောအခါ ဘာသာပြန် ဖိုင်များကို ရှာဖွေနေရာမှ ဖယ်ရှားပါ - English content နှင့် အလုပ်လုပ်ခြင်းကာလတွင် ဘာသာပြန်မျှ်းတို့ကို ရှာဖွေရန် မပါပါနှုန်းထားပါ
- npm install, Vite build စသည့် စွမ်းဆောင်ရည်တွေ ပထမဆုံးပြေးတဲ့အချိန် စို့မြန်မှု နည်းနိုင်သည် - Build ပရိုစက်များ ပထမဆုံး run တစ်ခါမှာ နည်းနည်း စိတ်ရှုပ်နိုင်ပါသည် (npm install, Vite build)
## Security Considerations ## Security Considerations
### Environment Variables ### Environment Variables
- API keys မည်သည့် အချိန်မှ repository ထဲ မသိမ်းဆည်းရ - API အချက်အလက်များကို repo ထဲ မတင်သင့်ပါ
- `.env` ဖိုင်များကို အသုံးပြုပါ (ပြီးသား `.gitignore` ထဲမှာ ပါရှိ) - `.env` ဖိုင်များကို သုံးပါ (`.gitignore` မှာ ထည့်ထားပြီး)
- Project README မှာ လိုအပ်သော environment variables များ ဖော်ပြထားပါ - ပရောဂျက် README များတွင် လိုအပ်သော environment variables ကို စာရင်းပြုစုပါ
### Python Projects ### Python Projects
- virtual environments အသုံးပြုပါ: `python -m venv venv` - Virtual environment အသုံးပြုပြီး အလုပ်လုပ်ပါ: `python -m venv venv`
- dependencies များ ကိုပုံမှန် update လုပ်ပါ - Dependencies များ ကို အမြဲ ပြင်ဆင်ထားပါ
- GitHub tokens များတွင် လိုအပ်တဲ့ ခွင့်ပြုချက် အနည်းဆုံးပဲ သတ်မှတ်ထားပါ - GitHub tokens များမှာ လိုအပ်ခဲ့သော permission များသာ ပေးသင့်သည်
### GitHub Models Access ### GitHub Models Access
- GitHub Models အသုံးပြုရန် Personal Access Tokens (PAT) လိုအပ်သည် - GitHub Models သုံးရန် Personal Access Tokens (PAT) လိုအပ်သည်
- Tokens များကို environment variables အဖြစ် သိမ်းဆည်းပါ - Tokens များကို environment variables အနေဖြင့် ထိန်းသိမ်းပါ
- Tokens သို့မဟုတ် credentials မဖြန့်ဝေပါနှင့် - Token များကို အထောက်အထားမတင်ပါနှင့်
## Additional Notes ## Additional Notes
### Target Audience ### Target Audience
- ဝက်ဘ် ဖွံ့ဖြိုးတိုးတက်မှု အစစ်အပိုင်းက စတင်လေ့လာသူများ - အစမှစသင်ယူသူများ
- ကျောင်းသားများနှင့် ကိုယ်တိုင် လေ့လာသူများ - ကျောင်းသားများနဲ့ ကိုယ်တိုင်မျှုဝေ လေ့လာသူများ
- သင်တန်းခန်းများတွင် သင်ကြားသူများ - သင်တန်းဆရာများ ကျောင်းသားများသင်ကြားရာတွင် အသုံးပြုသူများ
- အသုံးပြုရ လွယ်ကူပြီး တန်းတူဖြိုးတိုးမှု အတွက် အကြောင်းအရာများ ပါဝင်သည် - ဝင်ရောက်လေ့လာသူများအတွက် ရောက်ရှိနိုင်ပြီး နည်းပညာတိုးတက်မှု များတိုးတက်စေသည်
### Educational Philosophy ### Educational Philosophy
- ပရောဂျက်အခြေပြု သင်ယူခြင်း - ပရောဂျက်အခြေခံ သင်ယူမှုနည်းစနစ်
- မကြာခဏ အသိပညာ စစ်တမ်းများ (quiz) - အကြိမ်ကြိမ် အသိပညာစစ်ဆေးမှုများ (quizzes)
- လက်တွေ့ coding လေ့ကျင့်ခန်းများ - ကုဒ်ရေးသားခြင်း လက်တွေ့ကျင့်ခန်းများ
- အပြင်လောက သုံးသပ်မှု ဥပမာများ - လက်တွေ့ အသုံးချခွင့်များ
- Framework မတိုင်မှီ အခြေခံကို အလေးပေးခြင်း - ဖွံ့ဖြိုးတိုးတက်မှု မတိုင်မီ အခြေခံ အစိတ်အပိုင်းများအား အာရုံစိုက်ခြင်း
### Repository Maintenance ### Repository Maintenance
- လေ့လာသူများနှင့် ပံ့ပိုးသူများ၏ ပြန်လည်ဆွေးနွေးမှုရှိသော လူ့အသိုင်းအဝိုင်း တက်ကြွကောင်းမွန်သည့် အခြေအနေ - လေ့လာသူများနဲ့ ပံ့ပိုးသူများ ရှိသော ကျန်ရှိမှုရှိသော အသိုင်းအဝိုင်း
- dependencies နှင့် အကြောင်းအရာများ ဆက်လက် update လုပ်ဆောင်ခြင်း - စနစ်တကျ အပ်ဒိတ်လုပ်ခြင်း (dependency နဲ့ အကြောင်းအရာများ)
- Issue များနှင့် ဆွေးနွေးမှု များကို Maintainer များ ကြီးကြပ်စောင့်ရှောက်ခြင်း - Issue များ နဲ့ ဆွေးနွေးပွဲများကို ထိန်းသိမ်းမှု
- ဘာသာပြန်ချက် update များကို GitHub Actions ဖြင့် အလိုအလျောက် ပြုလုပ်ခြင်း - ဘာသာပြန်အပ်ဒိတ်ကို 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) သည် လေ့လာသူများအတွက် အကြံပြုသည် - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) ကို သင်ယူသူများအတွက် အကြံပြုသည်
- အပိုဆောင်းသင်တန်းများ: Generative AI, Data Science, ML, IoT သင်ရိုးညွှန်းတမ်းများ လည်း ရရှိနိုင်သည် - အပိုသင်တန်းများ: Generative AI, Data Science, ML, IoT သင်ကြားရေးအစီအစဉ်များ
### Working with Specific Projects ### Working with Specific Projects
ပရောဂျက်အသီးသီးတွင် အသေးစိတ်ညွှန်ကြားချက်များအတွက် သက်ဆိုင်ရာ README ဖိုင်များကို ကြည့်ပါ - သီးခြား ပရောဂျက်များအတွက် အသေးစိတ် လမ်းညွှန်ချက်များကို ဖတ်ရန် -
- `quiz-app/README.md` - Vue 3 quiz application - `quiz-app/README.md` - Vue 3 quiz application
- `7-bank-project/README.md` - Authentication နှင့် ထည့်သွင်းထားသော Banking application - `7-bank-project/README.md` - အတည်ပြုသူပါ Banking အက်ပ်
- `5-browser-extension/README.md` - Browser extension တည်ဆောက်ခြင်း - `5-browser-extension/README.md` - Browser extension ဖန်တီးခြင်း
- `6-space-game/README.md` - Canvas အခြေပြု ကစားပွဲ ဖန်တီးခြင်း - `6-space-game/README.md` - Canvas အခြေခံဂိမ်းဖန်တီးခြင်း
- `9-chat-project/README.md` - AI chat assistant project - `9-chat-project/README.md` - AI chat assistant project
### Monorepo Structure ### Monorepo Structure
ဒီ repository သည် ယေဘုယျ monorepo မဟုတ်ပေမယ့် ပရောဂျက်အမျိုးမျိုး ဦးတည်ထားသည် - ဒီ repo ဟာ သာမန် monorepo မဟုတ်ပေမယ့် အသီးသီး ပရောဂျက်များစွာ ပါဝင်သည် -
- သင်ခန်းစာ တစ်ခုချင်းစီကို မတူညီပဲ သီးခြားထားသည် - သင်ခန်းစာတွေကို သီးခြားနားထားတယ်
- ပရောဂျက်များသည် dependencies များ မမျှဝေကြ - ပရောဂျက်များမှာ Dependencies မမျှဝေကြဘူး
- တစ်ခုတည်းသော ပရောဂျက်ကို ပြင်ဆင်ခြင်းသည် အခြားများအား ထိခိုက်မှု မရှိစေရန် ဖြစ်သည် - တစ်ခုချင်းစီ အပေါ် အခြေခံ၍ အလုပ်လုပ်နိုင်တယ်၊ အခြားတွေကို ထိခိုက်စေမယ် မဟုတ်ဘူး
- အတူတကွ သင်ရိုးပုံစံ အပြည့်အဝကို ထည့်သွင်းဖို့အတွက် repository များကို စုပေါင်း clone လုပ်နိုင်သည် - စုစုပေါင်း repo ကို clone ဆွဲ၍ အစုလိုက် သင်ကြားမှု အတွေ့အကြုံရရှိနိုင်သည်
--- ---
<!-- 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,38 +1,24 @@
[![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) # Web Development for Beginners - အတန်းအစီအစဉ်
[![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/) Microsoft Cloud Advocates မှ ပံ့ပိုးပေးသော ၁၂ ပတ်ကြာ သီးသန့်သင်တန်းဖြင့် ဝက်ဘ်ဖွံ့ဖြိုးတိုးတက်ရေး၏ အခြေခံအဆောက်အအုံများကို သင်ယူပါ။ သင်ခန်းစာ ၂၄ ခုစီတွင် JavaScript, CSS နှင့် HTML ကို terrariums, browser extensions, နှင့် space games ကဲ့သို့သော လက်တွေ့ပေါင်းစပ်စက်မှုများဖြင့် မျက်နှာစာချင်းဆိုင် ကျယ်ပြန့်စွာ ရှင်းလင်းပြသထားသည်။ စစ်ဆေးမှုများ၊ ဆွေးနွေးမှုများနှင့် လက်တွေ့တာဝန်များနှင့် လေ့လာသင်ယူပါ။ ကျွမ်းကျင်မှုများအတိုးအမြှင့်နှင့် သင်ယူမှု ထိန်းသိမ်းမှုအား ရရှိစေရန် ကျွန်ုပ်တို့၏ အကျိုးရှိသော စီမံကိန်းအခြေပြု သင်ကြားမှုနည်းလမ်းဖြင့် တိုးတက်စေပါမည်။ ဒီနေ့မှ စ၍ သင်ယူရန် စတင်လိုက်ပါ!
[![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) Azure AI Foundry Discord Community တွင် တက်ရောက်ပါ
# စတင်လေ့လာသူများအတွက် ဝက်ဘ်ဖွံ့ဖြိုးတိုးတက်မှု - သင်ရိုးအစီအစဉ်
Microsoft Cloud Advocates မှ ၁၂ အပတ်ကြာ စုံလင်အောင် စီစဉ်ထားသော ဝက်ဘ်ဖွံ့ဖြိုးတိုးတက်မှု အခြေခံများကို သင်ယူလိုက်ပါ။ ၂၄ ခန်းစာတိုင်း၌ JavaScript, CSS, နှင့် HTML ကို terrariums, browser extensions, နှင့် space games ကဲ့သို့ လက်တွေ့လုပ်ငန်းစီမံချက်များဖြင့် အာရုံစိုက်လေ့လာပါ။ စာမေးပွဲများ၊ ဆွေးနွေးပြောဆိုမှုများနှင့် လက်တွေ့အလုပ်များနှင့် ပါဝင်ဆောင်ရွက်ပါ။ ကျွမ်းကျင်မှုကို တိုးတက်စေပြီး အသိပညာကို ကောင်းမွန်စွာ သွင်းယူနိုင်ရန် လမ်းညွှန်ချက်အပြည့်အစုံဖြင့် သင်ကြားပေးပါသည်။ ယခု နည်းပညာလမ်းစဥ်ကို စတင်လိုက်ပါ!
Azure AI Foundry Discord အသိုင်းအဝိုင်းတွင် ပါဝင်ဆက်သွယ်ပါ။
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
ဤအရင်းအမြစ်များကို အသုံးပြုစတင်ရန် အောက်ပါအဆင့်များကို လိုက်နာလိုက်ပါ။ Follow these steps to get started using these resources:
1. **Repository ကို 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) 1. **Fork the 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. **Repository ကို Clone လုပ်ပါ**: `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`
3. [**Azure AI Foundry Discord ထဲကို ဝင်ရောက်ပြီး ကျွမ်းကျင်သူများနှင့် အတူတူ Developer များနှင့် တွေ့ဆုံပါ**](https://discord.com/invite/ByRwuEEgH4) 3. [**Join The Azure AI Foundry Discord and meet experts and fellow developers**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 ဘာသာစကားစွမ်းဆောင်ရည်အမျိုးမျိုး ### 🌐 အများဘာသာစကား ပံ့ပိုးမှု
#### GitHub Action ဖြင့် ထောက်ပံ့သည် (အလိုအလျောက် လုပ်ဆောင်ပြီး အမြဲအသစ်အဆန်းဖြစ်နေသည်) #### GitHub Action ဖြင့် ပံ့ပိုးထားပြီး (အလိုအလျောက်နှင့် အမြဲ Update ဖြစ်သည်)
<!-- 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)](./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](../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)](./README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../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)
> **ဒေသအလို local သို့ Clone လုပ်ချင်ပါသလား?** > **ဒေသခံတွင် Clone လုပ်ချင်ပါသလား?**
> >
> ဒီ repository တွင် ဘာသာစကား ၅၀ ကျော်အပြောင်းအလဲများ ပါဝင်ပြီး ဒေါင်းလုပ်အရွယ်အစားကို ကွဲပြားစေပါသည်။ ဘာသာပြန် ထည့်မထားပဲ clone လုပ်ရန် sparse checkout ကို အသုံးပြုနိုင်ပါသည်။ > ဤ Repository တွင် ဘာသာစကားဘာသာပြန် ၅၀ ကျော်ပါဝင်နေပြီး ဒေါင်းယူမှုအား တိုးမြှင့်သည်။ ဘာသာပြန် မပါဘဲ Clone လုပ်ရန် sparse checkout ကို အသုံးပြုပါ။
> >
> **Bash / macOS / Linux:** > **Bash / macOS / Linux:**
> ```bash > ```bash
@ -48,175 +34,171 @@ Azure AI Foundry Discord အသိုင်းအဝိုင်းတွင်
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> ဒီနည်းလမ်းက သင့်ကို သင်ခန်းစာအပေါ် မှန်ကန်ပြီး ပိုမိုမြန်ဆန်စွာ လုပ်ဆောင်နိုင်မှာ ဖြစ်ပါတယ်။ > သင်သည် သင်တန်းကို မြန်ဆန်စွာပြီးမြောက်စေရန်အတွက် လိုအပ်သည့် အရာအားလုံးကို ရရှိသွားပါလိမ့်မည်။
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**ထပ်မံ ဘာသာစကားများကို ထောက်ပံ့လိုပါက [ဒီမှာ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) ဖတ်ရှုနိုင်ပါသည်။** **ထပ်မံ ဘာသာပြန် ဘာသာစကားများလိုပါက [ဒီမှာ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) မှာ ဝင်ကြည့်ပါ**
[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _သင်တန်းသားလား?_ #### 🧑‍🎓 _သင်တန်းသားဖြစ်ပါသလား?_
[**Student Hub စာမျက်နှာကို သွားရောက်ပါ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon)။ ဒီနေရာမှာ စတင်လေ့လာသူ အသုံးများ, သင်တန်းသားပက်ကေ့များ၊ နှင့် အခမဲ့ စာမေးပွဲရေးသူ လက်မှတ်ဗောင်ချာလက်ချပေး နည်းလမ်းများတွေ့ရပါမယ်။ လစဉ် အကြောင်းအရာများ ပြောင်းလဲလာတဲ့အခါ ဒီစာမျက်နှာကို bookmark လုပ်ထားဖို့ အကြံပြုပါတယ်။ [**Student Hub စာမျက်နှာ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) သို့ သွားပြီး စတင်သူအရင်းအမြစ်များ၊ သင်တန်းသား အစားထိုးအထုပ်များနှင့် အခမဲ့ အထောက်အထားပေးလက်မှတ် ရရှိနိုင်သော နည်းလမ်းများကို ရှာဖွေလိုက်ပါ။ ဤစာမျက်နှာသည် လစဉ် အကြောင်းအရာများကို ပြောင်းလဲနေသည့်ကြောင့် သင့်အနေဖြင့် Bookmark ထားပြီး အချိန်အခါအခါ ကြည့်ရှုစစ်ဆေးရန် လိုအပ်သည်။
### 📣 ကြေညာချက် - GitHub Copilot Agent mode အစီအစဉ်အသစ်များ ပြီးမြောက်ရန် ### 📣 ကြေညာချက် - GitHub Copilot Agent mode စိန်ခေါ်မှု အသစ်များ ပြီးစီးရန်!
အသစ်ထည့်သွင်းထားသော စိန်ခေါ်မှုများ, အများဆုံးခန်းများတွင် “GitHub Copilot Agent Challenge 🚀” စိန်ခေါ်မှု ကို ရှာဖွေကြည့်ပါ။ GitHub Copilot နဲ့ Agent mode ကို အသုံးပြုပြီး ပြီးမြောက်စေတဲ့ စိန်ခေါ်မှုအသစ်ဖြစ်ပါတယ်။ Agent mode ကို မသုံးဖူးသူများအတွက် ပြောရရင် စာသားထုတ်ပေးခြင်းအပြင် ဖိုင်ဖန်တီးခြင်း၊ ဖိုင်တည်းဖြတ်ခြင်း ၊ command များ run လုပ်ခြင်း စသည့် လုပ်ဆောင်ချက်များလည်း လုပ်နိုင်ပါတယ်။ အသစ်ထပ် မည်သည့် စိန်ခေါ်မှု ဖြစ်သည်မှာ "GitHub Copilot Agent Challenge 🚀" ဟု အများဆုံး အခန်းများ၌ တွေ့ရပါသည်။ GitHub Copilot နှင့် Agent mode ကို အသုံးပြု၍ ပြီးစီးရန် သင့်ကြားမွမ်းမံမှုအသစ် ဖြစ်သည်။ Agent mode ကို ယခုအချိန်အထိ မသုံးဖူးလျှင်၊ စာသားကို များပြားစွာ ဖန်တီးပေးနိုင်သည့်အပြင် ဖိုင်များ ကို ဖန်တီးပြီး တည်းဖြတ်ခြင်း၊ ကွန်မန်များ chạyခြင်း နှင့် အခြား ဆောင်ရွက်ချက်များ ပြုလုပ်နိုင်သည်။
### 📣 ကြေညာချက် - _Generative AI ကို အသုံးပြု၍ လုပ်ဆောင်နိုင်မယ့် ပရောဂျက်အသစ်_ ### 📣 ကြေညာချက် - _Generative AI ဖြင့် တည်ဆောက်ရမည့် အသစ်သော စီမံကိန်း_
AI Assistant ပရောဂျက်အသစ် ထပ်မံတိုးချဲ့ပြီးသားဖြစ်သည်၊ သွားနေရေးကြည့်ပါ [project](./9-chat-project/README.md) အသစ်ထပ်ပါဝင်သည့် AI အကူအညီ စီမံကိန်းကို စစ်ဆေးပါ [project](./9-chat-project/README.md)
### 📣 ကြေညာချက် - _JavaScript အတွက် Generative AI နဲ့ ပတ်သတ်သည့် သင်ရိုးအစီအစဉ်အသစ်_ ### 📣 ကြေညာချက် - _Generative AI အတွက် JavaScript အခြေပြု အသစ်သော အတန်းအစီအစဉ်_ ထွက်ရှိခဲ့ပြီ
ကျွန်ုပ်တို့၏ Generative AI သင်ရိုးအသစ်မမေ့ပါနှင့်! ကျွန်ုပ်တို့၏ 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) သို့ သွားပါ။
![Background](../../translated_images/my/background.148a8d43afde5730.webp) ![Background](../../translated_images/my/background.148a8d43afde5730.webp)
- အခြေခံမှ RAG အထိ သင်ကြားမှုများပါရှိသည်။ - အခြေခံမှ RAG ထိ လေ့လာမှုများ ပါဝင်သည်။
- သမိုင်းကျန်_characters_ နှင့် GenAI နှင့် ကျွန်ုပ်တို့ app တို့ဖြင့် ဆက်သွယ်နိုင်သည်။ - GenAI နှင့် ကျွန်ုပ်တို့၏ အဖော်အစည်း app ကိုအသုံးပြု၍ သမိုင်းက လူမှုဇာတ်ကောင်များနှင့် ဆက်သွယ်နိုင်သည်။
- ပျော်စရာပါဝင်ပြီး ဇာတ်လမ်းတစ်ခုလို အချိန်ခရီးသွားနိုင်ပါသည်။ - စိတ်လှုပ်ရှားဖွယ် အကြောင်းအရာဖြင့် သင်ခရီး တုန့်ပြန်မောင်းနှင်မှု။
![character](../../translated_images/my/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/my/character.5c0dd8e067ffd693.webp)
တစ်ခုချင်းစီသင်ခန်းစာတွင် တာဝန်များ ပြီးမြောက်စေရန်လိုအပ်ပြီး နားလည်မှု စစ်ဆေးမှုနှင့် စိန်ခေါ်မှုများ ပါဝင်သည်၊ ဥပမာ -
ခန်းစာတိုင်းတွင် အလုပ်ကိုထပ်မံပြီးမြောက်ရေးတာဝန်၊ နားလည်မှုစစ်ဆေးမှုနှင့် စိန်ခေါ်မှုတစ်ခုပါဝင်ပြီး အောက်ဖော်ပြပါအကြောင်းအရာများကိုလေ့လာဖို့လမ်းညွှန်ပေးပါသည်။
- Prompting နှင့် prompt engineering - Prompting နှင့် prompt engineering
- စာသားနှင့် ပုံများ ဆော့ဖ်ဝဲ ဖန်တီးခြင်း - စာသားနှင့် ပုံ app ဖန်တီးခြင်း
- ရှာဖွေရေးဆော့ဖ်ဝဲများ - ရှာဖွေရေး app များ
စတင်ရန် [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) သို့ သွားပါ!
စတင်ရန် [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) တွင် ဝင်ပါ။
## 🌱 စတင်ခြင်း ## 🌱 စတင်ခြင်း
> **ဆရာ/ဆရာမများ** အတွက် သင့်သင်တန်းတွင်ဤသင်ရိုးအစီအစဉ်ကို ဘယ်လိုသုံးလို့ရမည်ဆိုသည်ကို [အကြံပြုချက်များ](for-teachers.md) ထည့်သွင်းပေးထားပါသည်။ သင်၏တုံ့ပြန်ချက်များကို ကျွန်ုပ်တို့၏ [ဆွေးနွေးပွဲကွင်း](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) တွင် ဖော်ပြနိုင်ပါသည်။ > **ဆရာ/ဆရာမများအတွက်**၊ ဤ အတန်းအစီအစဉ်ကို မည်သို့ အသုံးပြုရမည်ကို [အကြံပြုချက်များ](for-teachers.md) ပါဝင်သည်။ ကျွန်ုပ်တို့၏ ဆွေးနွေးမှုပိုင်းတွင် [တုံ့ပြန်ချက် ပေးပါ](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)။
**[လေ့လာသူများ](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**၊ ခန်းစာတစ်ခုစီအတွက် အစပိုင်း စာမေးပွဲဖြေပြီး ခန်းစာစာသားများကို ဖတ်ရင်း လိုအပ်သည့် လုပ်ဆောင်ချက်များ ပြီးမြောက်အောင်လုပ်ပါ။ နောက်ပိုင်း စာမေးပွဲဖြေရာတွင် နားလည်မှုကို စစ်ဆေးပါ။ **[သင်တန်းသားများ](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**၊ သင်ခန်းစာစီစဉ်ရာတွင် လေ့လာမှုမတိုင်မီ စစ်ဆေးမှုဖြင့် စတင်ပြီး သင်ခန်းစာ စာသားများ ဖတ်ရှု၊ လုပ်ငန်းစဉ် အမျိုးမျိုး ပြီးမြောက်စေရန် လိုက်နာပြီး သင်ခန်းစာပြီးမြောက်ပြီးနောက် စစ်ဆေးမှု ဖြင့် နားလည်မှုကို စစ်ဆေးပါ။
သင်ယူမှုအတွေ့အကြုံကို တိုးတက်မြှင့်တင်ရန် မိတ်ဆွေများနှင့် ပရောဂျက်များတွင် ပြိုင်တြဲလုပ်ဆောင်ပါ။ ဆွေးနွေးပြောဆိုမှုများကို ကျွန်ုပ်တို့၏ [ဆွေးနွေးပွဲကွင်း](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) တွင် ကြိုဆိုပါသည်၊ မေးမြန်းလိုချက်များအတွက် moderator များထံမှ အကူအညီရပါမည်။ သင်ယူမှုကို မြှင့်တင်ရန် အတူတူ စီမံကိန်းများအတွက် စေ့စပ်သူများနှင့် ဆက်သွယ်ပါ။ ဆွေးနွေးမှုများမှာ ကျွန်ုပ်တို့၏ [ဆွေးနွေးမှုပိုင်း](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/) (ဘရောက်ဇာတွင် အသုံးပြုနိုင်ပြီး install မလိုအပ်သောပတ်ဝန်းကျင်) ကို လိုက်ရွေးနိုင်သလို သင်၏ကွန်ပျူတာတွင် [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) ကဲ့သို့သော စာသားဖြည့် စက်ကိရိယာဖြင့် အလုပ်လုပ်နိုင်သည်။
#### သင်၏ Repository ကို ဖန်တီးခြင်း #### သင့်ကိုယ်ပိုင် Repository ဖန်တီးခြင်း
သင်၏ အလုပ်များကို လွယ်ကူစွာ သိမ်းဆည်းနိုင်ရန် ကျွန်ုပ်တို့၏ repository ၏ သင့်ကိုယ်ပိုင် မိတ္တူကို ဖန်တီးရန် အကြံပြုသည်။ ဒီလုပ်ဆောင်မှုကို စာမျက်နှာအပေါ်တွင် ရှိသော **Use this template** ခလုတ်ကို နှိပ်ခြင်းဖြင့် ပြုလုပ်နိုင်သည်။ ဒါဟာ သင်၏ GitHub အကောင့်တွင် သင်ရိုးအစီအစဉ် မိတ္တူအသစ်တစ်ခု ဖန်တီးပေးပါသည်။ အလုပ်များကို အဆင်ပြေထိန်းသိမ်းနိုင်ရန် ဤ Repository ၏ ကိုယ်ပိုင် မိတ္တူကို ဖန်တီးရန် အကြံပြုသည်။ စာမျက်နှာအပေါ်တွင် ရှိသော **Use this template** ခလုတ်ကို နှိပ်ခြင်းဖြင့် သင့် GitHub အကောင့်တွင် အသစ်တစ်ခုဖန်တီးပေးပါမည်။
အောက်ပါအဆင့်များကို လိုက်နာပါ။ အောက်ပါအဆင့်များ ဦးတည်လိုက်ပါ-
1. **Repository ကို Fork လုပ်ပါ**: ဤစာမျက်နှာ၏ ညာဘက်အပေါ်ထိပ်တွင်ရှိသည့် "Fork" ခလုတ်ကို နှိပ်ပါ။ 1. **Repository ကို Fork လုပ်ပါ** - ဤစာမျက်နှာ၏ ထောင့်ညာဘက်အပေါ်မှာရှိသည့် "Fork" ခလုတ်ကို နှိပ်ပါ။
2. **Repository ကို Clone လုပ်ပါ**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Repository ကို Clone လုပ်ပါ** - `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Codespace တွင် သင်ရိုးအစီအစဉ်ကို ဆောင်ရွက်ခြင်း #### Codespace တွင် အတန်းစီအစဉ် လည်ပတ်ခြင်း
သင်ဖန်တီးထားသော repository မိတ္တူတွင် **Code** ခလုတ်ကို နှိပ်ပြီး **Open with Codespaces** ကို ရွေးချယ်ပါ။ ဒီနည်းဖြင့် သင်အလုပ်လုပ်နိုင်ရန် Codespace အသစ်တစ်ခု ဖန်တီးပေးပါမည်။ သင့်ဖန်တီးထားသော Repository မိတ္တူတွင် **Code** ခလုတ်ကိုနှိပ်ပြီး **Open with Codespaces** ကို ရွေးချယ်ပါ။ သင့်အတွက် Codespace အသစ်တစ်ခု ဖန်တီးပေးပါမည်။
![Codespace](../../translated_images/my/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/my/createcodespace.0238bbf4d7a8d955.webp)
#### သင်ရိုးအစီအစဉ်ကို သင်၏ ကွန်ပျူတာပေါ်တွင် ဒေသစံပြ run ချခြင်း #### သင့် ကွန်ပျူတာတွင် ဒေသခံအနေနဲ့ အတန်းများ လည်ပတ်ခြင်း
ဤသင်ရိုးအစီအစဉ်ကို သင့်ကွန်ပျူတာပေါ်တွင် လည်ပတ်ရန်အတွက် စာသားတည်းဖြတ်ကိရိယာ၊ ဘရောက်ဇာ နှင့် command line ကိရိယာ တို့ လိုတယ်။ ကျွန်ုပ်တို့၏ ပထမ ခန်းစာ인 [Programming Languages and Tools of the Trade အကြောင်းနိဒါန်း](../../1-getting-started-lessons/1-intro-to-programming-languages) သည် ရွေးချယ်နိုင်သော ကိရိယာများနှင့် ညွှန်ပြချက်များကို သင်ကြားပေးပါမည်။ ဤအတန်းအစီအစဉ်ကို ဒေသခံအနေဖြင့် လည်ပတ်ရန် လိုအပ်ချက်မှာ စာသားရေး တည်းဖြတ်စက်, browser နှင့် command line ကိရိယာဖြစ်သည်။ ကျွန်ုပ်တို့၏ ပထမဆုံး သင်ခန်းစာ [Programming Languages သင်ခန်းစာ မိတ်ဆက်](../../1-getting-started-lessons/1-intro-to-programming-languages) တွင် ယင်းအရာများ၏ အမျိုးမျိုးရွေးချယ်မှုနှင့် သင့်တပ်ဆင်ချက်အတွက် လမ်းညွှန်ချက်များ ပါဝင်ပါသည်။
သင့် အတွက် အကြံပြုလိုတာက [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ကို စာသားတည်းဖြတ်ကိရိယာအဖြစ် အသုံးပြုရန်ဖြစ်ပြီး ၎င်းတွင် တည်ဆောက်ပြီးသား [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ပါဝင်သည်။ Visual Studio Code ကို ဒီနေရာမှ ဒေါင်းလုဒ်ဆွဲနိုင်ပါသည် [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)။ ကျွန်ုပ်တို႔ အကြံပြုနေသည်မှာ [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. Clone your repository to your computer. You can do this by clicking the **Code** button and copying the URL: 1. သင့်ရဲ့ repository ကို သင့်ကွန်ပျူတာပေါ်သို့ အကူးအပြောင်းလုပ်ပါ။ ဒီလို့လုပ်ဖို့ **Code** ခလုတ်ကိုနှိပ်ပြီး 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) within [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) and run the following command, replacing `<your-repository-url>` with the URL you just copied: အဲဒီနောက်, [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) ကို ဖွင့်ပြီး၊ အောက်ပါ command ကို ရိုက်ထည့်ပါ၊ `<your-repository-url>` ကို သင့်ကူးယူထားသော URL နဲ့ ချိန်ညှိသွားပါ-
```bash ```bash
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Open the folder in Visual Studio Code. You can do this by clicking **File** > **Open Folder** and selecting the folder you just cloned. 2. ပြီးလျှင် အဲဒီ folder ကို Visual Studio Code မှာ ဖွင့်ပါ။ **File** > **Open Folder** ကိုနှိပ်ပြီး မကြာသေးမီက clone လုပ်ထားသော folder ကို ရွေးချယ်နိုင်ပါတယ်-
> Recommended Visual Studio Code extensions: > ညွှန်ကြားချက် ပေးသည့် Visual Studio Code extensions:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - to preview HTML pages within Visual Studio Code > * [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) - to help you write code faster > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - ကုဒ်ကို ပိုမိုမြန်ဆန်စွာ ရေးသားရန်ကူညီပေးသည်
## 📂 Each lesson includes: ## 📂 လေ့လာခန်းတိုင်းတွင် ပါဝင်သည်မှာ-
- optional sketchnote - ရွေးချယ်နိုင်သည့် စကက်ချ်မှတ်စု
- optional supplemental video - ရွေးချယ်နိုင်သည့် အပိုဗွီဒီယို
- pre-lesson warmup quiz - မတိုင်မီ အပတ်အတွင်း စစ်တမ်း
- written lesson - လေ့လာခန်းစာ များ
- for project-based lessons, step-by-step guides on how to build the project - စီမံကိန်းအခြေပြုလေ့လာခန်းများအတွက် စီမံကိန်းတည်ဆောက်ရန် ဆက်လက် လမ်းညွှန်ချက်များ
- knowledge checks - အသိပညာစစ်ဆေးခြင်းများ
- a challenge - စိန်ခေါ်မှုတစ်ရပ်
- supplemental reading - အပို ဖတ်ရှုရန်
- assignment - အလုပ်အပ်ရန်
- [post-lesson quiz](https://ff-quizzes.netlify.app/web/) - [မတိုင်မီ စစ်တမ်း](https://ff-quizzes.netlify.app/web/)
> **A note about quizzes**: All quizzes are contained in the Quiz-app folder, 48 total quizzes of three questions each. They are available [here](https://ff-quizzes.netlify.app/web/) the quiz app can be run locally or deployed to Azure; follow the instruction in the `quiz-app` folder. > **စစ်တမ်းများအကြောင်း သတင်းအချက်အလက်**: စစ်တမ်းများအားလုံးကို Quiz-app folder တွင် ရှိပြီး၊ စစ်တမ်း ၄၈ များ ဖြစ်ပြီး တစ်ခုလျှင် ၃ မေးခွန်း ပါဝင်သည်။ [ဤနေရာမှ](https://ff-quizzes.netlify.app/web/) တွင် ရနိုင်ပြီး၊ quiz app ကို locally တွင် သို့မဟုတ် Azure တွင် deploy ပြုလုပ်နိုင်သည်; `quiz-app` folder အတွင်း ညွှန်ကြားချက်အတိုင်း လိုက်နာပါ။
## 🗃️ Lessons ## 🗃️ လေ့လာခန်းများ
| | Project Name | Concepts Taught | Learning Objectives | Linked Lesson | Author | | | စီမံကိန်းအမည် | သင်ကြားမည့် အကြောင်းအရာများ | သင်ယူရမည့်ရည်မှန်းချက်များ | ချိတ်ဆက်ထားသော လေ့လာခန်း | စာရေးသူ |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :----------------------------------------------------------: | :----------------------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn the basic underpinnings behind most programming languages and about software that helps professional developers do their jobs | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | စတင် လေ့လာခြင်း | ပရိုဂရမ်မင်းနှင့် ကိရိယာများအကြောင်း ရှင်းလင်းချက် | ပရိုဂရမ်မင်းဘာသာစကားများ၏ အခြေခံ အကြောင်းအရာများနှင့် ကိုယ့်အလုပ်ကို အကောင်းဆုံးဆောင်ရွက်ရန် အသုံးပြုသည့် ဆော့ဖ်ဝဲများအကြောင်း လေ့လာခြင်း | [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 in your project, how to collaborate with others on a code base | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | စတင် လေ့လာခြင်း | GitHub ၏ အခြေခံများ၊ အဖွဲ့လိုက် လုပ်ဆောင်ခြင်းပါဝင်သည် | ကိုယ့်စီမံကိန်းအတွက် GitHub ကို ဘယ်လိုအသုံးပြုမလဲ၊ ကုဒ်ဘေ့စ်ပေါ်တွင်အခြားသူများနှင့် ပူးပေါင်းရန်နည်းလမ်းများ | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Accessibility | Learn the basics of web accessibility | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | စတင် လေ့လာခြင်း | လျှောက်လွှာ လမ်းညွှန်မှု | ဝက်ဘ်လျှောက်လွှာများတွင် အဝင်လမ်းလျှောက်လမ်းများအခြေခံများကိုသင်ကြားခြင်း | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | JavaScript Data Types | The basics of JavaScript data types | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | JS အခြေခံ | JavaScript ဒေတာအမျိုးအစားများ | 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 an application's logic flow | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | | 05 | JS အခြေခံ | Functions နှင့် Methods | application ၏ logic flow ကို စီမံရန် functions နှင့် methods များအကြောင်း လေ့လာခြင်း | [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 in your code using decision-making methods | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | JS အခြေခံ | JS နဲ့ ဆုံးဖြတ်ချက်ချခြင်း | သင့်ကုဒ်အတွင်းတွင် ဆုံးဖြတ်ချက်များ ဖန်တီးမှုကို 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 in JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | JS အခြေခံ | Arrays နှင့် Loops | JavaScript တွင် data များအား arrays နှင့် loops ဖြင့် ကိုင်တွယ်ခြင်း | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in Practice | Build the HTML to create an online terrarium, focusing on building a layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML လက်တွေ့လုပ်ငန်း | online terrarium တည်ဆောက်ခြင်းအတွက် HTML ကို တည်ဆောက်ခြင်း၊ layout အတွက်အာရုံစိုက်ခြင်း | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in Practice | Build the CSS to style the online terrarium, focusing on the basics of CSS including making the page responsive | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS လက်တွေ့လုပ်ငန်း | online terrarium ၏ CSS ကို တည်ဆောက်ခြင်း၊ page ၏ responsiveness အတွက် CSS အခြေခံများအာရုံစိုက်ခြင်း | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build the JavaScript to make the terrarium function as a drag/drop interface, focusing 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 ကိုင်တွယ်ခြင်း | terrarium ကို drag/drop အင်တာဖေ့စ်အဖြစ် လုပ်ဆောင်ဖို့ JavaScript ကို တည်ဆောက်ခြင်း၊ closures နှင့် 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 drive the 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) | ကီးဘုတ်အားအသုံးပြုပြီး အကြောင်းအရာ တည်ဆောက်ခြင်း | JavaScript app ၏ logic ကို ကီးဘုတ်နှိပ်မှု event များဖြင့် ထိန်းချုပ်သုံးစွဲနည်း | [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 work, their history, and how to scaffold the first elements of a browser extension | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Browser များဖြင့် လုပ်ဆောင်ခြင်း | ဘရောက်ဇာများလုပ်ဆောင်ပုံ၊ သမိုင်းကြောင်းနှင့် 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 the JavaScript elements of your browser extension to call an API using variables stored in local storage | [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) | ဖောင်တစ်ခု ဖန်တီးခြင်း၊ API ခေါ်ယူခြင်းနှင့် ဒေတာကို local storage တွင် သိမ်းဆည်းခြင်း | သင့် browser extension ၏ JavaScript element များကို အသုံးပြုပြီး API ခေါ်ယူခြင်း၊ local storage တွင် သိမ်းဆည်းထားသော variable များကိုအသုံးပြုခြင်း | [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 the browser's background processes to manage the extension's 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) | ဘရောက်ဇာအတွင်းနောက်ခံလုပ်ဆောင်မှုများ၊ ဝက်ဘ်ကွန်ပျူတာကောင်းမွန်မှု | extension icon ကို ထိန်းချုပ်ရန် browser ၏ နောက်ခံလုပ်ဆောင်မှုများ အသုံးပြုခြင်း၊ ဝက်ဘ်ကွန်ပျူတာကောင်းမွန်မှုနှင့် စွမ်းဆောင်ရည်မြှင့်တင်ခြင်းနည်းလမ်းများ | [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 both Classes and Composition and the Pub/Sub pattern, in preparation for building a game | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Space Game](./6-space-game/solution/README.md) | JavaScript ဖြင့် ဂိမ်း တိုးတက်စွာဖန်တီးခြင်း | Classes နှင့် Composition ကို သုံး၍ Inheritance နှင့် Pub/Sub pattern အကြောင်း သင်ယူခြင်း၊ ဂိမ်း တည်ဆောက်မှုအတွက် အသင့်ပြင်ဆင်ခြင်း | [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 the Canvas API, used to draw elements to a screen | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Space Game](./6-space-game/solution/README.md) | Canvas ပေါ်တွင် ပန်းချီဆွဲခြင်း | screen ပေါ်တွင် အရာဝတ္ထုများ ဆွဲဆောင်ရန် အသုံးပြုသော Canvas API အကြောင်း သင်ယူခြင်း | [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 can gain motion using the cartesian coordinates and the Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Space Game](./6-space-game/solution/README.md) | အရာဝတ္ထုများကို မျက်နှာပြင်ပေါ် ပတ်လည်တည်နေရာပြောင်းခြင်း | cartesian coordinates နဲ့ 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 and provide a cooldown function to ensure performance of the game | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Space Game](./6-space-game/solution/README.md) | အရာဝတ္ထုပေါ်တိုက်ဆက်မှုဖြစ်စဉ် | ကီးနှိပ်မှုများအသုံးပြုပြီးအရာဝတ္ထုများ တိုက်ဆက်အောင်လုပ်ခြင်း၊ ဂိမ်းစွမ်းဆောင်ရည်အတွက် cooldown function ပေးခြင်း | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Keeping score | Perform math calculations based on the game's 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](./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 ending and restarting the game, including cleaning up assets and resetting variable values | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Space Game](./6-space-game/solution/README.md) | ဂိမ်းအဆုံးသတ်ခြင်းနှင့် ပြန်စတင်ခြင်း | ဂိမ်း အဆုံးသတ်ခြင်းနှင့် ပြန်စတင်ခြင်းအကြောင်း၊ asset များသန့်ရှင်းခြင်းနှင့် variable value များ reset လုပ်ခြင်း | [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 the scaffold of a multipage website's 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 Template နှင့် Route များ | routing နှင့် 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) | Login နှင့် Registration ဖောင် တည်ဆောက်ခြင်း | form များဖန်တီးခြင်းနှင့် validation routine များ ကိုင်တွယ်နည်း | [Forms](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Methods of Fetching and Using Data | How data flows in and out of your app, how to fetch it, store it, and dispose of it | [Data](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banking App](./7-bank-project/solution/README.md) | ဒေတာ ရယူခြင်းနှင့် အသုံးပြုနည်း | သင့်အက်ပ်ထဲသို့ ဒေတာ ဝင်နှင့် ထွက်တစ်လျှောက် လည်ပတ်ပုံ၊ ဒေတာ ရယူခြင်း၊ သိမ်းဆည်းခြင်း၊ ဖျက်ပစ်ခြင်း | [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 retains state and how to manage it programmatically | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banking App](./7-bank-project/solution/README.md) | State Management အကြောင်း | သင့်အက်ပ်အတွက် state ကို ဘယ်လိုစနစ်တကျ သိမ်းဆည်းပြီး အမျိုးမျိုးဖြင့် စီမံခန့်ခွဲရမည် ဆိုတာသင်ယူခြင်း | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Working with VScode | Learn how to Using a code editor| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Browser/VScode Code](../../8-code-editor) | VScode နဲ့ လုပ်ဆောင်ခြင်း | ကုဒ် တည်းဖြတ်စက်အသုံးပြုနည်း သင်ယူပါ| [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) | AI နည်းပညာ အသုံးပြုခြင်း | ကိုယ့်ကိုယ်ပိုင် AI အကူအညီသူ တည်ဆောက်နည်း သင်ယူပါ | [AI Assistant project](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogy ## 🏫 သင်ကြားနည်း ပြောကြားချက်
Our curriculum is designed with two key pedagogical principles in mind: ကျွန်ုပ်တို့၏ သင်တန်းအစီအစဉ်သည် အောက်ပါ ပညာသင်ကြားမှု အခြေခံသဘောတရား နှစ်ခုဖြင့် ဖန်တီးထားသည်-
* project-based learning * စီမံကိန်းအခြေပြုပြုသင်ယူမှု
* frequent quizzes * မကြာခဏရှိသော စစ်တမ်းများ
The program teaches the fundamentals of JavaScript, HTML, and CSS, as well as the latest tools and techniques used by today's web developers. Students will have the opportunity to develop hands-on experience by building a typing game, virtual terrarium, eco-friendly browser extension, space-invader-style game, and a banking app for businesses. By the end of the series, students will have gained a solid understanding of web development. ပရိုဂရမ်သည် JavaScript, HTML, CSS အခြေခံများနှင့် လက်ရှိ ဝက်ဘ် developer များ အသုံးပြုသည့် နောက်ဆုံးပေါ် ကိရိယာများနှင့် နည်းစနစ်များကို သင်ကြားပေးသည်။ ကျောင်းသားများသည် typing game, virtual terrarium, eco-friendly browser extension, space-invader ပုံစံဂိမ်း နှင့် စီးပွားရေးလုပ်ငန်းများအတွက် ဘဏ်လုပ်ငန်း အက်ပ် တည်ဆောက်ခြင်းတို့ဖြင့် လက်တွေ့ကျွမ်းကျင်မှု ရရှိနိုင်မည်ဖြစ်သည်။ အစီအစဉ်၏ အဆုံးသတ်အချိန်တွင် ဝက်ဘ်ဖွံ့ဖြိုးမှုကို ပြင်းထန်စွာ နားလည်မှု ရရှိစေမည် ဖြစ်သည်။
> 🎓 You can take the first few lessons in this curriculum as a [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) on Microsoft Learn! > 🎓 သင်တန်းအစိတ်အပိုင်း ကျော်တက်၍ Microsoft Learn တွင်ရှိသည့် [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) အဖြစ် သင်ယူနိုင်သည်!
By ensuring that the content aligns with projects, the process is made more engaging for students and retention of concepts will be augmented. We also wrote several starter lessons in JavaScript basics to introduce concepts, paired with a video from the "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collection of video tutorials, some of whose authors contributed to this curriculum. အကြောင်းအရာများကို project များနှင့် ကိုက်ညီစေရန် ကြိုးစားခြင်းကြောင့် ကျောင်းသားများအတွက် ပိုမိုစိတ်ဝင်စားမှုရှိကာ သင်ယူမှုအတွင်း ပါဝင်မှုတိုးတက်စေသည်။ JavaScript အခြေခံများသင်ကြားရန် စတင်လေ့လာခန်းများ၊ "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ဗီဒီယို သင်ခန်းစာ စီးရီးများဖြင့် တွဲဖက်ရေးသားထားသည်။ အချို့သောစာရေးသူများက ဒီအစီအစဉ်တွင် ပါဝင်ခဲ့သည်။
In addition, a low-stakes quiz before a class sets the intention of the student towards learning a topic, while a second quiz after class ensures further retention. This curriculum was designed to be flexible and fun and can be taken in whole or in part. The projects start small and become increasingly complex by the end of the 12-week cycle. ဒီအစီအစဉ်တွင် နည်းပညာတစ်ခုကို သင်ယူနိုင်ရန် စစ်တမ်းအနည်းငယ် မတိုင်မီနှင့် စစ်တမ်း တစ်ခုအပြီး သုံးကွင်းစစ်တမ်းတို့ဟာ သင်ယူမည့် အကြောင်းအရာများ၌ အားပြုထားခြင်းဖြစ်သည်။ ဒီအစီအစဉ်ကို လေးနက်စွာ လေ့လာရန် တစ်ခုလုံး သို့မဟုတ် အစိတ်အပိုင်း တစ်စိတ်တစ်ဒေသယူပြီး ရင်းနှီးနိုင်သည်။ ၁၂ ပတ်အတွင်း သင်ယူရာတွင် စီမံကိန်းများသည် ဆက်တိုက် ရှင်းလင်းကောင်းကောင်းဖြစ်လာမည်။
While we have purposefully avoided introducing JavaScript frameworks to concentrate on the basic skills needed as a web developer before adopting a framework, a good next step to completing this curriculum would be learning about Node.js via another collection of videos: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". JavaScript framework များကို မသွင်းယူဘဲ web developer အနေဖြင့် အခြေခံကျကျ လေ့ကျင့်ဖို့ ဗဟုသုတ ရစေမည့်အတွက် framework မသုံးမီ အခြေခံကျကျ လေ့လာပုံ အစီအစဉ် ဖြစ်သည်။ ဒီအစီအစဉ်ပြီးဆုံးပြီးရင် Node.js သင်ခန်းစာများ သင်ယူရန် ကောင်းမည့် နောက်တခုအနေဖြင့် "[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! > ကျွန်ုပ်တို့၏ [Code of Conduct](CODE_OF_CONDUCT.md) နှင့် [Contributing](CONTRIBUTING.md) လမ်းညွှန်ချက်များကို ကြည့်ရှုနိုင်ပါသည်။ သင့်တန်ဖိုးရှိ အကြံဉာဏ်များကို ကြိုဆိုပါသည်!
## 🧭 Offline access ## 🧭 အော့ဖ်လိုင်း ခွင့်ပြုချက်
You can 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, and then in the root folder of this repo, type `docsify serve`. The website will be served on port 3000 on your localhost: `localhost:3000`. [Docsify](https://docsify.js.org/#/) ကို အသုံးပြု၍ ဒီစာတမ်းကို အော့ဖ်လိုင်းတွင် လည်ပတ်နိုင်သည်။ ဒီ repo ကို fork လုပ်ပြီး၊ သင့်ကိုယ်ပိုင်စက်သို့ [Docsify](https://docsify.js.org/#/quickstart) ကို install ပြုလုပ်ပါ၊ ထို့နောက် ဒီ repo root folder တွင် `docsify serve` ဟု ရိုက်ထည့်ပါ။ ဝက်ဘ်ဆိုက်သည် နေရာတိုင်းသုံး localhost ၏ 3000 port တွင် ရရှိနိုင်ပါမည် - `localhost:3000`။
## 📘 PDF ## 📘 PDF
စာသင်ခန်းအားလုံးအတွက် PDF ကို [ဒီမှာ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) တွေ့နိုင်သည်။ သင်ခန်းစာအားလုံးသို့မဟုတ် PDF ကို ဒီမှာတွေ့နိုင်ပါတယ် [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)။
## 🎒 အခြားဘာသာရပ်များ ## 🎒 အခြားသင်တန်းများ
ကျွန်တော်တို့အသင်းက အခြားဘာသာရပ်တွေ ထုတ်လုပ်ပါတယ်! တစ်ခါကြည့်ပါ: ကျွန်ုပ်တို့အဖွဲ့သည် အခြားသင်တန်းများကို ထုတ်လုပ်လျက်ရှိပါသည်။ စစ်ဆေးကြည့်ပါ-
<!-- CO-OP TRANSLATOR OTHER COURSES START --> <!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain ### LangChain
@ -260,21 +242,21 @@ You can run this documentation offline by using [Docsify](https://docsify.js.org
## ကူညီမှုရယူခြင်း ## ကူညီမှုရယူခြင်း
AI အက်ပ်များ ဖန်တီးရာတွင် မတက်နိုင်ပါက သို့မဟုတ် မေးခွန်းများရှိပါက MCP အကြောင်း ဆွေးနွေးမှုများတွင် လေ့လာသူများနှင့် အတွေ့အကြုံရှိသော ဖန်တီးသူများနှင့် ပါဝင်ဆွေးနွေးနိုင်သည်။ အဆိုပါအသိုင်းအဝိုင်းသည် မေးခွန်းများအား ကြိုဆိုပြီး အသိပညာကို အလွတ်ပေးဝေမှုရှိသော သက်ဆိုင်ရာ ကူညီမှုအသိုင်းအဝိုင်းဖြစ်သည်။ AI အက်ပ်များ တည်ဆောက်ရာတွင် ဖိအားခံရလျှင် သို့မဟုတ် မေးခွန်းရှိချိန်တွင် MCP အကြောင်း ညှိနှိုင်းမှုများတွင် တွဲဖက်သင်ယူနေကြသည့် လေ့လာသူများ နှင့် အတွေ့အကြုံရှိသော developer များနှင့် တွဲဖက်ရောကြသည်။ မေးခွန်းများ လက်ခံသော ပံ့ပိုးထောက်ပံ့မှုရှိသော အသိုင်းအဝိုင်းဖြစ်ပြီး သတင်းအချက်အလက်များ ကိုလည်း လွတ်လပ်စွာမျှဝေကြသည်။
[![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)
## လိုင်စင် ## လိုင်စင်
ဤ repository သည် MIT လိုင်စင်ဖြင့် လိုင်စင်ပြုထားပါသည်။ ပိုမိုသိရှိရန် [LICENSE](../../LICENSE) ဖိုင်ကို ကြည့်ပါ။ ဤ repository သည် 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 -->

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-03-27T23:09:23+00:00", "translation_date": "2026-04-06T17:51:02+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "uk" "language_code": "uk"
}, },
@ -516,8 +516,8 @@
"language_code": "uk" "language_code": "uk"
}, },
"README.md": { "README.md": {
"original_hash": "a2c9eed480687319517c08a6319e5536", "original_hash": "b885c87c7544109b78d6684daad6cba6",
"translation_date": "2026-03-06T17:04:59+00:00", "translation_date": "2026-04-06T17:46:13+00:00",
"source_file": "README.md", "source_file": "README.md",
"language_code": "uk" "language_code": "uk"
}, },

@ -2,27 +2,27 @@
## Огляд проекту ## Огляд проекту
Це навчальний репозиторій курсу для викладання основ веб-розробки початківцям. Курс є комплексним 12-тижневим навчальним планом, розробленим Microsoft Cloud Advocates, що включає 24 практичні уроки з JavaScript, CSS та HTML. Це навчальний репозиторій для викладання основ веб-розробки початківцям. Навчальний курс — це комплексний 12-тижневий курс, розроблений Microsoft Cloud Advocates, який містить 24 практичні уроки, що охоплюють JavaScript, CSS і HTML.
### Ключові компоненти ### Ключові компоненти
- **Навчальний контент**: 24 структуровані уроки, організовані у модулі на основі проектів - **Навчальний контент**: 24 структуровані уроки, організовані у проектні модулі
- **Практичні проекти**: Терраріум, Мережна гра, Розширення для браузера, Космічна гра, Банківський додаток, Редактор коду та AI чат-асистент - **Практичні проекти**: Терраріум, Гра на друкування, Розширення браузера, Космічна гра, Банківський додаток, Редактор коду та AI чат-асистент
- **Інтерактивні тести**: 48 тестів по 3 питання кожен (до/після уроку) - **Інтерактивні тести**: 48 тестів по 3 запитання в кожному (до і після уроку)
- **Підтримка багатьох мов**: Автоматичний переклад понад 50 мов за допомогою GitHub Actions - **Підтримка кількох мов**: Автоматичні переклади більш ніж 50 мовами за допомогою GitHub Actions
- **Технології**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (для AI-проектів) - **Технології**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (для AI-проектів)
### Архітектура ### Архітектура
- Навчальний репозиторій зі структурою на основі уроків - Навчальний репозиторій зі структурою на основі уроків
- Кожна папка з уроком містить README, приклади коду та розв’язки - Кожна папка уроку містить README, приклади коду та рішення
- Окремі автономні проекти у власних директоріях (quiz-app, різні проекти уроків) - Окремі проекти у власних директоріях (quiz-app, різні проекти уроків)
- Система перекладів з використанням GitHub Actions (co-op-translator) - Система перекладів через GitHub Actions (co-op-translator)
- Документація подається через Docsify та доступна в PDF - Документація подається за допомогою Docsify та доступна у форматі PDF
## Команди для налаштування ## Команди налаштування
Цей репозиторій призначений передусім для споживання навчального контенту. Для роботи з конкретними проектами: Цей репозиторій призначений головним чином для споживання навчального контенту. Для роботи з конкретними проектами:
### Основне налаштування репозиторію ### Основне налаштування репозиторію
@ -31,17 +31,17 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Налаштування додатку Quiz (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
``` ```
### API банківського проєкту (Node.js + Express) ### API проекту Bank (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
@ -51,12 +51,12 @@ npm run lint # Запустити ESLint
npm run format # Відформатувати за допомогою Prettier npm run format # Відформатувати за допомогою Prettier
``` ```
### Проекти розширень для браузера ### Проекти розширень браузера
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Дотримуйтесь інструкцій із завантаження розширень, специфічних для браузера # Дотримуйтесь інструкцій завантаження розширень, специфічних для браузера
``` ```
### Проекти космічної гри ### Проекти космічної гри
@ -67,50 +67,50 @@ npm install
# Відкрийте index.html у браузері або використайте Live Server # Відкрийте index.html у браузері або використайте Live Server
``` ```
### Чат-проект (бекенд на Python) ### Проект чату (Python Backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Встановіть змінну середовища GITHUB_TOKEN # Встановіть змінну оточення GITHUB_TOKEN
python api.py python api.py
``` ```
## Робочий процес розробки ## Робочий процес розробки
### Для учасників контенту ### Для авторів контенту
1. **Форкніть репозиторій** у ваш обліковий запис GitHub 1. **Форкніть репозиторій** в свій акаунт GitHub
2. **Клонуйте свій форк** локально 2. **Клонувати форк** локально
3. **Створіть нову гілку** для ваших змін 3. **Створіть нову гілку** для своїх змін
4. Вносіть зміни в контент уроків або приклади коду 4. Вносьте зміни в контент уроків або приклади коду
5. Тестуйте зміни коду у відповідних директоріях проектів 5. Тестуйте всі зміни коду у відповідних директоріях проектів
6. Надсилайте pull request відповідно до правил внеску 6. Надсилайте pull-реквести, дотримуючись правил внесків
### Для учнів ### Для учнів
1. Форкніть або клонуюйте репозиторій 1. Форкніть або клонувати репозиторій
2. Перейдіть до директорій уроків послідовно 2. Перейдіть послідовно до директорій уроків
3. Читайте README файли кожного уроку 3. Читайте README файли кожного уроку
4. Виконуйте тести перед уроком на https://ff-quizzes.netlify.app/web/ 4. Виконуйте тести перед уроком на https://ff-quizzes.netlify.app/web/
5. Працюйте з прикладами коду у папках уроку 5. Працюйте з прикладами коду у папках уроків
6. Виконуйте завдання та виклики 6. Виконуйте завдання і виклики
7. Пройдіть тести після уроку 7. Пройдіть тести після уроку
### Жива розробка ### Жива розробка
- **Документація**: Запустіть `docsify serve` в корені репозиторію (порт 3000) - **Документація**: Запуск `docsify serve` в корені (порт 3000)
- **Quiz App**: Запуск `npm run dev` в директорії quiz-app - **Quiz App**: Запуск `npm run dev` в каталозі quiz-app
- **Проекти**: Використовуйте розширення VS Code Live Server для HTML-проектів - **Проекти**: Використовуйте розширення VS Code Live Server для HTML-проектів
- **API проекти**: Запуск `npm start` у відповідних API-директоріях - **API-проекти**: Запуск `npm start` у відповідних директоріях API
## Інструкції з тестування ## Інструкції для тестування
### Тестування Quiz App ### Тестування Quiz App
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Перевірте на наявність проблем зі стилем коду npm run lint # Перевірте проблеми зі стилем коду
npm run build # Переконайтеся, що збірка успішна npm run build # Переконайтеся, що збірка успішна
``` ```
@ -118,69 +118,69 @@ npm run build # Переконайтеся, що збірка успішн
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Перевірте на наявність проблем зі стилем коду npm run lint # Перевірте наявність проблем зі стилем коду
node server.js # Переконайтеся, що сервер запускається без помилок node server.js # Переконайтеся, що сервер запускається без помилок
``` ```
### Загальний підхід до тестування ### Загальний підхід до тестування
- Це навчальний репозиторій без повного набору автоматизованих тестів - Це навчальний репозиторій без комплексних автоматизованих тестів
- Ручне тестування зосереджене на: - Ручне тестування зосереджене на:
- Виконання коду без помилок - Запуску прикладів коду без помилок
- Коректність посилань у документації - Практичній роботі посилань у документації
- Успішне завершення збірок проектів - Успішному завершенню збірок проектів
- Використання кращих практик у прикладах - Дотриманні кращих практик у прикладах
### Перевірки перед поданням ### Перевірки перед поданням
- Запустіть `npm run lint` у директоріях з package.json - Запустіть `npm run lint` у директоріях із package.json
- Переконайтеся, що всі markdown-посилання валідні - Переконайтеся, що посилання у Markdown дійсні
- Перевірте приклади коду в браузері або Node.js - Перевірте приклади коду у браузері або Node.js
- Переконайтеся, що переклади збережено правильною структурою - Переконайтеся, що переклади зберігають правильну структуру
## Керівництво зі стилю коду ## Керівництво зі стилю коду
### JavaScript ### JavaScript
- Використовуйте сучасний синтаксис ES6+ - Використовуйте сучасний синтаксис ES6+
- Дотримуйтеся стандартних конфігурацій ESLint у проектах - Дотримуйтесь стандартних конфігурацій ESLint в проектах
- Використовуйте зрозумілі назви змінних і функцій для навчальної ясності - Використовуйте зрозумілі імена змінних і функцій для навчальної ясності
- Додавайте коментарі із поясненнями концепцій для учнів - Додавайте коментарі, що пояснюють концепції для учнів
- Форматуйте код за допомогою Prettier, якщо налаштовано - Форматуйте код за допомогою Prettier там, де це налаштовано
### HTML/CSS ### HTML/CSS
- Семантичні елементи HTML5 - Семантичні елементи HTML5
- Принципи адаптивного дизайну - Принципи адаптивного дизайну
- Чіткі конвенції іменування класів - Чіткі конвенції іменування класів
- Коментарі з поясненнями CSS для учнів - Коментарі, що пояснюють CSS-техніки для учнів
### Python ### Python
- Дотримання стилю PEP 8 - Відповідність стилю PEP 8
- Зрозумілі, освітні приклади коду - Чіткі, навчальні приклади коду
- Типові підказки там, де це допомагає для вивчення - Вказування типів там, де це корисно для навчання
### Документація у Markdown ### Документація Markdown
- Чітка ієрархія заголовків - Чітка ієрархія заголовків
- Блоки коду з вказанням мови - Код-блоки з вказаною мовою
- Посилання на додаткові ресурси - Посилання на додаткові ресурси
- Скриншоти та зображення у папках `images/` - Знімки екрана та зображення у папках `images/`
- Атрибути alt для зображень для доступності - Атрибути alt для зображень для забезпечення доступності
### Організація файлів ### Організація файлів
- Уроки нумеруются послідовно (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}/`
## Збірка та розгортання ## Збірка та розгортання
### Розгортання Quiz App (Azure Static Web Apps) ### Розгортання Quiz App (Azure Static Web Apps)
Quiz-app налаштовано для розгортання в Azure Static Web Apps: quiz-app налаштований для розгортання в Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
@ -188,42 +188,42 @@ npm run build # Створює папку dist/
# Розгортає через GitHub Actions workflow при пуші в main # Розгортає через GitHub Actions workflow при пуші в main
``` ```
Налаштування Azure Static Web Apps: Конфігурація Azure Static Web Apps:
- **Місцезнаходження додатку**: `/quiz-app` - **Місцезнаходження додатку**: `/quiz-app`
- **Вихідна папка**: `dist` - **Місце вихідних файлів**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Генерація PDF-документації ### Генерація PDF документації
```bash ```bash
npm install # Встановіть docsify-to-pdf npm install # Встановіть docsify-to-pdf
npm run convert # Згенерувати PDF з docs npm run convert # Генеруйте PDF з docs
``` ```
### Документація Docsify ### Документація Docsify
```bash ```bash
npm install -g docsify-cli # Встановіть Docsify глобально npm install -g docsify-cli # Встановіть Docsify глобально
docsify serve # Запустіть на localhost:3000 docsify serve # Обслуговувати на localhost:3000
``` ```
### Збірки проектів ### Збірки для конкретних проектів
Кожна директорія проекту може мати власний процес збірки: Кожен каталог проекту може мати власний процес збірки:
- Vue-проекти: `npm run build` для створення продакшн-бандлів - Проекти на Vue: `npm run build` створює продуктивні бандли
- Статичні проекти: немає кроку збірки, файли подаються напряму - Статичні проекти: відсутній крок збірки, файли подаються напряму
## Правила Pull Request ## Вказівки для Pull Request
### Формат заголовка ### Формат заголовка
Використовуйте чіткі, описові заголовки, що вказують на зону змін: Використовуйте чіткі, описові заголовки, що вказують сферу змін:
- `[Quiz-app] Додати новий тест для уроку X` - `[Quiz-app] Додати новий тест для уроку X`
- `[Lesson-3] Виправити помилку в проекті терраріум` - `[Lesson-3] Виправлення опечатки у проекті терраріум`
- `[Translation] Додати іспанський переклад для уроку 5` - `[Translation] Додати іспанський переклад для уроку 5`
- `[Docs] Оновити інструкції з налаштування` - `[Docs] Оновлення інструкцій з налаштування`
### Вимоги до перевірок ### Обов’язкові перевірки
Перед поданням PR: Перед поданням PR:
@ -232,47 +232,47 @@ docsify serve # Запустіть на localhost:3000
- Виправте всі помилки та попередження lint - Виправте всі помилки та попередження lint
2. **Перевірка збірки**: 2. **Перевірка збірки**:
- Запустіть `npm run build` якщо застосовано - Запустіть `npm run build`, якщо застосовано
- Переконайтеся, що нема помилок збірки - Переконайтеся, що немає помилок збірки
3. **Перевірка посилань**: 3. **Перевірка посилань**:
- Перевірте всі markdown-посилання - Перевірте всі посилання в markdown
- Переконайтеся, що посилання на зображення працюють - Переконайтеся, що посилання на зображення працюють
4. **Перевірка контенту**: 4. **Перегляд контенту**:
- Вичитайте на предмет орфографії та граматики - Вичитування на орфографію та граматику
- Переконайтеся у правильності та освітності прикладів коду - Переконайтеся, що приклади коду коректні та навчальні
- Перевірте переклади на збереження початкового значення - Перевірте, що переклади зберігають оригінальний зміст
### Вимоги до внеску ### Вимоги до внеску
- Погодьтеся з Microsoft CLA (автоматична перевірка при першому PR) - Погодитися з Microsoft CLA (автоматична перевірка при першому PR)
- Дотримуйтесь [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Дотримуватися [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Детальні інструкції у [CONTRIBUTING.md](./CONTRIBUTING.md) - Див. [CONTRIBUTING.md](./CONTRIBUTING.md) для детальних вказівок
- Вказуйте номери issue у описі PR при потребі - Вказувати номер issue в описі PR, якщо застосовано
### Процес огляду ### Процес рецензії
- PR переглядають мейнтейнер і спільнота - PR переглядають підтримувачі і спільнота
- Освітня ясність ставиться у пріоритет - Пріоритет — навчальна зрозумілість
- Приклади коду мають відповідати актуальним кращим практикам - Приклади коду повинні відповідати актуальним кращим практикам
- Переклади перевіряються на точність та культурну відповідність - Переклади перевіряються на точність та культурну відповідність
## Система перекладів ## Система перекладу
### Автоматичний переклад ### Автоматичний переклад
- Використовує GitHub Actions з workflow co-op-translator - Використовує GitHub Actions з workflow co-op-translator
- Автоматично перекладає на понад 50 мов - Перекладає автоматично на понад 50 мов
- Файли джерела у основних директоріях - Файли джерел у основних каталогах
- Перекладені файли у `translations/{language-code}/` - Перекладені файли в `translations/{language-code}/`
### Ручне покращення перекладів ### Додавання ручних покращень перекладів
1. Знайдіть файл у `translations/{language-code}/` 1. Знайдіть файл у `translations/{language-code}/`
2. Вносьте покращення, зберігаючи структуру 2. Внесіть покращення, зберігаючи структуру
3. Переконайтеся, що приклади коду лишаються робочими 3. Переконайтеся, що приклади коду залишаються працездатними
4. Тестуйте будь-який локалізований тестовий контент 4. Тестуйте будь-який локалізований контент тестів
### Метадані перекладу ### Метадані перекладу
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Налагодження та усунення неполадок ## Налагодження та усунення несправностей
### Поширені проблеми ### Поширені проблеми
**Quiz app не запускається**: **Quiz app не запускається**:
- Перевірте версію Node.js (рекомендовано v14+) - Перевірте версію Node.js (рекомендується v14+)
- Видаліть `node_modules` і `package-lock.json`, запустіть `npm install` знову - Видаліть `node_modules` та `package-lock.json`, потім запустіть `npm install` знову
- Перевірте конфлікти портів (стандартний порт Vite — 5173) - Перевірте конфлікти портів (за замовчуванням Vite використовує порт 5173)
**API сервер не запускається**: **API сервер не запускається**:
- Переконайтеся, що версія Node.js відповідає мінімуму (node >=10) - Переконайтеся, що версія Node.js відповідає мінімальній (node >=10)
- Перевірте, чи порт не зайнятий - Перевірте, чи порт не зайнятий
- Переконайтеся, що всі залежності встановлені через `npm install` - Переконайтеся, що всі залежності встановлені через `npm install`
**Розширення браузера не завантажується**: **Розширення браузера не завантажується**:
- Перевірте правильність формату manifest.json - Перевірте правильність форматування manifest.json
- Перевірте в консолі браузера на наявність помилок - Перегляньте консоль браузера на помилки
- Дотримуйтеся інструкцій установки специфічних для браузера - Дотримуйтесь інструкцій з встановлення для конкретного браузера
**Проблеми з Python чат-проектом**: **Проблеми з Python чат-проектом**:
- Перевірте, що пакет OpenAI встановлено: `pip install openai` - Впевніться, що пакет OpenAI встановлений: `pip install openai`
- Переконайтеся, що встановлено змінну середовища GITHUB_TOKEN - Переконайтеся, що встановлено змінну оточення 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`
### Поради для середовища розробки ### Поради щодо середовища розробки
- Використовуйте VS Code з розширенням Live Server для HTML проектів - Використовуйте VS Code з розширенням Live Server для HTML-проектів
- Встановіть ESLint та Prettier для узгодженого форматування - Встановіть розширення ESLint і Prettier для послідовного форматування
- Використовуйте DevTools браузера для налагодження JavaScript - Використовуйте DevTools браузера для налагодження JavaScript
- Для Vue проектів встановіть розширення Vue DevTools браузера - Для проектів Vue встановіть розширення Vue DevTools для браузера
### Міркування щодо продуктивності ### Особливості продуктивності
- Велика кількість перекладених файлів (50+ мов) збільшує розмір клонування - Велика кількість перекладених файлів (понад 50 мов) означає, що повні клони великі
- Використовуйте швидке клонування, якщо працюєте лише з контентом: `git clone --depth 1` - Використовуйте shallow clone, якщо працюєте лише з контентом: `git clone --depth 1`
- Виключайте переклади з пошуку при роботі з англійською версією - Ігноруйте переклади при пошуку в англомовному контенті
- Процеси збірки можуть бути повільними під час першого запуску (npm install, збірка Vite) - Процеси збірки можуть бути повільними при першому запуску (npm install, Vite build)
## Міркування безпеки ## Міркування з безпеки
### Змінні середовища ### Змінні оточення
- Ключі API ніколи не повинні потрапляти у репозиторій - API ключі ніколи не повинні комітися в репозиторій
- Використовуйте `.env` файли (вже в `.gitignore`) - Використовуйте `.env` файли (вже є у `.gitignore`)
- Документуйте потрібні змінні середовища у README проектів - Документуйте необхідні змінні оточення у README проектів
### Python проектів ### Python-проекти
- Використовуйте віртуальні середовища: `python -m venv venv` - Використовуйте віртуальні оточення: `python -m venv venv`
- Оновлюйте залежності - Підтримуйте залежності оновленими
- GitHub токени повинні мати мінімальні необхідні дозволи - Токени GitHub повинні мати мінімально необхідні права
### Доступ до GitHub Models ### Доступ до GitHub Models
- Для GitHub Models потрібні Personal Access Tokens (PAT) - Потрібні Персональні Токени Доступу (PAT) для GitHub Models
- Токени треба зберігати як змінні середовища - Токени зберігайте як змінні оточення
- Ніколи не комітьте токени або облікові дані - Ніколи не комітьте токени або облікові дані
## Додаткові нотатки ## Додаткові зауваження
### Цільова аудиторія ### Цільова аудиторія
- Повні початківці у веб-розробці - Повні початківці у веб-розробці
- Студенти та самонавчальні - Студенти і самонавчальні
- Вчителі, які використовують курс у класах - Викладачі, що використовують курс у класах
- Контент створений з урахуванням доступності та поступового розвитку навичок - Контент розроблено для доступності та поступового нарощування навичок
### Освітня філософія ### Освітня філософія
- Навчання через проекти - Підхід заснований на проектному навчанні
- Часті перевірки знань (тести) - Часті перевірки знань (тести)
- Практичні вправи з кодування - Практичні вправи з кодування
- Приклади із реального світу - Приклади застосування у реальному світі
- Фокус на основах до вивчення фреймворків - Акцент на основах перед роботою з фреймворками
### Підтримка репозиторію ### Підтримка репозиторію
- Активна спільнота учнів і контрибуторів - Активна спільнота учнів і внесників
- Регулярні оновлення залежностей і контенту - Регулярні оновлення залежностей і контенту
- Моніторинг проблем та обговорень мейнтейнерами - Моніторинг питань та дискусій підтримувачами
- Автоматизація оновлень перекладів через GitHub Actions - Оновлення перекладів автоматизовані через GitHub Actions
### Пов’язані ресурси ### Пов'язані ресурси
- [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Модулі Microsoft Learn](https://docs.microsoft.com/learn/)
- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) - [Ресурси Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) рекомендовано для учнів - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) рекомендовано для учнів
- Додаткові курси: налаштування для Generative AI, Data Science, ML, IoT - Додаткові курси: Generative AI, Data Science, ML, IoT доступні
### Робота з конкретними проектами ### Робота з конкретними проектами
Для детальних інструкцій щодо окремих проектів дивіться 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` - розробка гри з canvas - `6-space-game/README.md` - Розробка гри на Canvas
- `9-chat-project/README.md` - проект AI чат-асистента - `9-chat-project/README.md` - Проект AI чат-асистента
### Структура монорепозиторію ### Структура монорепозиторію
Хоча це не традиційний монорепозиторій, він містить кілька незалежних проектів: Хоч це не традиційний монорепозиторій, він містить кілька незалежних проектів:
- Кожен урок є автономним - Кожен урок автономний
- Проекти не ділять залежності - Проекти не мають загальних залежностей
- Працюйте над окремими проектами без впливу на інші - Можна працювати з окремими проектами, не впливаючи на інші
- Клонуйте увесь репозиторій для повного курсу - Для повного курсу клонувати весь репозиторій
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Застереження**: **Відмова від відповідальності**:
Цей документ було перекладено за допомогою сервісу автоматичного перекладу [Co-op Translator](https://github.com/Azure/co-op-translator). Хоч ми і прагнемо до точності, будь ласка, майте на увазі, що автоматичні переклади можуть містити помилки або неточності. Оригінальний документ рідною мовою повинен вважатися авторитетним джерелом. Для критичної інформації рекомендується звертатися до професійного людського перекладу. Ми не несемо відповідальності за будь-які непорозуміння або неправильні тлумачення, що виникають унаслідок використання цього перекладу. Цей документ був перекладений за допомогою сервісу штучного інтелекту [Co-op Translator](https://github.com/Azure/co-op-translator). Хоч ми і прагнемо до точності, будь ласка, майте на увазі, що автоматичні переклади можуть містити помилки або неточності. Оригінальний документ рідною мовою слід вважати авторитетним джерелом інформації. Для критично важливої інформації рекомендується звертатися до професійного людського перекладу. Ми не несемо відповідальності за будь-які непорозуміння чи неправильні тлумачення, що виникли внаслідок використання цього перекладу.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

@ -10,29 +10,29 @@
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
# Веб-розробка для початківців - навчальна програма # Веб-розробка для початківців - Навчальний план
Вивчайте основи веб-розробки за нашим 12-тижневим комплексним курсом від Microsoft Cloud Advocates. Кожен із 24 уроків глибоко занурюється у JavaScript, CSS та HTML через практичні проєкти, такі як тераріуми, розширення браузера та космічні ігри. Беріть участь у вікторинах, обговореннях і практичних завданнях. Покращуйте свої навички та оптимізуйте засвоєння знань за допомогою нашої ефективної педагогіки на основі проєктів. Розпочніть свою програмістську подорож сьогодні! Вивчайте основи веб-розробки за нашим комплексним 12-тижневим курсом від Microsoft Cloud Advocates. Кожен з 24 уроків занурюється у JavaScript, CSS та HTML через практичні проєкти, такі як тераріуми, розширення для браузера та космічні ігри. Взаємодійте з вікторинами, дискусіями та практичними завданнями. Покращуйте свої навички та оптимізуйте засвоєння знань за допомогою ефективної педагогіки, орієнтованої на проєкти. Почніть свою подорож у кодинг вже сьогодні!
Приєднуйтесь до спільноти Azure AI Foundry у Discord Приєднуйтесь до спільноти Azure AI Foundry в Discord
[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG)
Виконайте ці кроки, щоб почати використовувати ці ресурси: Виконайте ці кроки, щоб розпочати роботу з цими ресурсами:
1. **Створіть форк репозиторію**: Натисніть [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 1. **Форкніть репозиторій**: Натисніть [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Клонуйте репозиторій**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Клонуйте репозиторій**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Приєднуйтесь до Azure AI Foundry Discord та зустрічайтеся з експертами і іншими розробниками**](https://discord.com/invite/ByRwuEEgH4) 3. [**Приєднуйтесь до Azure AI Foundry Discord, зустрічайте експертів та колег-розробників**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Підтримка багатьох мов ### 🌐 Підтримка кількох мов
#### Підтримується через GitHub Action (автоматично та завжди актуально) #### Підтримується через GitHub Action (автоматично і завжди актуально)
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
[Арабська](../ar/README.md) | [Бенгальська](../bn/README.md) | [Болгарська](../bg/README.md) | [Бірманська (М’янма)](../my/README.md) | [Китайська (спрощена)](../zh-CN/README.md) | [Китайська (традиційна, Гонконг)](../zh-HK/README.md) | [Китайська (традиційна, Макао)](../zh-MO/README.md) | [Китайська (традиційна, Тайвань)](../zh-TW/README.md) | [Хорватська](../hr/README.md) | [Чеська](../cs/README.md) | [Данська](../da/README.md) | [Голландська](../nl/README.md) | [Естонська](../et/README.md) | [Фінська](../fi/README.md) | [Французька](../fr/README.md) | [Німецька](../de/README.md) | [Грецька](../el/README.md) | [Іврит](../he/README.md) | [Гінді](../hi/README.md) | [Угорська](../hu/README.md) | [Індонезійська](../id/README.md) | [Італійська](../it/README.md) | [Японська](../ja/README.md) | [Каннада](../kn/README.md) | [Корейська](../ko/README.md) | [Литовська](../lt/README.md) | [Малайська](../ms/README.md) | [Малаялам](../ml/README.md) | [Маратхі](../mr/README.md) | [Непальська](../ne/README.md) | [Нігерійський піжин](../pcm/README.md) | [Норвезька](../no/README.md) | [Перська (фарсі)](../fa/README.md) | [Польська](../pl/README.md) | [Португальська (Бразилія)](../pt-BR/README.md) | [Португальська (Португалія)](../pt-PT/README.md) | [Панджабі (гурмухі)](../pa/README.md) | [Румунська](../ro/README.md) | [Російська](../ru/README.md) | [Сербська (кирилиця)](../sr/README.md) | [Словацька](../sk/README.md) | [Словенська](../sl/README.md) | [Іспанська](../es/README.md) | [Свахілі](../sw/README.md) | [Шведська](../sv/README.md) | [Тагальська (філіппінська)](../tl/README.md) | [Тамільська](../ta/README.md) | [Телугу](../te/README.md) | [Тайська](../th/README.md) | [Турецька](../tr/README.md) | [Українська](./README.md) | [Урду](../ur/README.md) | [В’єтнамська](../vi/README.md) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../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](./README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
> **Віддаєте перевагу локальному клонуванню?** > **Віддаєте перевагу клонувати локально?**
> >
> Цей репозиторій включає понад 50 мовних перекладів, що значно збільшує розмір завантаження. Щоб клонувати без перекладів, використайте sparse checkout: > Цей репозиторій містить понад 50 мовних перекладів, що значно збільшує розмір завантаження. Щоб клонувати без перекладів, використовуйте sparse checkout:
> >
> **Bash / macOS / Linux:** > **Bash / macOS / Linux:**
> ```bash > ```bash
@ -48,82 +48,82 @@
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ``` > ```
> >
> Це дасть вам все необхідне для проходження курсу з набагато швидшим завантаженням. > Це надасть вам все необхідне для проходження курсу з набагато швидшим завантаженням.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END --> <!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Якщо ви хочете підтримки додаткових мов перекладу, вони перелічені [тут](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** **Якщо ви хочете, щоб підтримувалися додаткові мови перекладу, вони перелічені [тут](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[![Відкрити у Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑‍🎓 _Ви студент?_ #### 🧑‍🎓 _Ви студент?_
Відвідайте [**сторінку студентського хабу**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), де ви знайдете ресурси для початківців, студентські пакети та навіть способи отримати безкоштовний сертифікат. Це сторінка, яку варто додати до закладок і періодично перевіряти, оскільки контент оновлюється щомісяця. Відвідайте [**сторінку Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), де ви знайдете ресурси для початківців, студентські набори та навіть можливості отримати безкоштовний сертифікат. Це сторінка, яку варто додати до закладок і періодично перевіряти, оскільки вміст оновлюється щомісяця.
### 📣 Оголошення - Нові виклики режиму GitHub Copilot Agent для виконання! ### 📣 Оголошення - Нові виклики в режимі GitHub Copilot Agent для виконання!
Додано новий виклик, шукайте "GitHub Copilot Agent Challenge 🚀" в більшості розділів. Це новий виклик, який вам потрібно виконати, використовуючи GitHub Copilot та режим Agent. Якщо ви раніше не використовували режим Agent, він може не лише генерувати текст, а й створювати та редагувати файли, запускати команди і більше. Додано нове завдання, шукайте "GitHub Copilot Agent Challenge 🚀" у більшості розділів. Це нове завдання, яке ви можете виконати за допомогою GitHub Copilot та режиму Agent. Якщо ви раніше не використовували режим Agent, він може не лише генерувати текст, а й створювати та редагувати файли, запускати команди та багато іншого.
### 📣 Оголошення - _Новий проєкт для створення з використанням генеративного ШІ_ ### 📣 Оголошення - _Новий проєкт для створення із використанням генеративного ШІ_
Щойно додано новий проєкт AI Assistant, ознайомтеся з ним [проект](./9-chat-project/README.md) Щойно додано новий AI Assistant проєкт, ознайомтеся з ним [проєкт](./9-chat-project/README.md)
### 📣 Оголошення - _Нова навчальна програма_ з генеративного ШІ для JavaScript щойно випущена ### 📣 Оголошення - _Новий навчальний план_ з генеративного ШІ для JavaScript щойно випущено
Не пропустіть нашу нову навчальну програму з генеративного ШІ! Не пропустіть наш новий навчальний план з генеративного ШІ!
Відвідайте [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), щоб почати! Відвідайте [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), щоб розпочати!
![Background](../../translated_images/uk/background.148a8d43afde5730.webp) ![Background](../../translated_images/uk/background.148a8d43afde5730.webp)
- Уроки, що охоплюють усе від основ до RAG. - Уроки охоплюють все від основ до RAG.
- Взаємодійте з історичними персонажами за допомогою GenAI і нашого компаньйон-додатку. - Спілкуйтеся з історичними персонажами за допомогою GenAI та нашого супутнього додатку.
- Цікаве і захоплююче оповідання, ви будете подорожувати у часі! - Весела та захоплююча наративна подорож, ви подорожуватимете в часі!
![character](../../translated_images/uk/character.5c0dd8e067ffd693.webp) ![character](../../translated_images/uk/character.5c0dd8e067ffd693.webp)
Кожен урок включає завдання, перевірку знань і виклик, щоб допомогти вам освоїти теми такі як: Кожен урок включає завдання для виконання, перевірку знань та виклик, які допоможуть у вивченні таких тем, як:
- Формулювання запитів і інженерія запитів - Підказки та інженерія підказок
- Генерація текстових та іміжевих додатків - Генерація текстових і графічних додатків
- Пошукові додатки - Пошукові додатки
Відвідайте [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), щоб почати! Відвідайте [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), щоб розпочати!
## 🌱 Початок роботи ## 🌱 Початок роботи
> **Вчителі**, ми включили [деякі пропозиції](for-teachers.md) про те, як використовувати цю навчальну програму. Нам буде цікаво почути ваш відгук [у нашому форумі обговорень](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! > **Вчителі**, ми включили [деякі пропозиції](for-teachers.md) щодо використання цього навчального плану. Ми будемо раді вашим відгукам [на нашому форумі обговорень](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Учні](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, для кожного уроку починайте з попередньої вікторини, далі читайте навчальний матеріал, виконуйте різні завдання та перевіряйте свої знання за допомогою підсумкової вікторини. **[Учні](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, для кожного уроку починайте з передлекційної вікторини, потім читайте матеріал лекції, виконуйте різні активності та перевіряйте розуміння за допомогою післялекційної вікторини.
Щоб покращити свій навчальний досвід, спілкуйтеся з однокурсниками для спільного виконання проєктів! Заохочуються обговорення на нашому [форумі](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), де команда модераторів завжди готова відповісти на ваші запитання. Щоб покращити свій досвід навчання, об'єднуйтесь із однокурсниками для спільної роботи над проєктами! Обговорення заохочуються на нашому [форумі обговорень](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), де команда модераторів допоможе відповісти на ваші запитання.
Для подальшого навчання ми настійно рекомендуємо переглянути [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) для додаткових навчальних матеріалів. Для поглиблення освіти ми настійно рекомендуємо досліджувати [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) для додаткових навчальних матеріалів.
### 📋 Налаштування вашого середовища ### 📋 Налаштування вашого середовища
Ця навчальна програма має готове до роботи середовище розробки! Під час початку ви можете запускати курс у [Codespace](https://github.com/features/codespaces/) (_середовище у браузері, без необхідності встановлювати щось локально_), або локально на вашому комп’ютері за допомогою текстового редактора, наприклад [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Цей навчальний план має готове до роботи середовище розробки! Розпочинаючи, ви можете вибрати запуск курсу в [Codespace](https://github.com/features/codespaces/) (_браузерне середовище без потреби встановлення_), або локально на своєму комп’ютері, використовуючи текстовий редактор, наприклад [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Створіть ваш репозиторій #### Створіть свій репозиторій
Щоб вам було зручно зберігати вашу роботу, рекомендується створити власну копію цього репозиторію. Для цього натисніть кнопку **Use this template** вгорі сторінки. Це створить новий репозиторій у вашому акаунті GitHub з копією навчальної програми. Щоб легко зберігати свою роботу, рекомендується створити власну копію цього репозиторію. Ви можете зробити це, натиснувши кнопку **Use this template** у верхній частині сторінки. Це створить новий репозиторій у вашому обліковому записі GitHub з копією навчального плану.
Слідуйте цим крокам: Виконайте ці кроки:
1. **Зробіть форк репозиторію**: Натисніть кнопку "Fork" у верхньому правому куті цієї сторінки. 1. **Форкніть репозиторій**: Натисніть кнопку "Fork" у правому верхньому куті цієї сторінки.
2. **Клонуйте репозиторій**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 2. **Клонуйте репозиторій**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Запуск курсу у Codespace #### Запуск курсу в Codespace
У вашій копії створеного репозиторію натисніть кнопку **Code** та виберіть **Open with Codespaces**. Це створить для вас новий Codespace для роботи. У власній копії репозиторію, що ви створили, натисніть кнопку **Code** та оберіть **Open with Codespaces**. Це створить для вас новий Codespace для роботи.
![Codespace](../../translated_images/uk/createcodespace.0238bbf4d7a8d955.webp) ![Codespace](../../translated_images/uk/createcodespace.0238bbf4d7a8d955.webp)
#### Запуск курсу локально на вашому комп’ютері #### Запуск курсу локально на вашому комп'ютері
Щоб запустити цей курс локально на вашому комп’ютері, вам потрібен текстовий редактор, браузер та засіб командного рядка. Наш перший урок, [Вступ до мов програмування та інструментів](../../1-getting-started-lessons/1-intro-to-programming-languages), допоможе вам вибрати найзручніші для вас інструменти. Для локального запуску цього курсу вам знадобиться текстовий редактор, браузер та інструмент командного рядка. Перший урок, [Вступ до мов програмування та інструментів професії](../../1-getting-started-lessons/1-intro-to-programming-languages), проведе вас через різні варіанти кожного з цих інструментів, щоб ви могли обрати найкращий для себе.
Ми рекомендуємо використовувати [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) як редактор, який також має вбудований [термінал](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Ви можете завантажити Visual Studio Code [тут](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). Ми рекомендуємо використовувати [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) як свій редактор, який також має вбудований [термінал](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Завантажити Visual Studio Code можна [тут](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Клонуйте свій репозиторій на свій комп’ютер. Ви можете зробити це, натиснувши кнопку **Code** і скопіювавши URL: 1. Клонуйте ваш репозиторій на свій комп’ютер. Ви можете зробити це, натиснувши кнопку **Code** і скопіювавши URL:
[CodeSpace](./images/createcodespace.png) [CodeSpace](./images/createcodespace.png)
@ -133,107 +133,107 @@
git clone <your-repository-url> git clone <your-repository-url>
``` ```
2. Відкрийте папку у Visual Studio Code. Ви можете зробити це, натиснувши **File** > **Open Folder** і вибравши папку, яку щойно клонували. 2. Відкрийте папку у Visual Studio Code. Ви можете зробити це, натиснувши **File** > **Open Folder** і вибравши щойно клоновану папку.
> Рекомендовані розширення Visual Studio Code: > Рекомендовані розширення Visual Studio Code:
> >
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - для попереднього перегляду HTML-сторінок у Visual Studio Code > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - для перегляду HTML-сторінок у Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - щоб допомогти вам швидше писати код > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - щоб допомогти вам швидше писати код
## 📂 Кожен урок містить: ## 📂 Кожен урок включає:
- необов’язкову скетчноут - необов’язкову схематичну замітку
- необов’язкове додаткове відео - необов’язкове додаткове відео
- розминковий тест перед уроком - розминку у вигляді вікторини перед уроком
- письмовий урок - письмовий урок
- для уроків із проектами покрокові інструкції зі створення проекту - для уроків, заснованих на проектах, покрокові інструкції з будування проекту
- перевірки знань - перевірки знань
- виклик
- додаткове читання
- завдання - завдання
- [тест після уроку](https://ff-quizzes.netlify.app/web/) - додаткове читання
- [вікторину після уроку](https://ff-quizzes.netlify.app/web/)
> **Примітка про тести**: Усі тести знаходяться у папці Quiz-app, всього 48 тестів по три питання кожен. Вони доступні [тут](https://ff-quizzes.netlify.app/web/). Додаток для тестів можна запустити локально або розгорнути в Azure; дотримуйтесь інструкцій у папці `quiz-app`. > **Примітка про вікторини**: Усі вікторини зберігаються у папці Quiz-app, загалом 48 вікторин по три питання кожна. Вони доступні [тут](https://ff-quizzes.netlify.app/web/), додаток для вікторин може запускатися локально або бути розгорнутим в Azure; дотримуйтесь інструкцій у папці `quiz-app`.
## 🗃️ Уроки ## 🗃️ Уроки
| | Назва проекту | Вивчені концепції | Навчальні цілі | Пов’язаний урок | Автор | | | Назва проекту | Навчаємі концепції | Навчальні цілі | Пов’язаний урок | Автор |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | | :-: | :-------------------------------------------------------: | :-----------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-------------------: |
| 01 | Початок роботи | Вступ до програмування та інструменти професії | Ознайомитися з основами більшості мов програмування та програмним забезпеченням, яке допомагає професійним розробникам | [Вступ до мов програмування та інструментів професії](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | | 01 | Початок роботи | Вступ до програмування та інструментів професії | Вивчити основні поняття, що лежать в основі більшості мов програмування, та про програмне забезпечення для професійних розробників | [Вступ до мов програмування та інструментів](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Початок роботи | Основи GitHub, включаючи роботу в команді | Як використовувати GitHub у вашому проекті, як співпрацювати з іншими над кодом | [Вступ до GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 02 | Початок роботи | Основи GitHub, робота в команді | Як використовувати GitHub у своєму проєкті, як співпрацювати з іншими у кодовій базі | [Вступ у GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Початок роботи | Доступність | Вивчити основи веб-доступності | [Основи доступності](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | | 03 | Початок роботи | Доступність | Вивчення основ доступності веб-контенту | [Основи доступності](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Основи JS | Типи даних JavaScript | Основи типів даних у JavaScript | [Типи даних](./2-js-basics/1-data-types/README.md) | Jasmine | | 04 | Основи JS | Типи даних JavaScript | Основи типів даних JavaScript | [Типи даних](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Основи JS | Функції та методи | Дізнатися про функції та методи для керування логікою додатка | [Функції та методи](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | | 05 | Основи JS | Функції та методи | Вивчення функцій та методів для керування логікою програми | [Функції та методи](./2-js-basics/2-functions-methods/README.md) | Jasmine та Christopher|
| 06 | Основи JS | Прийняття рішень з JS | Вивчити, як створювати умови у вашому коді, використовуючи методи прийняття рішень | [Прийняття рішень](./2-js-basics/3-making-decisions/README.md) | Jasmine | | 06 | Основи JS | Прийняття рішень у JS | Вивчити, як створювати умови в коді із використанням методів прийняття рішень | [Прийняття рішень](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Основи JS | Масиви та цикли | Робота з даними за допомогою масивів і циклів у JavaScript | [Масиви та цикли](./2-js-basics/4-arrays-loops/README.md) | Jasmine | | 07 | Основи JS | Масиви та цикли | Робота з даними за допомогою масивів та циклів у JavaScript | [Масиви та цикли](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Тераріум](./3-terrarium/solution/README.md) | Практика HTML | Створити HTML для онлайн-тераріуму, зосередившись на створенні макета | [Вступ до HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | | 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML на практиці | Створити HTML для онлайн-терраріуму, зосереджуючись на побудові макету | [Вступ до HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Тераріум](./3-terrarium/solution/README.md) | Практика CSS | Створити CSS для стилізації онлайн-тераріуму, зосередившись на основах CSS, зокрема - адаптивність сторінки | [Вступ до CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | | 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS на практиці | Робота з CSS для стилізації онлайн-терраріуму, зосереджуючись на основах CSS, включно з адаптивністю сторінки | [Вступ до CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Тераріум](./3-terrarium/solution/README.md) | Замикання JavaScript, маніпуляції з DOM | Написати JavaScript, щоб створити функціонал тераріуму як drag/drop інтерфейсу, зосередившись на замиканнях та маніпуляціях DOM | [Замикання JavaScript, маніпуляції з DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | | 10 | [Terrarium](./3-terrarium/solution/README.md) | Замикання JavaScript, маніпулювання DOM | Написати JavaScript, щоб зробити терраріум із можливістю перетягування, з акцентом на замикання та роботу з DOM | [Замикання JavaScript, маніпулювання DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Гра на друкування](./4-typing-game/solution/README.md) | Створення гри на друкування | Вивчити, як використовувати події клавіатури для керування логікою JavaScript-застосунку | [Програмування на подіях](./4-typing-game/typing-game/README.md) | Christopher | | 11 | [Typing Game](./4-typing-game/solution/README.md) | Створення гри для набору тексту | Вивчення використання подій клавіатури для логіки у JavaScript додатку | [Програмування на подіях](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Розширення браузера Green](./5-browser-extension/solution/README.md) | Робота з браузерами | Дізнатися, як працюють браузери, їх історію та як створити перші елементи розширення браузера | [Про браузери](./5-browser-extension/1-about-browsers/README.md) | Jen | | 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Робота з браузерами | Вивчення роботи браузерів, їхньої історії та створення перших елементів розширення браузера | [Про браузери](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Розширення браузера Green](./5-browser-extension/solution/README.md) | Створення форми, виклик API та збереження змінних у локальному сховищі | Створити JavaScript-елементи розширення браузера для виклику API, використовуючи змінні, збережені в локальному сховищі | [API, форми та локальне сховище](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | | 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Створення форми, виклик API та збереження змінних у локальне сховище | Написання JavaScript для виклику API в розширенні браузера із змінними, збереженими у локальному сховищі | [API, форми і локальне сховище](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Розширення браузера Green](./5-browser-extension/solution/README.md) | Фонові процеси в браузері, продуктивність веба | Використовувати фонові процеси браузера для керування іконкою розширення; дізнатися про продуктивність веба та оптимізації | [Фонові задачі та продуктивність](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | | 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Процеси у фоновому режимі браузера, продуктивність веба | Використання фонового режиму браузера для керування іконкою розширення; знайомство з продуктивністю та оптимізаціями веба | [Фонові задачі та продуктивність](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Гра у космосі](./6-space-game/solution/README.md) | Розвиток складніших ігор з JavaScript | Вивчити спадкування за допомогою класів і композиції та шаблон Pub/Sub для створення гри | [Вступ до складної розробки ігор](./6-space-game/1-introduction/README.md) | Chris | | 15 | [Space Game](./6-space-game/solution/README.md) | Розвинена розробка ігор на JavaScript | Вивчення спадкоємності на базі класів, композиції та шаблону Pub/Sub для створення гри | [Вступ до розвиненої розробки ігор](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Гра у космосі](./6-space-game/solution/README.md) | Малювання на холсті | Вивчити Canvas API для малювання елементів на екрані | [Малювання на холсті](./6-space-game/2-drawing-to-canvas/README.md) | Chris | | 16 | [Space Game](./6-space-game/solution/README.md) | Малювання на canvas | Ознайомлення з Canvas API для малювання елементів на екрані | [Малювання на Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Гра у космосі](./6-space-game/solution/README.md) | Переміщення елементів на екрані | Дослідити, як елементи можуть рухатися, використовуючи декартові координати та Canvas API | [Переміщення елементів](./6-space-game/3-moving-elements-around/README.md) | Chris | | 17 | [Space Game](./6-space-game/solution/README.md) | Рух елементів по екрану | Дізнатися про рух елементів за допомогою декартових координат і Canvas API | [Рух елементів на екрані](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Гра у космосі](./6-space-game/solution/README.md) | Виявлення зіткнень | Зробити так, щоб елементи стикалися та реагували один на одного за допомогою натискань клавіш і функції охолодження для продуктивності | [Виявлення зіткнень](./6-space-game/4-collision-detection/README.md) | Chris | | 18 | [Space Game](./6-space-game/solution/README.md) | Виявлення колізій | Зробити зіткнення і реакцію між об’єктами за допомогою натискань клавіш та реалізувати функцію охолодження для продуктивності| [Виявлення колізій](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Гра у космосі](./6-space-game/solution/README.md) | Ведення рахунку | Виконувати розрахунки на основі стану та продуктивності гри | [Ведення рахунку](./6-space-game/5-keeping-score/README.md) | Chris | | 19 | [Space Game](./6-space-game/solution/README.md) | Ведення рахунку | Виконувати обчислення на основі стану і результатів гри | [Ведення рахунку](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Гра у космосі](./6-space-game/solution/README.md) | Завершення та перезапуск гри | Дізнатися про завершення та перезапуск гри, очищення ресурсів і скидання змінних | [Умови завершення](./6-space-game/6-end-condition/README.md) | Chris | | 20 | [Space Game](./6-space-game/solution/README.md) | Завершення та перезапуск гри | Вивчити завершення та перезапуск гри, в тому числі очищення ресурсів та скидання змінних | [Умова завершення](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Банківський додаток](./7-bank-project/solution/README.md) | HTML-шаблони та маршрути у веб-додатку | Навчитися створювати каркас мультисторінкового вебсайту за допомогою маршрутизації та HTML-шаблонів | [HTML-шаблони і маршрути](./7-bank-project/1-template-route/README.md) | Yohan | | 21 | [Banking App](./7-bank-project/solution/README.md) | HTML-шаблони та маршрути в вебдодатку | Вивчити створення каркасу мультисторінкового сайту, використання маршрутизації та HTML-шаблонів | [HTML-шаблони і маршрути](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Банківський додаток](./7-bank-project/solution/README.md) | Створення форми входу та реєстрації | Дізнатися про створення форм та обробку валідації | [Форми](./7-bank-project/2-forms/README.md) | Yohan | | 22 | [Banking App](./7-bank-project/solution/README.md) | Створення форм для входу та реєстрації | Вивчити створення форм та обробку перевірок | [Форми](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Банківський додаток](./7-bank-project/solution/README.md) | Методи отримання та використання даних | Як дані потрапляють у додаток, як їх отримувати, зберігати та звільняти | [Дані](./7-bank-project/3-data/README.md) | Yohan | | 23 | [Banking App](./7-bank-project/solution/README.md) | Методи отримання та використання даних | Розуміння потоків даних у додатку, їх отримання, збереження та видалення | [Дані](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Банківський додаток](./7-bank-project/solution/README.md) | Концепції управління станом | Навчитися зберігати стан додатку та керувати ним програмно | [Управління станом](./7-bank-project/4-state-management/README.md) | Yohan | | 24 | [Banking App](./7-bank-project/solution/README.md) | Концепції керування станом | Вивчити, як додаток зберігає стан і як ним керувати програмно | [Керування станом](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Код браузера/VScode](../../8-code-editor) | Робота з VScode | Навчитися користуватись редактором коду | [Використання редактора коду VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 25 | [Browser/VScode Code](../../8-code-editor) | Робота з VScode | Навчитися використовувати редактор коду | [Використання редактора VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Асистенти](./9-chat-project/README.md) | Робота з AI | Навчитися створювати власного AI асистента | [Проєкт AI Асистента](./9-chat-project/README.md) | Chris | | 26 | [AI Assistants](./9-chat-project/README.md) | Робота з AI | Навчитися створювати власного AI-асистента | [Проєкт AI асистента](./9-chat-project/README.md) | Chris |
## 🏫 Педагогіка ## 🏫 Педагогіка
Наша навчальна програма розроблена на основі двох ключових педагогічних принципів: Наша навчальна програма розроблена з дотриманням двох ключових педагогічних принципів:
* навчання на основі проєктів * навчання на основі проєктів
* часті тести * часті вікторини
Програма викладає основи JavaScript, HTML та CSS, а також найновіші інструменти та методики, які використовують сучасні веб-розробники. Студенти матимуть можливість отримати практичний досвід, створюючи гру на друкування, віртуальний тераріум, екологічно чисте розширення браузера, гру на зразок Space Invaders і банківський додаток для бізнесу. Наприкінці серії студенти здобудуть міцне розуміння веб-розробки. Програма навчає основам JavaScript, HTML та CSS, а також сучасним інструментам і методам, які застосовують сьогодні веб-розробники. Студенти матимуть можливість отримати практичний досвід, створюючи гру для набору тексту, віртуальний терраріум, екологічне розширення браузера, гру у стилі space-invader і банківський додаток для бізнесу. Наприкінці серії учні отримають ґрунтовні знання з веб-розробки.
> 🎓 Ви можете пройти перші кілька уроків цієї навчальної програми як [Навчальний шлях](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) на Microsoft Learn! > 🎓 Ви можете пройти перші кілька уроків цієї навчальної програми як [шлях навчання](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) на Microsoft Learn!
Забезпечуючи, щоб контент узгоджувався з проєктами, ми робимо процес більш захоплюючим для студентів та покращуємо засвоєння концепцій. Ми також підготували кілька вступних уроків основ JavaScript із відео з колекції "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", автори якої деякі брали участь у створенні цієї навчальної програми. Забезпечуючи відповідність контенту проєктам, процес навчання стає більш захопливим, а засвоєння концепцій покращується. Ми також створили кілька початкових уроків з основ JavaScript, щоб представити концепції, підкріплених відео з колекції "[Серія для початківців: 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)". Хоч ми цілеспрямовано уникали введення фреймворків JavaScript, щоб зосередитись на базових навичках веб-розробника перед впровадженням фреймворку, хорошим наступним кроком після цієї програми буде вивчення Node.js за допомогою іншої колекції відео: "[Серія для початківців: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Відвідайте наші рекомендації [Кодекс поведінки](CODE_OF_CONDUCT.md) та [Участь](CONTRIBUTING.md). Ми вітаємо ваші конструктивні відгуки! > Відвідайте наші правила [Code of Conduct](CODE_OF_CONDUCT.md) та [Contributing](CONTRIBUTING.md). Ми радо приймаємо ваші конструктивні відгуки!
## 🧭 Офлайн-доступ ## 🧭 Офлайн-доступ
Ви можете користуватися цією документацією офлайн, використовуючи [Docsify](https://docsify.js.org/#/). Форкніть цей репозиторій, [встановіть Docsify](https://docsify.js.org/#/quickstart) на свій локальний комп’ютер, а потім у кореневій папці цього репозиторію введіть `docsify serve`. Вебсайт буде доступний на порту 3000 вашого локального хоста: `localhost:3000`. Ви можете переглядати цю документацію офлайн за допомогою [Docsify](https://docsify.js.org/#/). Форкніть цей репозиторій, [встановіть Docsify](https://docsify.js.org/#/quickstart) на свій локальний комп’ютер, а потім у кореневій папці репозиторію введіть `docsify serve`. Вебсайт буде запущений на порту 3000 локального хоста: `localhost:3000`.
## 📘 PDF ## 📘 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 ### LangChain
[![LangChain4j для початківців](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners)
[![LangChain.js для початківців](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[![LangChain для початківців](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) [![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
--- ---
### Azure / Edge / MCP / Агенти ### Azure / Edge / MCP / 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)
[![Edge AI для початківців](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[![MCP для початківців](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[![AI Агенти для початківців](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)
--- ---
### Серія Generative AI ### Серія про генеративний ШІ
[![Generative 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)
[![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)
[![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) [![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)
@ -241,39 +241,39 @@ PDF-файл з усіма уроками можна знайти [тут](https
--- ---
### Основні курси ### Основні курси
[![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)
[![Data Science для початківців](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)
[![Web Dev для початківців](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 Development для початківців](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 ### Серія про Copilot
[![Copilot для AI парного програмування](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[![Copilot для C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[![Пригоди Copilot](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
<!-- CO-OP TRANSLATOR OTHER COURSES END --> <!-- CO-OP TRANSLATOR OTHER COURSES END -->
## Отримання допомоги ## Отримання допомоги
Якщо ви застрягли або маєте запитання щодо створення 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 -->
**Відмова від відповідальності**: **Відмова від відповідальності**:
Цей документ було перекладено за допомогою сервісу автоматичного перекладу [Co-op Translator](https://github.com/Azure/co-op-translator). Хоча ми прагнемо до точності, зверніть увагу, що автоматичні переклади можуть містити помилки або неточності. Оригінальний документ рідною мовою слід вважати авторитетним джерелом. Для критично важливої інформації рекомендується професійний переклад людиною. Ми не несемо відповідальності за будь-які непорозуміння або неправильні тлумачення, що виникли внаслідок використання цього перекладу. Цей документ було перекладено за допомогою сервісу автоматичного перекладу [Co-op Translator](https://github.com/Azure/co-op-translator). Незважаючи на наші зусилля забезпечити точність, будь ласка, враховуйте, що автоматичні переклади можуть містити помилки або неточності. Оригінальний документ його рідною мовою вважається авторитетним джерелом. Для критичної інформації рекомендується професійний переклад людиною. Ми не несемо відповідальності за будь-які непорозуміння або неправильні тлумачення, що виникають внаслідок використання цього перекладу.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->
Loading…
Cancel
Save