Jifunze misingi ya maendeleo ya wavuti kupitia kozi yetu kamili ya wiki 12 inayotolewa na Microsoft Cloud Advocates. Kila somo kati ya 24 linachunguza JavaScript, CSS, na HTML kupitia miradi ya vitendo kama vile terrariums, nyongeza za kivinjari, na michezo ya anga. Shirikiana na maswali ya mtihani, mijadala, na kazi za vitendo. Boresha ujuzi wako na uboresha kumbukumbu yako kwa kutumia mfumo wetu mzuri wa kujifunza unaotegemea miradi. Anza safari yako ya kuandika msimbo leo!
Jiunge na Jamii ya Azure AI Foundry kwenye Discord
Fuata hatua hizi kuanza kutumia rasilimali hizi:
- Fanya Nakala ya Hifadhi: Bonyeza
- Nakili Hifadhi:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git - Jiunge na Azure AI Foundry Discord na ukutane na wataalamu na watengenezaji wenzako
Arabic | Bengali | Bulgarian | Burmese (Myanmar) | Chinese (Simplified) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Macau) | Chinese (Traditional, Taiwan) | Croatian | Czech | Danish | Dutch | Estonian | Finnish | French | German | Greek | Hebrew | Hindi | Hungarian | Indonesian | Italian | Japanese | Kannada | Khmer | Korean | Lithuanian | Malay | Malayalam | Marathi | Nepali | Nigerian Pidgin | Norwegian | Persian (Farsi) | Polish | Portuguese (Brazil) | Portuguese (Portugal) | Punjabi (Gurmukhi) | Romanian | Russian | Serbian (Cyrillic) | Slovak | Slovenian | Spanish | Swahili | Swedish | Tagalog (Filipino) | Tamil | Telugu | Thai | Turkish | Ukrainian | Urdu | Vietnamese
Ungependa Kwenye Nakala Kwenye Kompyuta?
Hifadhi hii ina tafsiri za lugha 50+ ambazo huongeza sana ukubwa wa kupakua. Ili kukopa bila tafsiri, tumia sparse checkout:
Bash / macOS / Linux:
git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'CMD (Windows):
git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"Hii itakupa kila kitu unachohitaji kukamilisha kozi kwa usakinishaji wa haraka zaidi.
Ikiwa unataka lugha za ziada za tafsiri kuungwa mkono zimetajwa hapa
Tembelea ukurasa wa Kituo cha Wanafunzi ambapo utapata rasilimali za wanaoanza, vifurushi vya wanafunzi na hata njia za kupata vocha ya cheti bure. Huu ndio ukurasa unaotaka kuweka kama alama na kuangalia mara kwa mara tunapobadilisha maudhui kila mwezi.
Changamoto Mpya imeongezwa, tafuta "GitHub Copilot Agent Challenge 🚀" katika sura nyingi. Hiyo ni changamoto mpya kwako kukamilisha ukiwa unatumia GitHub Copilot na Mode ya Agent. Ikiwa hujawahi kutumia Mode ya Agent hapo awali, ina uwezo si tu wa kuandika maandishi bali pia kuunda na kuhariri mafaili, kuendesha amri na mengineyo.
Mradi mpya wa Msaidizi wa AI umeongezwa, angalia mradi
Usikose mtaala wetu mpya wa AI ya Kizazi!
Tembelea https://aka.ms/genai-js-course kuanza!
- Masomo yanayohusisha kila kitu tangu misingi hadi RAG.
- Shirikiana na wahusika wa kihistoria ukitumia GenAI na programu yetu ya mpenzi.
- Hadithi ya kufurahisha na kuvutia, utasafiri kwa wakati!
Kila somo linajumuisha kazi za kukamilisha, mtihani wa maarifa na changamoto ya kukuongoza kujifunza mada kama:
- Kutoa maagizo na uhandisi wa maagizo
- Kutengeneza programu za maandishi na picha
- Programu za utafutaji
Tembelea https://aka.ms/genai-js-course kuanza!
Walimu, tumetoa mapendekezo kadhaa juu ya jinsi ya kutumia mtaala huu. Tunapenda maoni yako katika jukwaa letu la majadiliano!
Wanafunzi, kwa kila somo, anza na mtihani kabla ya mihadhara na fuata kwa kusoma nyenzo za mihadhara, kukamilisha shughuli mbalimbali na hakikisha unaelewa kupitia mtihani baada ya mihadhara.
Ili kuboresha uzoefu wako wa kujifunza, ungana na wenzako kufanya miradi pamoja! Majadiliano yanahimizwa katika jukwaa letu la majadiliano ambapo timu yetu ya wasimamizi itakuwepo kujibu maswali yako.
Ili kuendeleza elimu yako, tunapendekeza sana kuchunguza Microsoft Learn kwa nyenzo zaidi za kusoma.
Mtaala huu una mazingira ya maendeleo tayari! Unapoanza unaweza kuchagua kuendesha mtaala katika Codespace (mazingira ya kivinjari, yasiyo na usakinishaji yanayohitajika), au eneo la karibu kwenye kompyuta yako ukitumia mhariri wa maandishi kama Visual Studio Code.
Ili iwe rahisi kuhifadhi kazi yako, inapendekezwa kutengeneza nakala yako mwenyewe ya hifadhi hii. Unaweza kufanya hivyo kwa kubonyeza kitufe cha Use this template juu ya ukurasa. Hii itatengeneza hifadhi mpya katika akaunti yako ya GitHub yenye nakala ya mtaala.
Fuata hatua hizi:
- Fanya Nakala ya Hifadhi: Bonyeza kitufe cha "Fork" upande wa juu-mwenye kulia wa ukurasa huu.
- Nakili Hifadhi:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Katika nakala yako ya hifadhi uliyotengeneza, bonyeza kitufe cha Code kisha chagua Open with Codespaces. Hii itatengeneza Codespace mpya utakaoweza kufanya kazi ndani yake.
Ili kuendesha mtaala huu eneo la karibu kwenye kompyuta yako, utahitaji mhariri wa maandishi, kivinjari na zana za mstari wa amri. Somo letu la kwanza, Utangulizi wa Lugha za Programu na Zana za Kazi, litakuongoza kupitia chaguzi mbalimbali za kila zana ili kuchagua kama inakufaa.
Pendekezo letu ni kutumia Visual Studio Code kama mhariri wako, ambao pia una Terminali iliyojengwa ndani. Unaweza kupakua Visual Studio Code hapa.
-
Nakili hazina yako kwenye kompyuta yako. Unaweza kufanya hivi kwa kubofya kitufe cha Code kisha kunakili URL:
Kisha, fungua Terminal ndani ya Visual Studio Code na endesha amri ifuatayo, ukibadilisha
<your-repository-url>na URL uliyoinakili hivi karibuni:git clone <your-repository-url>
-
Fungua folda katika Visual Studio Code. Unaweza kufanya hivi kwa kubofya File > Open Folder na kuchagua folda uliyoinakili hivi karibuni.
Virahisi vinavyopendekezwa vya Visual Studio Code:
- Live Server - kutazama mapokeo ya kurasa za HTML ndani ya Visual Studio Code
- Copilot - kusaidia kuandika msimbo haraka zaidi
- sketchnote hiari
- video ya ziada ya hiari
- zoezi la kuwajalia kabla ya somo
- somo lililoandikwa
- kwa masomo yanayotegemea miradi, miongozo ya hatua kwa hatua ya jinsi ya kujenga mradi
- ukaguzi wa maarifa
- changamoto
- usomaji wa ziada
- kazi ya nyumbani
- zoezi la baada ya somo
Kumbukumbu kuhusu mazoezi ya maswali: Mazoezi yote yapo katika folda ya Quiz-app, jumla ya mazoezi 48 yenye maswali matatu kila moja. Yapatikana hapa, programu ya mazoezi inaweza kuendeshwa kwa ndani au kutolewa Azure; fuata maelekezo katika folda
quiz-app.
| Jina la Mradi | Mada Zinazofundishwa | Malengo ya Kujifunza | Somo Lililohusishwa | Mwandishi | |
|---|---|---|---|---|---|
| 01 | Kuanzia | Utangulizi wa Programu na Vifaa vya Kazi | Jifunze misingi ya lugha nyingi za programu na kuhusu programu zinazosaidia waendelezaji wa kitaalamu kufanya kazi zao | Utangulizi wa Lugha za Programu na Vifaa vya Kazi | Jasmine |
| 02 | Kuanzia | Msingi wa GitHub, ikijumuisha kazi ya timu | Jinsi ya kutumia GitHub katika mradi wako, jinsi ya kushirikiana na wengine katika msimbo wa programu | Utangulizi wa GitHub | Floor |
| 03 | Kuanzia | Upatikanaji | Jifunze misingi ya upatikanaji wa wavuti | Misingi ya Upatikanaji | Christopher |
| 04 | Misingi ya JS | Aina za Data za JavaScript | Misingi ya aina za data za JavaScript | Aina za Data | Jasmine |
| 05 | Misingi ya JS | Kazi na Mbinu | Jifunze kuhusu kazi na mbinu za kusimamia mtiririko wa mantiki ya programu | Kazi na Mbinu | Jasmine na Christopher |
| 06 | Misingi ya JS | Kufanya Maamuzi na JS | Jifunze jinsi ya kuunda masharti katika msimbo wako kwa kutumia mbinu za kufanya maamuzi | Kufanya Maamuzi | Jasmine |
| 07 | Misingi ya JS | Array na Loops | Fanya kazi na data kwa kutumia array na loops katika JavaScript | Array na Loops | Jasmine |
| 08 | Terrarium | HTML Katika Vitendo | Jenga HTML ili kuunda terrarium mtandaoni, ukizingatia ujenzi wa mpangilio | Utangulizi wa HTML | Jen |
| 09 | Terrarium | CSS Katika Vitendo | Jenga CSS kuunda mtindo wa terrarium mtandaoni, ukizingatia misingi ya CSS ikiwa pamoja na kufanya ukurasa uwe wa responsive | Utangulizi wa CSS | Jen |
| 10 | Terrarium | Jifunze JavaScript Closures, na uendeshaji DOM | Jenga JavaScript ili terrarium ifanye kazi kama interface ya buruta/acha, ukizingatia closures na uendeshaji wa DOM | JavaScript Closures, uendeshaji wa DOM | Jen |
| 11 | Typing Game | Jenga Mchezo wa Kuandika | Jifunze jinsi ya kutumia matukio ya keyboard kuendesha mantiki ya app yako ya JavaScript | Programu Dhirio kwa Matukio | Christopher |
| 12 | Green Browser Extension | Kazi na Vivinjari | Jifunze jinsi vivinjari vinavyofanya kazi, historia yao, na jinsi ya kuunda vipengele vya awali vya kiendelezi cha kivinjari | Kuhusu Vivinjari | Jen |
| 13 | Green Browser Extension | Jenga fomu, piga API na hifadhi mabadiliko kwenye hifadhi ya ndani | Jenga vipengele vya JavaScript vya kiendelezi chako cha kivinjari kupiga API kwa kutumia mabadiliko yaliyohifadhiwa kwenye hifadhi ya ndani | API, Fomu, na Hifadhi ya Ndani | Jen |
| 14 | Green Browser Extension | Michakato ya nyuma katika kivinjari, utendaji wa wavuti | Tumia michakato ya nyuma ya kivinjari kusimamia ikoni ya kiendelezi; jifunze kuhusu utendaji wa wavuti na baadhi ya mbinu za kuboresha kufanya kazi vizuri | Kazi za Nyuma na Utendaji | Jen |
| 15 | Space Game | Maendeleo ya Mchezo Zaidi kwa JavaScript | Jifunze kuhusu Urithi kwa kutumia madarasa na muundo pamoja na muundo wa Pub/Sub, tayari kwa kujenga mchezo | Utangulizi kwa Maendeleo ya Mchezo Zaidi | Chris |
| 16 | Space Game | Kuchora kwenye Canvas | Jifunze kuhusu API ya Canvas, inayotumika kuchora vipengele kwenye skrini | Kuchora kwenye Canvas | Chris |
| 17 | Space Game | Kuhamisha vipengele kwenye skrini | Gundua jinsi vipengele vinaweza kupata mwendo kwa kutumia koordineti za Cartesian na API ya Canvas | Kuhamisha Vipengele | Chris |
| 18 | Space Game | Ugunduzi wa Mgongano | Fanya vipengele vikagongane na kujibu kwa kila mmoja kwa kutumia vitufe vya kuandika na toa kazi ya hifadhi ili kuhakikisha utendaji mzuri wa mchezo | Ugunduzi wa Mgongano | Chris |
| 19 | Space Game | Kuhifadhi alama | Fanya mahesabu ya hisabati kulingana na hali na utendaji wa mchezo | Kuhifadhi alama | Chris |
| 20 | Space Game | Kumaliza na kuanza upya mchezo | Jifunze kuhusu kumaliza na kuanza upya mchezo, ikijumuisha kusafisha mali na kuweka tena thamani za mabadiliko | Hali ya Kumaliza | Chris |
| 21 | Banking App | Violezo vya HTML na Njia katika Programu ya Wavuti | Jifunze jinsi ya kuunda miundo ya tovuti yenye kurasa nyingi kwa kutumia njia na violezo vya HTML | Violezo vya HTML na Njia | Yohan |
| 22 | Banking App | Jenga Fomu ya Kuingia na Usajili | Jifunze kuhusu ujenzi wa fomu na kushughulikia taratibu za uthibitishaji | Fomu | Yohan |
| 23 | Banking App | Mbinu za Kupata na Kutumia Data | Jinsi data inavyoingia na kutoka kwenye app yako, jinsi ya kuipata, kuihifadhi, na kuitupa | Data | Yohan |
| 24 | Banking App | Misingi ya Usimamizi wa Hali | Jifunze jinsi app yako inavyohifadhi hali na jinsi ya kuisimamia kwa njia ya programu | Usimamizi wa Hali | Yohan |
| 25 | Browser/VScode Code | Kazi na VScode | Jifunze jinsi ya kutumia mhariri wa msimbo | Tumia Mhariri wa VScode | Chris |
| 26 | AI Assistants | Kazi na AI | Jifunze jinsi ya kujenga msaidizi wako wa AI | Mradi wa Msaidizi wa AI | Chris |
Mtaala wetu umeundwa kwa misingi miwili muhimu ya kielimu:
- kujifunza kupitia miradi
- mazoezi ya mara kwa mara
Mpango huu hufundisha misingi ya JavaScript, HTML, na CSS, pamoja na zana na mbinu za hivi karibuni zinazotumiwa na waendelezaji wa wavuti wa leo. Wanafunzi watapata fursa ya kupata uzoefu wa vitendo kwa kujenga mchezo wa kuandika, terrarium wa kidijitali, kiendelezi cha kivinjari rafiki wa mazingira, mchezo wa wavamizi wa anga, na programu ya benki kwa biashara. Mwisho wa mfululizo huu, wanafunzi watakuwa na uelewa mzuri wa maendeleo ya wavuti.
🎓 Unaweza kuchukua masomo machache ya kwanza katika mtaala huu kama Njia ya Kujifunza kwenye Microsoft Learn!
Kwa kuhakikisha kuwa maudhui yanaendana na miradi, mchakato unakuwa wa kuvutia zaidi kwa wanafunzi na kuhifadhi dhana kutaboreshwa. Pia tuliandika masomo kadhaa ya mwanzo juu ya misingi ya JavaScript ili kuanzisha dhana, yanayounganishwa na video kutoka kwa mkusanyiko wa "Mfululizo wa Waanzilishi kwa: JavaScript", ambapo baadhi ya waandishi wake walichangia mtaala huu.
Aidha, zoezi la nyepesi kabla ya darasa hutoa nia kwa mwanafunzi kuelekea kujifunza mada, wakati zoezi la pili baada ya darasa linahakikisha uhifadhi wa zaidi. Mtaala huu umetengenezwa kuwa rahisi na wa kufurahisha na unaweza kuchukuliwa kwa mkamilifu au sehemu. Miradi huanza midogo na kuwa changamoto zaidi mwishoni mwa mzunguko wa wiki 12.
Ingawa tuliepuka kuanzisha mifumo ya JavaScript ili kuzingatia ujuzi wa msingi unaohitajika kama msanidi wa wavuti kabla ya kutumia mfumo, hatua nzuri inayofuata kumalizia mtaala huu ni kujifunza kuhusu Node.js kupitia mkusanyiko mwingine wa video: "Mfululizo wa Waanzilishi kwa: Node.js".
Tembelea Kanuni zetu za Maadili na mwongozo wa Kushiriki. Tunakaribisha maoni yako ya kujenga!
Unaweza kuendesha nyaraka hii bila mtandao kwa kutumia Docsify. Fanya fork ya repo hii, sakinisha Docsify kwenye kompyuta yako, kisha katika folda ya mizizi ya repo hii, andika docsify serve. Tovuti itapelekwa kwenye bandari 3000 kwenye localhost yako: localhost:3000.
PDF ya masomo yote inapatikana hapa.
Timu yetu hutoa kozi nyingine! Angalia:
Ikiwa unaenda kikwazo au una maswali yoyote kuhusu ujenzi wa programu za AI. Jiunge na wanafunzi wenzako na watengenezaji wenye uzoefu katika mijadala kuhusu MCP. Ni jamii ya kusaidia ambapo maswali yanakaribishwa na maarifa hushirikiwa kwa uhuru.
Ikiwa una maoni kuhusu bidhaa au makosa wakati wa kujenga tembelea:
Hazina hii inalindwa chini ya leseni ya MIT. Tazama faili la LICENSE kwa maelezo zaidi.
Sekela: Hati hii imetafsiriwa kwa kutumia huduma ya tafsiri ya AI Co-op Translator. Ingawa tunajitahidi kufikia usahihi, tafadhali fahamuni kwamba tafsiri za moja kwa moja zinaweza kuwa na makosa au upungufu. Hati asilia katika lugha yake ya asili inapaswa kuzingatiwa kama chanzo chenye mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatubebwi dhamana kwa kutoelewana au tafsiri potofu zinazotokana na matumizi ya tafsiri hii.


