Ini adalah repositori kurikulum pendidikan untuk mengajar asas pembangunan web kepada pemula. Kurikulum ini adalah kursus komprehensif selama 12 minggu yang dibangunkan oleh Microsoft Cloud Advocates, menampilkan 24 pelajaran praktikal yang merangkumi JavaScript, CSS, dan HTML.
Ini adalah repositori kurikulum pendidikan untuk mengajar asas-asas pembangunan web kepada pemula. Kurikulum ini adalah kursus komprehensif selama 12 minggu yang dibangunkan oleh Microsoft Cloud Advocates, menampilkan 24 pelajaran praktikal yang merangkumi JavaScript, CSS, dan HTML.
### Komponen Utama
- **Kandungan Pendidikan**: 24 pelajaran berstruktur yang disusun dalam modul berasaskan projek
- **Projek Praktikal**: Terrarium, Permainan Mengetik, Sambungan Pelayar, Permainan Angkasa, Aplikasi Perbankan, Penyunting Kod, dan Pembantu Sembang AI
- **Kuiz Interaktif**: 48 kuiz dengan 3 soalan setiap satu (penilaian sebelum/selepas pelajaran)
- **Sokongan Pelbagai Bahasa**: Terjemahan automatik ke 50+ bahasa melalui GitHub Actions
- **Kandungan Pendidikan**: 24 pelajaran berstruktur yang diatur ke dalam modul berasaskan projek
- **Projek Praktikal**: Terrarium, Permainan Mengetik, Pelanjutan Penyemak Imbas, Permainan Angkasa, Aplikasi Perbankan, Penyunting Kod, dan Pembantu Chat AI
- **Kuiz Interaktif**: 48 kuiz dengan 3 soalan setiap satu (penilaian sebelum/selepas pelajaran)
- **Sokongan Pelbagai Bahasa**: Terjemahan automatik untuk lebih 50+ bahasa melalui GitHub Actions
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) disyorkan untuk pelajar
- Kursus tambahan: AI Generatif, Sains Data, ML, kurikulum IoT tersedia
### Bekerja dengan Projek Tertentu
### Bekerja dengan Projek Spesifik
Untuk arahan terperinci projek individu, rujuk fail README dalam:
- `quiz-app/README.md` - aplikasi kuiz Vue 3
- `7-bank-project/README.md` - aplikasi perbankan dengan pengesahan
- `5-browser-extension/README.md` - pembangunan sambungan pelayar
- `6-space-game/README.md` - pembangunan permainan berasaskan canvas
- `9-chat-project/README.md` - projek pembantu sembang AI
Untuk arahan terperinci tentang projek individu, rujuk fail README di:
- `quiz-app/README.md` - aplikasi kuiz Vue 3
- `7-bank-project/README.md` - aplikasi perbankan dengan pengesahan
- `5-browser-extension/README.md` - pembangunan pelanjutan penyemak imbas
- `6-space-game/README.md` - pembangunan permainan berasaskan canvas
- `9-chat-project/README.md` - projek pembantu chat AI
### Struktur Monorepo
Walaupun bukan monorepo tradisional, repositori ini mengandungi pelbagai projek bebas:
- Setiap pelajaran berdiri sendiri
- Projek tidak berkongsi pergantungan
- Bekerja pada projek individu tanpa mempengaruhi yang lain
- Clone keseluruhan repo untuk pengalaman kurikulum penuh
Walaupun bukan monorepo tradisional, repositori ini mengandungi pelbagai projek bebas:
- Setiap pelajaran berdiri sendiri
- Projek tidak berkongsi kebergantungan
- Bekerja pada projek individu tanpa menjejaskan projek lain
- Clone helaian repo untuk pengalaman kurikulum penuh
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Penafian**:
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI [Co-op Translator](https://github.com/Azure/co-op-translator). Walaupun kami berusaha untuk mencapai ketepatan, sila ambil maklum bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya hendaklah dianggap sebagai sumber yang sahih. Untuk maklumat yang kritikal, terjemahan profesional oleh manusia adalah disyorkan. Kami tidak bertanggungjawab terhadap sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI [Co-op Translator](https://github.com/Azure/co-op-translator). Walaupun kami berusaha untuk memastikan ketepatan, sila sedar bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidakakuratan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang sahih. Untuk maklumat penting, terjemahan profesional oleh manusia disyorkan. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.
Hii ni hifadhi ya mtaala wa elimu kwa ajili ya kufundisha misingi ya maendeleo ya wavuti kwa wanaoanza. Mtaala ni kozi kamili ya wiki 12 iliyotengenezwa na Microsoft Cloud Advocates, ukiwa na masomo 24 ya vitendo yanayohusu JavaScript, CSS, na HTML.
Hii ni hifadhi ya mtaala wa kielimu kwa ajili ya kufundisha misingi ya maendeleo ya wavuti kwa wanaoanza. Mtaala ni kozi kamili ya wiki 12 iliyoandaliwa na Microsoft Cloud Advocates, ikiwa na masomo 24 ya mazoezi juu ya JavaScript, CSS, na HTML.
### Vipengele Muhimu
- **Maudhui ya Elimu**: Masomo 24 yaliyopangwa katika moduli za mradi
- **Miradi ya Vitendo**: Terrarium, Mchezo wa Kuandika, Kiendelezi cha Kivinjari, Mchezo wa Anga, Programu ya Benki, Mhariri wa Msimbo, na Msaidizi wa Mazungumzo wa AI
- **Vikwazo vya Interakti**: Vikwazo 48 vyenye maswali 3 kila kimoja (tathmini kabla/baada ya somo)
- **Msaada wa Lugha Nyingi**: Tafsiri za moja kwa moja kwa lugha 50+ kupitia GitHub Actions
- **Mada za Elimu**: Masomo 24 yaliyopangwa kwa muundo wa moduli za mradi
- **Miradi ya Vitendo**: Terrarium, Mchezo wa Kuandika, Kiendelezi cha Kivinjari, Mchezo wa Anga, Programu ya Benki, Mhariri wa Msimbo, na Msaidizi wa AI wa Mazungumzo
- **Maswali ya Maingiliano**: Maswali 48 yenye maswali 3 kila moja (tathmini kabla/baada ya somo)
- **Msaada wa Lugha Mbalimbali**: Tafsiri za moja kwa moja za lugha zaidi ya 50 kupitia GitHub Actions
- Tumia VS Code na ugani wa Live Server kwa miradi ya HTML
- Sakinisha ugani wa ESLint na Prettier kwa ulinganifu wa mtindo
- Tumia zana za msanidi wa kivinjari kwa utatuzi wa JavaScript
- Kwa miradi ya Vue, sakinisha ugani wa Vue DevTools kwa kivinjari
- Tumia VS Code na nyongeza ya Live Server kwa miradi ya HTML
- Sakinisha nyongeza za ESLint na Prettier kwa upangaji thabiti
- Tumia DevTools za kivinjari kwa uardishaji wa JavaScript
- Kwa miradi ya Vue, sakinisha nyongeza ya Vue DevTools kwa kivinjari
### Masuala ya Utendaji
### Mambo ya Kuzingatia Utendaji
- Idadi kubwa ya faili za tafsiri (lugha 50+) inafanya nakala kamili kukubwa
- Tumia nakala ya mfinyanzi ikiwa unafanya kazi tu na maudhui: `git clone --depth 1`
- Tenga tafsiri katika utafutaji unapoendelea na maudhui ya Kiingereza
- Michakato ya ujenzi inaweza kuwa polepole kwa mzunguko wa kwanza (`npm install`, Vite build)
- Idadi kubwa ya faili za tafsiri (lugha 50+) hufanya nakala kamili kuwa kubwa
- Tumia nakala nyepesi ikiwa unafanya kazi kwenye maudhui pekee: `git clone --depth 1`
- Tenga tafsiri kutoka kwenye utafutaji ukiwa unafanya kazi na maudhui ya Kiingereza
- Mchakato wa ujenzi unaweza kuwa polepole mara ya kwanza (npm install, Vite build)
## Masuala ya Usalama
## Mambo ya Usalama
### Mabadiliko ya Mazingira
### Mazingira ya Mabadiliko ya Mazingira (Environment Variables)
- Funguo za API hazipaswi kuwekwa kwenye hifadhi
- Tumia faili za `.env` (zimedumuwa katika`.gitignore`)
- Andika mabadiliko ya mazingira yanayohitajika katika README za miradi
- Tumia faili za `.env` (zipo tayari kwenye`.gitignore`)
- Elezea mabadiliko yanayohitajika ya mazingira katika README za miradi
### Miradi ya Python
- Tumia mazingira ya virtual: `python -m venv venv`
- Dumuza utegemezi kwa toleo jipya
- Tokeni za GitHub ziwe na ruhusa ndogo zinazohitajika
- Tumia mazingira pepepe (virtual environments): `python -m venv venv`
- Hifadhi tegemezi zikiwa zimeboreshwa
- Tokeni za GitHub zinapaswa kuwa na ruhusa chache zinazohitajika
### Upatikanaji wa GitHub Models
### Ufikiaji wa Modeli za GitHub
- Tokeni za Utafutaji wa Kibinafsi (PAT) zinahitajika kwa GitHub Models
- Tokeni zipangwe kama mabadiliko ya mazingira
- Kamwe usiweke tokeni au taarifa za siri kwenye hifadhi
- Haja Tokeni za Ufikiaji wa Kibinafsi (PAT) kwa Modeli za GitHub
- Tokeni zihifadhiwe kama mabadiliko ya mazingira
- Tokeni au nywila zisizowekwa kwenye hifadhi
## Vidokezo Zaidi
### Walengwa
### Walengwa wa Mtaala
- Wanaoanza kabisa katika maendeleo ya wavuti
- Wanafunzi na waajiri binafsi
- Wanaoanza kabisa kwenye maendeleo ya wavuti
- Wanafunzi na wanaojifunza binafsi
- Walimu wanaotumia mtaala darasani
- Maudhui yameundwa kwa upatikanaji na ujenzi wa ujuzi hatua kwa hatua
- Maudhui yameundwa kwa upatikanaji na ujenzi wa ujuzi kwa hatua
### Falsafa ya Elimu
- Mbinu ya kujifunza kwa miradi
- Kupimwa mara kwa mara (vikwazo)
- Mazoezi ya kuandika msimbo kwa vitendo
- Mifano ya matumizi halisi
- Mtazamo wa misingi kabla ya mifumo ya kazi
- Vipimo vya mara kwa mara vya maarifa (maswali)
- Mazoezi ya vitendo ya uandishi wa msimbo
- Mifano halisi ya matumizi duniani
- Lengo ni misingi kabla ya mifumo
### Utunzaji wa Hifadhi
### Matunzo ya Hifadhi
- Jamii yenye uhai ya wanafunzi na wachangiaji
- Sasisho la mara kwa mara la utegemezi na maudhui
- Masuala na mijadala inaangaliwa na waendelezaji
- Sasisho la tafsiri hutekelezwa moja kwa moja kupitia GitHub Actions
- Jamii yenye shughuli ya wanafunzi na wachangiaji
- Sasisho za mara kwa mara za tegemezi na maudhui
- Masuala na mijadala hufuatiliwa na waendelezaji
- Sasisho za tafsiri zinasasishwa kiotomatiki kwa GitHub Actions
### Rasilimali Zinazohusiana
- [Moduli za Microsoft Learn](https://docs.microsoft.com/learn/)
- [Rasilimali za Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) inapendekezwa kwa wanafunzi
- Kozi za ziada: AI ya kuzalisha, Sayansi ya Data, ML, mtaala wa IoT unapatikana
- Kozi za ziada: AI ya kizazi, Sayansi ya Takwimu, ML, masomo ya IoT yanapatikana
### Kufanya Kazi na Miradi Maalumu
### Kazi na Miradi Maalum
Kwa maelekezo ya kina kuhusu miradi, rejea faili za README katika:
- `quiz-app/README.md` - Programu ya quiz ya Vue 3
- `7-bank-project/README.md` - Programu ya benki yenye uthibitishaji
- `5-browser-extension/README.md` - Maendeleo ya kiendelezi cha kivinjari
- `6-space-game/README.md` - Maendeleo ya mchezo wa Canvas
- `9-chat-project/README.md` - Mradi wa msaidizi wa mazungumzo wa AI
Kwa maelekezo ya kina ya miradi binafsi, rejea faili za README katika:
- `quiz-app/README.md` - programu ya quiz ya Vue 3
- `7-bank-project/README.md` - programu ya benki yenye uthibitisho
- `5-browser-extension/README.md` - maendeleo ya kiendelezi cha kivinjari
- `6-space-game/README.md` - maendeleo ya mchezo wa canvas
- `9-chat-project/README.md` - mradi wa msaidizi wa mazungumzo AI
### Muundo wa Monorepo
Ingawa sio monorepo ya kawaida, hifadhi hii ina miradi mingi huru:
- Kila somo ni huru
- Miradi haishiriki utegemezi
Ingawa si monorepo ya kawaida, hifadhi hii ina miradi mingi huru:
- Kila somo ni huru na lina muundo wake
- Miradi haigawani tegemezi
- Fanya kazi kwenye miradi binafsi bila kuathiri mingine
- Nakili hifadhi yote kwa uzoefu kamili wa mtaala
- Nakili hifadhi nzima kwa uzoefu kamili wa mtaala
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Kiatli**:
Nyaraka hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ingawa tunajitahidi kwa usahihi, tafadhali fahamu kuwa tafsiri za kiotomatiki zinaweza kuwa na makosa au upungufu wa usahihi. Nyaraka ya asili katika lugha yake ya asili inapaswa kuchukuliwa kama chanzo cha mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu inayofanywa na watu inashauriwa. Hatubebwi wajibu kwa kutoelewana au tafsiri potofu zinazotokana na matumizi ya tafsiri hii.
**Taarifa ya Kutojibika**:
Hati hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ingawa tunajitahidi kuwa sahihi, tafadhali fahamu kwamba tafsiri za kiotomatiki zinaweza kuwa na makosa au upotoshaji. Hati ya asili katika lugha yake ya asili inapaswa kuzingatiwa kama chanzo cha kuaminika. Kwa taarifa muhimu, tafsiri ya mtaalamu wa lugha inashauriwa. Hatubebwi na dhamana kwa maelewano au tafsiri potofu zinazotokana na matumizi ya tafsiri hii.
Ito ay isang edukasyonal na kurikulum na repository para sa pagtuturo ng mga pundasyon ng web development sa mga nagsisimula. Ang kurikulum ay isang komprehensibong 12-linggong kurso na binuo ng Microsoft Cloud Advocates, naglalaman ng 24 na praktikal na aralin na sumasaklaw sa JavaScript, CSS, at HTML.
Ito ay isang repositoryo ng pang-edukasyon na kurikulum para sa pagtuturo ng mga pangunahing kaalaman sa web development sa mga nagsisimula. Ang kurikulum ay isang komprehensibong 12-linggong kurso na binuo ng Microsoft Cloud Advocates, na nagtatampok ng 24 na praktikal na aralin na sumasaklaw sa JavaScript, CSS, at HTML.
### Key Components
- **Educational Content**: 24 na organisadong aralin na inayos sa mga project-based na modules
- **Educational Content**: 24 na nakaayos na mga aralin na naka-organisa sa mga module na batay sa proyekto
- **Practical Projects**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, at AI Chat Assistant
- **Interactive Quizzes**: 48 na pagsusulit na may tig-3 tanong bawat isa (pre/post-lesson assessments)
- **Interactive Quizzes**: 48 na mga pagsusulit na may tig-3 tanong bawat isa (pagsusulit bago/pagkatapos ng aralin)
- **Multi-language Support**: Awtomatikong pagsasalin para sa 50+ na mga wika gamit ang GitHub Actions
- **Technologies**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (para sa mga AI projects)
- **Technologies**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (para sa mga proyekto ng AI)
### Architecture
- Educational repository na may leksyon na nakaayos ayon sa aralin
- Educational na repositoryo na may istruktura batay sa mga aralin
- Bawat folder ng aralin ay naglalaman ng README, mga halimbawa ng code, at mga solusyon
- Mga standalone na proyekto sa hiwalay na mga direktoryo (quiz-app, iba't ibang mga proyekto ng aralin)
- Sistema ng pagsasalin gamit ang GitHub Actions (co-op-translator)
- Dokumentasyon na isinusilbi gamit ang Docsify at available bilang PDF
- Systema ng pagsasalin gamit ang GitHub Actions (co-op-translator)
- Dokumentasyon na pinagsisilbihan gamit ang Docsify at available bilang PDF
## Setup Commands
Ang repository na ito ay pangunahing para sa pag-consume ng edukasyonal na nilalaman. Para sa pagtatrabaho sa mga partikular na proyekto:
Ang repositoryong ito ay pangunahing para sa paggamit ng nilalamang pang-edukasyon. Para magtrabaho sa mga tiyak na proyekto:
### Main Repository Setup
@ -37,7 +37,7 @@ cd Web-Dev-For-Beginners
cd quiz-app
npm install
npm run dev # Simulan ang development server
npm run build # Gumawa para sa production
npm run build # I-build para sa produksyon
npm run lint # Patakbuhin ang ESLint
```
@ -56,7 +56,7 @@ npm run format # I-format gamit ang Prettier
```bash
cd 5-browser-extension/solution
npm install
# Sundin ang mga tagubilin sa pag-load ng extension na partikular sa browser
# Sundin ang mga tagubilin sa pag-load ng extension na tukoy sa browser
```
### Space Game Projects
@ -80,29 +80,29 @@ python api.py
### For Content Contributors
1. **I-fork ang repository** sa iyong GitHub account
2. **I-clone ang iyong fork**lokál
3. **Gumawa ng bagong sangay (branch)** para sa iyong mga pagbabago
4. Gawin ang mga pagbabago sa nilalaman ng aralin o mga halimbawa ng code
5. Subukan ang anumang pagbabago sa code sa mga angkop na direktoryo ng proyekto
6. Mag-submit ng pull requests ayon sa mga gabay sa kontribusyon
1. **I-fork ang repositoryo** sa iyong GitHub account
2. **I-clone ang iyong fork**nang lokal
3. **Gumawa ng bagong branch** para sa iyong mga pagbabago
4. Gumawa ng mga pagbabago sa nilalaman ng aralin o mga halimbawa ng code
5. Subukan ang anumang mga pagbabago sa code sa mga kaugnay na direktoryo ng proyekto
6. Mag-submit ng pull request ayon sa mga alituntunin ng kontribusyon
### For Learners
1. I-fork o i-clone ang repository
2. Mag-navigate sa mga direktoryo ng aralin nang sunod-sunod
3. Basahin ang mga file na README para sa bawat aralin
4. Tapusin ang mga pre-lesson na pagsusulit sa https://ff-quizzes.netlify.app/web/
5. Gawin ang mga halimbawa ng code sa mga folder ng aralin
6. Tapusin ang mga asignatura at hamon
7. Sagutan ang mga post-lesson na pagsusulit
1. I-fork o i-clone ang repositoryo
2. Pumunta sa mga direktoryo ng aralin nang sunud-sunod
3. Basahin ang mga README file para sa bawat aralin
4. Kumpletuhin ang pre-lesson quizzes sa https://ff-quizzes.netlify.app/web/
5. Trabahuhin ang mga halimbawa ng code sa mga folder ng aralin
6. Kumpletuhin ang mga assignment at hamon
7. Kunin ang post-lesson quizzes
### Live Development
- **Dokumentasyon**: Patakbuhin ang `docsify serve` sa root (port 3000)
- **Documentation**: Patakbuhin ang `docsify serve` sa root (port 3000)
- **Quiz App**: Patakbuhin ang `npm run dev` sa direktoryo ng quiz-app
- **Mga Proyekto**: Gamitin ang VS Code Live Server extension para sa mga HTML na proyekto
- **API Projects**: Patakbuhin ang `npm start` sa kaukulang mga direktoryo ng API
- **Projects**: Gamitin ang VS Code Live Server extension para sa mga HTML na proyekto
- **API Projects**: Patakbuhin ang `npm start` sa kani-kanilang mga direktoryo ng API
## Testing Instructions
@ -110,7 +110,7 @@ python api.py
```bash
cd quiz-app
npm run lint # Suriin ang mga isyu sa estilo ng code
npm run lint # Suriin ang mga isyu sa istilo ng code
npm run build # Tiyakin na matagumpay ang build
```
@ -124,57 +124,57 @@ node server.js # Tiyakin na nagsisimula ang server nang walang mga error
### General Testing Approach
- Ito ay isang edukasyonal na repository na walang komprehensibong automated tests
- Manual testing ay nakatuon sa:
- Mga halimbawa ng code ay tumatakbo nang walang error
- Mga link sa dokumentasyon ay gumagana nang tama
- Ang mga build ng proyekto ay matagumpay na nakumpleto
- Mga halimbawa ay sumusunod sa pinakamahusay na mga gawain
- Ito ay isang pang-edukasyon na repositoryo na walang komprehensibong automated tests
- Manual na pagsubok ay nakatuon sa:
- Mga halimbawa ng code na tumatakbo nang walang error
- Mga link sa dokumentasyon na gumagana nang tama
- Matagumpay na pagtatayo ng proyekto
- Mga halimbawa ay sumusunod sa mga pinakamahusay na gawain
### Pre-submission Checks
- Patakbuhin ang `npm run lint` sa mga direktoryo na may package.json
- Siguraduhing wasto ang mga markdown na link
- Patakbuhin ang `npm run lint` sa mga direktoryong may package.json
- Siguraduhing valid ang mga markdown link
- Subukan ang mga halimbawa ng code sa browser o Node.js
- Tingnan na ang mga pagsasalin ay nananatili ang tamang estruktura
- Suriin na ang mga pagsasalin ay nananatili ang wastong istruktura
## Code Style Guidelines
### JavaScript
- Gumamit ng modernong ES6+ na syntax
- Sundin ang pamantayang ESLint configurations na ibinigay sa mga proyekto
- Gumamit ng makabuluhang mga variable at pangalan ng function para sa kalinawan ng edukasyon
- Gamitin ang makabagong ES6+ na syntax
- Sundin ang karaniwang ESLint na mga configuration na ibinigay sa mga proyekto
- Gumamit ng makahulugang mga pangalan ng variable at function para sa kalinawan sa pag-aaral
- Magdagdag ng mga komento na nagpapaliwanag ng mga konsepto para sa mga nag-aaral
- I-format gamit ang Prettier kung ito ay naka-configure
- I-format gamit ang Prettier kung saan naka-configure
### HTML/CSS
- Semantic na mga elemento ng HTML5
- Mga prinsipyo ng responsive design
- Malinaw na mga klaseng pangalan
- Malinaw na mga konbensiyon sa pagpapangalan ng klase
- Mga komento na nagpapaliwanag ng mga teknik sa CSS para sa mga nag-aaral
### Python
- Pamantayan ng estilo ng PEP 8
- Malilinaw, edukasyonal na mga halimbawa ng code
- Mga type hint kung nakatutulong sa pag-aaral
- Mga gabay sa istilo ng PEP 8
- Malinaw, pang-edukasyong mga halimbawa ng code
- Mga type hint kung nakakatulong sa pag-aaral
### Markdown Documentation
- Malinaw na hierarchy ng mga heading
- Code blocks na may pagtukoy ng wika
- Mga code block na may pagtukoy sa wika
- Mga link sa karagdagang mga mapagkukunan
- Mga screenshot at larawan sa `images/` na mga direktoryo
- Alt text para sa mga larawan para sa accessibility
### File Organization
- Mga aralin na naka-number nang sunud-sunod (1-getting-started-lessons, 2-js-basics, atbp.)
- Bawat proyekto ay may `solution/` at madalas ay`start/` o `your-work/` na mga direktoryo
- Mga larawan ay nakaimbak sa mga folder ng `images/` na para sa partikular na aralin
- Mga pagsasalin ay nasa estrukturang`translations/{language-code}/`
- Mga aralin na naka-numero nang sunud-sunod (1-getting-started-lessons, 2-js-basics, atbp.)
- Bawat proyekto ay may `solution/` at kadalasang`start/` o `your-work/` na mga direktoryo
- Mga larawan na naka-imbak sa lesson-specific na `images/` na mga folder
- Mga pagsasalin sa istruktura na`translations/{language-code}/`
## Build and Deployment
@ -184,7 +184,7 @@ Ang quiz-app ay naka-configure para sa Azure Static Web Apps deployment:
```bash
cd quiz-app
npm run build # Gumagawa ng dist/ na folder
npm run build # Lumilikha ng folder na dist/
# Nagde-deploy gamit ang GitHub Actions workflow kapag may push sa main
```
@ -197,31 +197,31 @@ Azure Static Web Apps configuration:
```bash
npm install # I-install ang docsify-to-pdf
npm run convert # Bumuo ng PDF mula sa docs
npm run convert # Gumawa ng PDF mula sa docs
```
### Docsify Documentation
```bash
npm install -g docsify-cli # I-install ang Docsify nang global
npm install -g docsify-cli # I-install ang Docsify nang globally
docsify serve # I-serve sa localhost:3000
```
### Project-specific Builds
Bawat direktoryo ng proyekto ay maaaring may sariling proseso ng build:
- Vue projects: `npm run build` na lumilikha ng production bundles
- Static projects: Walang build step, direktang pagseserbisyo ng mga file
Bawat direktoryo ng proyekto ay maaaring magkaroon ng sariling proseso ng build:
- Mga proyekto ng Vue: `npm run build` na lumilikha ng production bundles
- Mga static na proyekto: Walang build step, direktang pinagsisilbihan ang mga file
## Pull Request Guidelines
### Title Format
Gumamit ng malinaw, naglalarawang mga titulo na nagpapahiwatig ng lugar ng pagbabago:
- `[Quiz-app] Add new quiz for lesson X`
- `[Lesson-3] Fix typo in terrarium project`
- `[Translation] Add Spanish translation for lesson 5`
- `[Docs] Update setup instructions`
Gumamit ng malinaw, deskriptibong mga pamagat na nagpapahiwatig ng bahagi ng pagbabago:
- `[Quiz-app] Magdagdag ng bagong quiz para sa lesson X`
- `[Lesson-3] Ayusin ang typo sa terrarium project`
- `[Translation] Magdagdag ng pagsasalin sa Espanyol para sa lesson 5`
- `[Docs] I-update ang mga tagubilin sa setup`
### Required Checks
@ -229,54 +229,54 @@ Bago magsumite ng PR:
1. **Kalidad ng Code**:
- Patakbuhin ang `npm run lint` sa mga apektadong direktoryo ng proyekto
- Ayusin lahat ng linting error at warning
- Ayusin lahat ng linting errors at warnings
2. **Build Verification**:
- Patakbuhin ang `npm run build` kung naaangkop
- Siguraduhing walang errorsa build
- Siguraduhing walang build errors
3. **Link Validation**:
- Subukan lahat ng markdown na mga link
- Siguraduhin na gumagana ang mga image reference
- Subukan ang lahat ng markdown links
- Siguraduhing gumagana ang mga reference ng imahe
4. **Review ng Nilalaman**:
- Proofread para sa baybay at gramatika
4. **Content Review**:
- Proofread para sa spelling at grammar
- Siguraduhing tama at pang-edukasyon ang mga halimbawa ng code
- I-verify na ang mga pagsasalin ay nananatili ang orihinal na kahulugan
- Suriin na nananatili ang orihinal na kahulugan ng mga pagsasalin
### Contribution Requirements
- Sumang-ayon sa Microsoft CLA (awtomatikong tseke sa unang PR)
- Sundin ang [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Tingnan ang [CONTRIBUTING.md](./CONTRIBUTING.md) para sa detalyadong gabay
- Banggitin ang mga numero ng isyu sa deskripsyon ng PR kung naaangkop
- Tingnan ang [CONTRIBUTING.md](./CONTRIBUTING.md) para sa mga detalyadong alituntunin
- Banggitin ang mga numero ng isyu sa paglalarawan ng PR kung naaangkop
### Review Process
- PRs ay sinusuri ng mga tagapag-maintain at community
- Ang mga PR ay nire-review ng mga tagapamahala at ng komunidad
- Prayoridad ang kalinawan sa edukasyon
- Dapat sundin ng mga halimbawa ng code ang kasalukuyang pinakamahusay na mga gawain
- Ang mga pagsasalin ay sinusuri para sa katumpakan at angkop na kultura
- Dapat sundin ng mga halimbawa ng code ang kasalukuyang pinakamahusay na gawain
- Ang mga pagsasalin ay nirereview para sa katumpakan at kultural na pagkakabagay
## Translation System
### Automated Translation
- Gumagamit ng GitHub Actions gamit ang co-op-translator workflow
- Nagsasalin sa 50+ na mga wika nang awtomatiko
- Mga source file sa pangunahing mga direktoryo
- Mga naisaling file sa `translations/{language-code}/` na mga direktoryo
- Ginagamit ang GitHub Actions kasama ang workflow na co-op-translator
- Awtomatikong nagsasalin sa 50+ na mga wika
- Mga source file sa mga pangunahing direktoryo
- Mga isinalin na file sa `translations/{language-code}/` na mga direktoryo
### Adding Manual Translation Improvements
1. Hanapin ang file sa `translations/{language-code}/`
2. Gawin ang mga pagpapabuti habang pinapanatili ang estruktura
3. Siguraduhin na ang mga halimbawa ng code ay nananatiling gumagana
4. Subukan ang anumang lokal na nilalaman ng pagsusulit
2. Gumawa ng mga pagpapabuti habang pinapanatili ang istruktura
3. Siguraduhingnananatiling gumagana ang mga halimbawa ng code
4. Subukan ang anumang lokal na contenido ng quiz
### Translation Metadata
Ang naisaling mga file ay may metadata header:
Ang mga isinaling file ay may kasamang metadata header:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -294,115 +294,115 @@ CO_OP_TRANSLATOR_METADATA:
### Common Issues
**Quiz app fails to start**:
- Suriin ang bersyon ng Node.js (v14+ ang rekomendado)
- Suriin ang bersyon ng Node.js (inirerekumenda ang v14+)
- Burahin ang `node_modules` at `package-lock.json`, patakbuhin muli ang `npm install`
- Suriin kung may conflict sa port (default: Vite ay gumagamit ng port 5173)
- Suriin ang conflicts sa port (default: Vite ay gumagamit ng port 5173)
**API server won't start**:
- Tiyaking ang bersyon ng Node.js ay sapat (node >=10)
- Tingnan kung ang port ay ginagamit na
- Siguraduhing na-install ang lahat ng dependencies gamit ang `npm install`
- Tiyakin na ang bersyon ng Node.js ay hindi bababa sa (node >=10)
- Suriin kung ang port ay ginagamit na
- Siguraduhing naka-install lahat ng dependencies gamit ang `npm install`
**Browser extension won't load**:
- Siguraduhing tama ang format ng manifest.json
- Tingnan ang console ng browser para sa mga error
- Sundin ang mga instruksiyon para sa pag-install ng browser-specific extension
- Siguraduhing maayos ang format ng manifest.json
- Suriin ang browser console para sa mga error
- Sundin ang mga tagubilin sa pag-install ng extension para sa partikular na browser
**Python chat project issues**:
- Siguraduhing naka-install ang OpenAI package: `pip install openai`
- Tiyaking naka-set ang GITHUB_TOKEN environment variable
- Suriin ang mga permiso sa GitHub Models access
- Tiyakin na nakaset ang GITHUB_TOKEN environment variable
- Suriin ang mga pahintulot para sa GitHub Models
**Docsify not serving docs**:
- Mag-install ng docsify-cli globally: `npm install -g docsify-cli`
- Patakbuhin mula sa root directory ng repository
- Siguraduhing nandiyan ang `docs/_sidebar.md`
- I-install ang docsify-cli globally: `npm install -g docsify-cli`
- Patakbuhin mula sa root directory ng repositoryo
- Suriin na ang `docs/_sidebar.md` ay umiiral
### Development Environment Tips
- Gamitin ang VS Code na may Live Server extension para sa mga HTML na proyekto
- Mag-install ng ESLint at Prettier extensions para sa consistent na pag-format
- Gamitin ang browser DevTools para mag-debug ng JavaScript
- Para sa Vue projects, mag-install ng Vue DevTools browser extension
- Mag-install ng ESLint at Prettier extensions para sa pare-parehong pag-format
- Gamitin ang browser DevTools para sa pag-debug ng JavaScript
- Para sa mga proyekto ng Vue, mag-install ng Vue DevTools browser extension
### Performance Considerations
- Maraming naisaling mga file (50+ na mga wika) kaya malaki ang full clones
- Gumamit ng shallow clone kung nilalaman lang ang pinagtatrabahuhan: `git clone --depth 1`
- Ang malaking bilang ng mga isinaling file (50+ wika) ay nangangahulugan ng malalaking full clones
- Gamitin ang shallow clone kung nilalaman lang ang tinatrabaho: `git clone --depth 1`
- I-exclude ang mga pagsasalin mula sa paghahanap kapag nagtatrabaho sa English na nilalaman
- Ang mga proseso ng build ay maaaring mabagal sa unang run (npm install, Vite build)
- Ang mga proseso sa build ay maaaring mabagal sa unang takbo (npm install, Vite build)
## Security Considerations
### Environment Variables
- Huwag kailanman i-commit ang API keys sa repository
- Gumamit ng `.env` files (naka-lista na sa `.gitignore`)
- I-dokumenta ang mga kinakailangang environment variables sa mga README ng proyekto
- Ang mga API key ay hindi dapat i-commit sa repositoryo
- Gamitin ang `.env` files (na naka-ignore na sa `.gitignore`)
- I-dokumento ang mga kailangang environment variables sa mga README ng proyekto
### Python Projects
- Gumamit ng virtual environments: `python -m venv venv`
- Panatilihing updated ang dependencies
- Ang mga GitHub token ay dapat may minimal na kinakailangang permiso
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) na inirerekomenda para sa mga nag-aaral
- Mga karagdagang kurso: Generative AI, Data Science, ML, IoT curricula ay available
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) inirerekomenda para sa mga nag-aaral
- Karagdagang mga kurso: Generative AI, Data Science, ML, IoT curricula available
### Working with Specific Projects
Para sa detalyadong mga instruksiyon sa mga indibidwal na proyekto, sumangguni sa mga README file sa:
Para sa detalyadong tagubilin sa mga indibidwal na proyekto, tingnan ang mga README files sa:
- `quiz-app/README.md` - Vue 3 quiz application
- `7-bank-project/README.md` - Banking application na may authentication
- `5-browser-extension/README.md` - Pag-develop ng browser extension
- `6-space-game/README.md` - Canvas-based na game development
- `6-space-game/README.md` - Canvas-based na pag-develop ng laro
- `9-chat-project/README.md` - AI chat assistant project
### Monorepo Structure
Bagamat hindi tradisyunal na monorepo, ang repository na ito ay naglalaman ng maraming independiyenteng mga proyekto:
- Bawat aralin ay sarado at kumpleto sa sarili
- Hindi nagbabahagi ng dependencies ang mga proyekto
- Maaaring magtrabaho sa mga indibidwal na proyekto nang hindi naaapektuhan ang iba
- I-clone ang buong repo para sa buong karanasan ng kurikulum
Bagamat hindi isang tradisyunal na monorepo, naglalaman ang repositoryong ito ng maraming independiyenteng proyekto:
- Bawat aralin ay self-contained
- Hindi nagbabahagi ng mga dependency ang mga proyekto
- Maaaring magtrabaho sa mga indibidwal na proyekto nang hindi naaapektuhan ang iba pa
- I-clone ang buong repo para sa buong kurikulum na karanasan
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Paalala**:
Ang dokumentong ito ay isinalin gamit ang AI translation service na [Co-op Translator](https://github.com/Azure/co-op-translator). Bagamat aming pinagsisikapan ang katumpakan, pakatandaan na ang mga awtomatikong pagsasalin ay maaaring maglaman ng mga pagkakamali o di-tumpak na impormasyon. Ang orihinal na dokumento sa orihinal nitong wika ang dapat ituring na pangunahing sanggunian. Para sa mahahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaunawaan o maling interpretasyon na maaaring magmula sa paggamit ng pagsasaling ito.
**Paunawa**:
Ang dokumentong ito ay isinalin gamit ang AI translation service na [Co-op Translator](https://github.com/Azure/co-op-translator). Bagama’t sinisikap naming maging tumpak, pakatandaan na ang mga awtomatikong pagsasalin ay maaaring may mga pagkakamali o di-katumpakan. Ang orihinal na dokumento sa orihinal nitong wika ang dapat ituring na opisyal na sanggunian. Para sa mahahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaintindihan o maling interpretasyon mula sa paggamit ng pagsasaling ito.
localizeflow[bot]
3 weeks ago