localizeflow[bot]
4 weeks ago
parent
6a6a57d2fb
commit
e00c0e2d71
@ -1,45 +1,30 @@
|
||||
<!--
|
||||
CO_OP_TRANSLATOR_METADATA:
|
||||
{
|
||||
"original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
|
||||
"translation_date": "2025-08-27T22:55:45+00:00",
|
||||
"original_hash": "bc5c5550f79d10add90ce419ee34abb3",
|
||||
"translation_date": "2026-01-07T01:10:57+00:00",
|
||||
"source_file": "3-terrarium/README.md",
|
||||
"language_code": "id"
|
||||
}
|
||||
-->
|
||||
# Terrarium Saya: Proyek untuk Belajar tentang HTML, CSS, dan Manipulasi DOM menggunakan JavaScript 🌵🌱
|
||||
## Deploy Terrarium Anda
|
||||
|
||||
Sebuah meditasi kode kecil dengan fitur drag and drop. Dengan sedikit HTML, JS, dan CSS, Anda akan dapat membangun antarmuka web, mendesainnya, dan bahkan menambahkan berbagai interaksi sesuai keinginan Anda.
|
||||
|
||||
|
||||
|
||||
# Pelajaran
|
||||
|
||||
1. [Pengenalan HTML](./1-intro-to-html/README.md)
|
||||
2. [Pengenalan CSS](./2-intro-to-css/README.md)
|
||||
3. [Pengenalan DOM dan Penutupan JS](./3-intro-to-DOM-and-closures/README.md)
|
||||
|
||||
## Kredit
|
||||
|
||||
Ditulis dengan ♥️ oleh [Jen Looper](https://www.twitter.com/jenlooper)
|
||||
|
||||
Terrarium yang dibuat menggunakan CSS terinspirasi dari kaca toples karya Jakub Mandra di [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
|
||||
|
||||
Karya seni digambar tangan oleh [Jen Looper](http://jenlooper.com) dengan bantuan Procreate.
|
||||
|
||||
## Publikasikan Terrarium Anda
|
||||
|
||||
Anda dapat mempublikasikan terrarium Anda di web menggunakan Azure Static Web Apps.
|
||||
Anda dapat mendeply, atau menerbitkan Terrarium Anda di web menggunakan **Azure Static Web Apps**.
|
||||
|
||||
1. Fork repositori ini
|
||||
|
||||
2. Tekan tombol ini
|
||||
2. Tekan tombol ini 👇
|
||||
|
||||
[](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
|
||||
[](https://portal.azure.com/#create/Microsoft.StaticApp)
|
||||
|
||||
3. Ikuti panduan wizard untuk membuat aplikasi Anda. Pastikan Anda mengatur root aplikasi ke `/solution` atau root dari basis kode Anda. Tidak ada API dalam aplikasi ini, jadi Anda tidak perlu khawatir menambahkannya. Sebuah folder GitHub akan dibuat di repositori yang telah Anda fork, yang akan membantu layanan build Azure Static Web Apps untuk membangun dan mempublikasikan aplikasi Anda ke URL baru.
|
||||
3. Ikuti panduan penyiapan untuk membuat aplikasi Anda.
|
||||
- Atur **App root** ke `/solution` atau root dari kode Anda.
|
||||
- Tidak ada API dalam aplikasi ini, jadi Anda bisa melewati konfigurasi API.
|
||||
- Folder `.github` akan dibuat secara otomatis untuk membantu Azure Static Web Apps membangun dan menerbitkan aplikasi Anda.
|
||||
|
||||
---
|
||||
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
|
||||
**Penafian**:
|
||||
Dokumen ini telah diterjemahkan menggunakan layanan penerjemahan AI [Co-op Translator](https://github.com/Azure/co-op-translator). Meskipun kami berusaha untuk memberikan hasil yang akurat, harap diketahui bahwa terjemahan otomatis mungkin mengandung kesalahan atau ketidakakuratan. Dokumen asli dalam bahasa aslinya harus dianggap sebagai sumber yang otoritatif. Untuk informasi yang bersifat kritis, disarankan menggunakan jasa penerjemahan profesional oleh manusia. Kami tidak bertanggung jawab atas kesalahpahaman atau penafsiran yang keliru yang timbul dari penggunaan terjemahan ini.
|
||||
Dokumen ini telah diterjemahkan menggunakan layanan terjemahan AI [Co-op Translator](https://github.com/Azure/co-op-translator). Meskipun kami berusaha untuk memberikan terjemahan yang akurat, harap diingat bahwa terjemahan otomatis mungkin mengandung kesalahan atau ketidakakuratan. Dokumen asli dalam bahasa aslinya harus dianggap sebagai sumber yang resmi dan sah. Untuk informasi yang krusial, disarankan menggunakan jasa penerjemah profesional manusia. Kami tidak bertanggung jawab atas kesalahpahaman atau salah tafsir yang timbul dari penggunaan terjemahan ini.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
|
||||
@ -1,45 +1,30 @@
|
||||
<!--
|
||||
CO_OP_TRANSLATOR_METADATA:
|
||||
{
|
||||
"original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
|
||||
"translation_date": "2025-08-27T22:55:57+00:00",
|
||||
"original_hash": "bc5c5550f79d10add90ce419ee34abb3",
|
||||
"translation_date": "2026-01-07T01:12:30+00:00",
|
||||
"source_file": "3-terrarium/README.md",
|
||||
"language_code": "ms"
|
||||
}
|
||||
-->
|
||||
# Terrarium Saya: Projek untuk belajar tentang HTML, CSS, dan manipulasi DOM menggunakan JavaScript 🌵🌱
|
||||
## Terbitkan Terrarium anda
|
||||
|
||||
Sebuah meditasi kod kecil dengan fungsi seret dan lepas. Dengan sedikit HTML, JS, dan CSS, anda akan dapat membina antara muka web, menggayakannya, dan bahkan menambah pelbagai interaksi pilihan anda.
|
||||
|
||||
|
||||
|
||||
# Pelajaran
|
||||
|
||||
1. [Pengenalan kepada HTML](./1-intro-to-html/README.md)
|
||||
2. [Pengenalan kepada CSS](./2-intro-to-css/README.md)
|
||||
3. [Pengenalan kepada DOM dan Penutupan JS](./3-intro-to-DOM-and-closures/README.md)
|
||||
|
||||
## Kredit
|
||||
|
||||
Ditulis dengan ♥️ oleh [Jen Looper](https://www.twitter.com/jenlooper)
|
||||
|
||||
Terrarium yang dibuat menggunakan CSS diilhamkan oleh balang kaca Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
|
||||
|
||||
Karya seni dilukis tangan oleh [Jen Looper](http://jenlooper.com) dengan bantuan Procreate.
|
||||
|
||||
## Terbitkan Terrarium Anda
|
||||
|
||||
Anda boleh menerbitkan atau memaparkan terrarium anda di web menggunakan Azure Static Web Apps.
|
||||
Anda boleh menerbitkan, atau memaparkan Terrarium anda di web menggunakan **Azure Static Web Apps**.
|
||||
|
||||
1. Fork repositori ini
|
||||
|
||||
2. Tekan butang ini
|
||||
2. Tekan butang ini 👇
|
||||
|
||||
[](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
|
||||
[](https://portal.azure.com/#create/Microsoft.StaticApp)
|
||||
|
||||
3. Ikuti panduan wizard untuk mencipta aplikasi anda. Pastikan anda menetapkan akar aplikasi kepada sama ada `/solution` atau akar pangkalan kod anda. Tiada API dalam aplikasi ini, jadi tidak perlu risau untuk menambahnya. Folder github akan dicipta dalam repositori yang telah anda fork, yang akan membantu perkhidmatan binaan Azure Static Web Apps membina dan menerbitkan aplikasi anda ke URL baharu.
|
||||
3. Ikuti panduan penetapan untuk mencipta aplikasi anda.
|
||||
- Tetapkan **App root** kepada sama ada `/solution` atau akar kod anda.
|
||||
- Aplikasi ini tidak mempunyai API, jadi anda boleh langkau konfigurasi API.
|
||||
- Folder `.github` akan dicipta secara automatik untuk membantu Azure Static Web Apps membina dan menerbitkan aplikasi anda.
|
||||
|
||||
---
|
||||
|
||||
<!-- 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 memastikan ketepatan, sila ambil perhatian bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang berwibawa. Untuk maklumat yang kritikal, terjemahan manusia profesional adalah disyorkan. Kami tidak bertanggungjawab atas 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 ketepatan, sila ambil perhatian bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang sahih. Untuk maklumat penting, disyorkan untuk mendapatkan terjemahan profesional oleh manusia. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,45 +1,30 @@
|
||||
<!--
|
||||
CO_OP_TRANSLATOR_METADATA:
|
||||
{
|
||||
"original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
|
||||
"translation_date": "2025-08-28T04:12:52+00:00",
|
||||
"original_hash": "bc5c5550f79d10add90ce419ee34abb3",
|
||||
"translation_date": "2026-01-07T01:18:40+00:00",
|
||||
"source_file": "3-terrarium/README.md",
|
||||
"language_code": "sw"
|
||||
}
|
||||
-->
|
||||
# Terrarium Yangu: Mradi wa kujifunza kuhusu HTML, CSS, na udhibiti wa DOM kwa kutumia JavaScript 🌵🌱
|
||||
## Tuma Terrarium yako
|
||||
|
||||
Mradi mdogo wa kuburuta na kudondosha. Kwa kutumia HTML, JS, na CSS kidogo, utaweza kujenga kiolesura cha wavuti, kukipamba, na hata kuongeza mwingiliano mbalimbali wa chaguo lako.
|
||||
|
||||
|
||||
|
||||
# Masomo
|
||||
|
||||
1. [Utangulizi wa HTML](./1-intro-to-html/README.md)
|
||||
2. [Utangulizi wa CSS](./2-intro-to-css/README.md)
|
||||
3. [Utangulizi wa DOM na JS Closures](./3-intro-to-DOM-and-closures/README.md)
|
||||
|
||||
## Shukrani
|
||||
|
||||
Imeandikwa kwa ♥️ na [Jen Looper](https://www.twitter.com/jenlooper)
|
||||
|
||||
Terrarium iliyoundwa kwa kutumia CSS ilihamasishwa na jar ya kioo ya Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
|
||||
|
||||
Sanaa ya michoro imechorwa kwa mkono na [Jen Looper](http://jenlooper.com) kwa msaada wa Procreate.
|
||||
|
||||
## Chapisha Terrarium Yako
|
||||
|
||||
Unaweza kuchapisha, au kuweka terrarium yako mtandaoni kwa kutumia Azure Static Web Apps.
|
||||
Unaweza kutuma, au kuchapisha Terrarium yako kwenye wavuti ukitumia **Azure Static Web Apps**.
|
||||
|
||||
1. Fanya fork ya repo hii
|
||||
|
||||
2. Bonyeza kitufe hiki
|
||||
2. Bonyeza kitufe hiki 👇
|
||||
|
||||
[](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
|
||||
[](https://portal.azure.com/#create/Microsoft.StaticApp)
|
||||
|
||||
3. Fuata hatua za mwongozo wa kuunda programu yako. Hakikisha unaweka mzizi wa programu kuwa ama `/solution` au mzizi wa msimbo wako. Hakuna API katika programu hii, kwa hivyo usijali kuhusu kuongeza hiyo. Folda ya github itaundwa kwenye repo yako ya fork ambayo itasaidia huduma za ujenzi za Azure Static Web Apps kujenga na kuchapisha programu yako kwenye URL mpya.
|
||||
3. Fuata mchawi wa usanidi kuunda programu yako.
|
||||
- Weka **App root** iwe `/solution` au mzizi wa msimbo wako.
|
||||
- Hakuna API katika programu hii, hivyo unaweza kuruka usanidi wa API.
|
||||
- Folda ya `.github` itaumbwa moja kwa moja kusaidia Azure Static Web Apps kujenga na kuchapisha programu yako.
|
||||
|
||||
---
|
||||
|
||||
**Kanusho**:
|
||||
Hati hii imetafsiriwa kwa kutumia huduma ya kutafsiri 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 kutokuwa sahihi. Hati ya asili katika lugha yake ya awali inapaswa kuzingatiwa kama chanzo cha mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatutawajibika kwa kutoelewana au tafsiri zisizo sahihi zinazotokana na matumizi ya tafsiri hii.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
|
||||
**Kitanzi cha maelezo**:
|
||||
Nyaraka hii imefasiriwa 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 moja kwa moja zinaweza kuwa na makosa au upotoshaji. Nyaraka ya asili katika lugha yake asilia inapaswa kuchukuliwa kama chanzo halali. Kwa taarifa za muhimu sana, tafsiri ya kitaalamu ya binadamu inashauriwa. Hatubeba dhamana kwa maelezo yaliyokosewa au tafsiri potofu zinazotokana na matumizi ya tafsiri hii.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
|
||||
@ -1,48 +1,290 @@
|
||||
<!--
|
||||
CO_OP_TRANSLATOR_METADATA:
|
||||
{
|
||||
"original_hash": "5adea7059676fcdb1b546ccd54c956c2",
|
||||
"translation_date": "2025-10-24T19:38:11+00:00",
|
||||
"original_hash": "efa2ab875b8bb5a7883816506da6b6d2",
|
||||
"translation_date": "2026-01-07T01:17:47+00:00",
|
||||
"source_file": "4-typing-game/README.md",
|
||||
"language_code": "sw"
|
||||
}
|
||||
-->
|
||||
# Programu Inayoendeshwa na Matukio - Jenga Mchezo wa Kuandika
|
||||
# Programu Inayochochewa na Matukio - Jenga Mchezo wa Kuandika
|
||||
|
||||
```mermaid
|
||||
journey
|
||||
title Safari Yako ya Maendeleo ya Mchezo wa Kuandika
|
||||
section Msingi
|
||||
Panga muundo wa mchezo: 3: Student
|
||||
Tengeneza kiolesura cha mtumiaji: 4: Student
|
||||
Sanidi vipengele vya HTML: 4: Student
|
||||
section Ufanisi
|
||||
Shughulikia ingizo la mtumiaji: 4: Student
|
||||
Fuatilia muda: 5: Student
|
||||
Hesabu usahihi: 5: Student
|
||||
section Sifa
|
||||
Ongeza maoni ya kuona: 5: Student
|
||||
Tekeleza mantiki ya mchezo: 5: Student
|
||||
Boresha uzoefu: 5: Student
|
||||
```
|
||||
## Utangulizi
|
||||
|
||||
Hili ni jambo ambalo kila msanidi programu analijua lakini mara chache huzungumzia: kuandika haraka ni uwezo wa kipekee! 🚀 Fikiria - kadri unavyoweza kuhamisha mawazo yako kutoka kwenye ubongo hadi kwenye mhariri wa msimbo kwa haraka, ndivyo ubunifu wako unavyoweza kutiririka zaidi. Ni kama kuwa na njia ya moja kwa moja kati ya mawazo yako na skrini.
|
||||
Hapa ni kitu ambacho kila mtengenezaji anajua lakini mara chache husema: kuandika kwa haraka ni nguvu ya ajabu! 🚀 Fikiria - unavyoweza kuhamisha mawazo yako kutoka kichwani mwako hadi mhariri wa msimbo kwa haraka, ndivyo ubunifu wako unavyoweza kuendelea. Ni kama kuwa na bomba la moja kwa moja kati ya mawazo yako na skrini.
|
||||
|
||||
Unataka kujua mojawapo ya njia bora za kuboresha ujuzi huu? Umeipata - tutatengeneza mchezo!
|
||||
```mermaid
|
||||
pie title Vipengele vya Mchezo
|
||||
"Mrejesho wa Wakati Halisi" : 25
|
||||
"Ufuatiliaji wa Utendaji" : 20
|
||||
"Kiolesura cha Mtumiaji Shirikishi" : 20
|
||||
"Mfumo wa Saa ya Kucheza" : 15
|
||||
"Usimamizi wa Nukuu" : 10
|
||||
"Maonyesho ya Matokeo" : 10
|
||||
```
|
||||
Unataka kujua mojawapo ya njia bora za kuboresha ujuzi huu? Uliweza - tutajenga mchezo!
|
||||
|
||||
> Hebu tuunde mchezo wa kuandika wa kuvutia pamoja!
|
||||
```mermaid
|
||||
flowchart LR
|
||||
A[Mchezaji anaanza mchezo] --> B[Nukuu ya bahati inaonyeshwa]
|
||||
B --> C[Mchezaji anaandika herufi]
|
||||
C --> D{Herufi ni sahihi?}
|
||||
D -->|Ndiyo| E[Onyesho la kijani]
|
||||
D -->|Hapana| F[Onyesho la nyekundu]
|
||||
E --> G[Badilisha usahihi]
|
||||
F --> G
|
||||
G --> H{Nukuu imekamilika?}
|
||||
H -->|Hapana| C
|
||||
H -->|Ndiyo| I[Hesabu WPM]
|
||||
I --> J[Onyesha matokeo]
|
||||
J --> K[Cheza tena?]
|
||||
K -->|Ndiyo| B
|
||||
K -->|Hapana| L[Mchezo umekwisha]
|
||||
|
||||
style A fill:#e1f5fe
|
||||
style D fill:#fff3e0
|
||||
style E fill:#e8f5e8
|
||||
style F fill:#ffebee
|
||||
style I fill:#f3e5f5
|
||||
```
|
||||
> Tuwekeze pamoja mchezo mzuri wa kuandika!
|
||||
|
||||
Uko tayari kutumia ujuzi wote wa JavaScript, HTML, na CSS ambao umekuwa ukijifunza? Tutatengeneza mchezo wa kuandika ambao utakupa changamoto kwa nukuu za nasibu kutoka kwa mpelelezi maarufu [Sherlock Holmes](https://en.wikipedia.org/wiki/Sherlock_Holmes). Mchezo utafuatilia jinsi unavyoandika haraka na kwa usahihi - na ni wa kuvutia zaidi kuliko unavyoweza kufikiria!
|
||||
Ume tayari kutumia ujuzi wote wa JavaScript, HTML, na CSS ambao umekuwa ukijifunza? Tutajenga mchezo wa kuandika utakayekupa changamoto na nukuu za nasibu kutoka kwa mchunguzi maarufu [Sherlock Holmes](https://en.wikipedia.org/wiki/Sherlock_Holmes). Mchezo utahesabu kasi na usahihi wa maandishi yako - na niamini, ni kitendawili zaidi kuliko unavyoweza kufikiria!
|
||||
|
||||
```mermaid
|
||||
mindmap
|
||||
root((Typing Game Development))
|
||||
User Interface
|
||||
Input Elements
|
||||
Visual Feedback
|
||||
Responsive Design
|
||||
Accessibility
|
||||
Game Logic
|
||||
Quote Selection
|
||||
Timer Management
|
||||
Accuracy Tracking
|
||||
Score Calculation
|
||||
Event Handling
|
||||
Keyboard Input
|
||||
Button Clicks
|
||||
Real-time Updates
|
||||
Game State Changes
|
||||
Performance Metrics
|
||||
Maneno Kwa Dakika
|
||||
Usahihi wa Herufi
|
||||
Ufuatiliaji wa Makosa
|
||||
Onyesho la Maendeleo
|
||||
User Experience
|
||||
Maoni Mara Moja
|
||||
Maelekezo Wazi
|
||||
Yaliyovutia
|
||||
Mfumo wa Mafanikio
|
||||
```
|
||||
|
||||
|
||||
## Unachohitaji Kujua
|
||||
## Kile Utakachohitaji Kujua
|
||||
|
||||
Kabla hatujaanza, hakikisha unajiamini na dhana hizi (usijali ikiwa unahitaji ukumbusho wa haraka - sote tumewahi kuwa hapo!):
|
||||
```mermaid
|
||||
flowchart TD
|
||||
A[Kitendo cha Mtumiaji] --> B{Aina ya Tukio?}
|
||||
B -->|Bonyeza Funguo| C[Tukio la Kibodi]
|
||||
B -->|Bonyeza Kitufe| D[Tukio la Panya]
|
||||
B -->|Muda| E[Tukio la Muda]
|
||||
|
||||
C --> F[Kagua Herufi]
|
||||
D --> G[Anza/Rudisha Michezo]
|
||||
E --> H[Sabisha Muda]
|
||||
|
||||
F --> I{Ni Sahihi?}
|
||||
I -->|Ndio| J[Onyesha Kwa Kijani]
|
||||
I -->|Hapana| K[Onyesha Kwa Nyekundu]
|
||||
|
||||
J --> L[Sasisha Alama]
|
||||
K --> L
|
||||
L --> M[Kagua Hali ya Michezo]
|
||||
|
||||
G --> N[Tengeneza Nukuu Mpya]
|
||||
H --> O[Onyesha Muda]
|
||||
|
||||
M --> P{Mchezo Umeisha?}
|
||||
P -->|Ndio| Q[Onyesha Matokeo]
|
||||
P -->|Hapana| R[Endelea na Mchezo]
|
||||
|
||||
style A fill:#e1f5fe
|
||||
style F fill:#e8f5e8
|
||||
style I fill:#fff3e0
|
||||
style Q fill:#f3e5f5
|
||||
```
|
||||
Kabla hatujaingia ndani, hakikisha umeelewa dhana hizi (usijali kama unahitaji kujikumbusha haraka - sote tumepitia hapo!):
|
||||
|
||||
- Kuunda sehemu ya kuingiza maandishi na vidhibiti vya kitufe
|
||||
- CSS na kuweka mitindo kwa kutumia madarasa
|
||||
- Kutengeneza kudhibiti maandishi na vifungo
|
||||
- CSS na kuweka mitindo kwa kutumia madaraja
|
||||
- Misingi ya JavaScript
|
||||
- Kuunda array
|
||||
- Kuunda namba ya nasibu
|
||||
- Kupata muda wa sasa
|
||||
- Kutengeneza safu (array)
|
||||
- Kutengeneza namba ya bahati nasibu
|
||||
- Kupata wakati wa sasa
|
||||
|
||||
Ikiwa mojawapo ya haya inaonekana kuwa ngumu kidogo, ni sawa kabisa! Wakati mwingine njia bora ya kuimarisha maarifa yako ni kwa kuingia kwenye mradi na kujifunza unavyosonga mbele.
|
||||
Kama mojawapo ya haya inahisi imechakaa kidogo, hiyo ni sawa kabisa! Wakati mwingine njia bora ya kuimarisha ujuzi ni kuingia kwenye mradi na kubaini mambo unavyokwenda.
|
||||
|
||||
## Hebu Tujenge Hili!
|
||||
### 🔄 **Ukaguzi wa Kina wa Kitaaluma**
|
||||
**Tathmini ya Msingi**: Kabla ya kuanza maendeleo, hakikisha unaelewa:
|
||||
- ✅ Jinsi fomu za HTML na vipengele vya input vinavyofanya kazi
|
||||
- ✅ Madaraja ya CSS na mitindo ya mabadiliko
|
||||
- ✅ Wasikilizaji na washughulikiaji wa matukio ya JavaScript
|
||||
- ✅ Uendeshaji wa safu na uchaguzi wa nasibu
|
||||
- ✅ Kupima muda na hesabu
|
||||
|
||||
[Kuunda mchezo wa kuandika kwa kutumia programu inayoendeshwa na matukio](./typing-game/README.md)
|
||||
**Jaribio la Haraka la Kujitathmini**: Je, unaweza kuelezea jinsi dhana hizi zinavyofanya kazi pamoja katika mchezo wa mwingiliano?
|
||||
- **Matukio** huchochewa wakati watumiaji wanapotenda na vipengele
|
||||
- **Washughulikiaji** hushughulikia matukio hayo na kusasisha hali ya mchezo
|
||||
- **CSS** hutoa mrejesho wa kuona kwa vitendo vya mtumiaji
|
||||
- **Kupima muda** husaidia kupima utendaji na maendeleo ya mchezo
|
||||
|
||||
## Credits
|
||||
```mermaid
|
||||
quadrantChart
|
||||
title Maendeleo ya Ujuzi wa Mchezo wa Kuandika
|
||||
x-axis Mwanzo --> Mtaalamu
|
||||
y-axis Imara --> Shirikishi
|
||||
quadrant-1 Michezo ya Juu
|
||||
quadrant-2 Programu za Wakati Halisi
|
||||
quadrant-3 Kurasa za Msingi
|
||||
quadrant-4 Tovuti Shirikishi
|
||||
|
||||
HTML Forms: [0.3, 0.2]
|
||||
CSS Styling: [0.4, 0.3]
|
||||
Event Handling: [0.7, 0.8]
|
||||
Game Logic: [0.8, 0.9]
|
||||
Performance Tracking: [0.9, 0.7]
|
||||
```
|
||||
## Hebu Tujenge Kitu Hiki!
|
||||
|
||||
[Kutengeneza mchezo wa kuandika kwa kutumia programu inayochochewa na matukio](./typing-game/README.md)
|
||||
|
||||
### ⚡ **Unaweza Kufanya Katika Dakika 5 Zijazo**
|
||||
- [ ] Fungua konsole ya kivinjari chako na jaribu kusikiliza matukio ya kibodi kwa kutumia `addEventListener`
|
||||
- [ ] Tengeneza ukurasa rahisi wa HTML wenye uga wa kuingiza na jaribu kugundua maandishi yanayoingizwa
|
||||
- [ ] Fanya mazoezi ya uendeshaji wa mistari kwa kulinganisha maandishi yaliyotumwa na maandishi lengwa
|
||||
- [ ] Jaribu `setTimeout` kuelewa kazi za muda
|
||||
|
||||
### 🎯 **Unaweza Kufanikisha Saa Hii**
|
||||
- [ ] Maliza mtihani baada ya somo na uelewe programu inayochochewa na matukio
|
||||
- [ ] Jenga toleo la msingi la mchezo wa kuandika na uthibitishaji wa maneno
|
||||
- [ ] Ongeza mrejesho wa kuona kwa kuandika sahihi na makosa
|
||||
- [ ] Tekeleza mfumo rahisi wa alama kulingana na kasi na usahihi
|
||||
- [ ] Pamba mchezo wako kwa CSS ili kuufanya uonekane mzuri
|
||||
|
||||
### 📅 **Maendeleo yako ya Mchezo kwa Wiki nzima**
|
||||
- [ ] Maliza mchezo kamili wa kuandika na vipengele vyote na utengenezaji
|
||||
- [ ] Ongeza viwango vya ugumu kwa utofauti wa maneno
|
||||
- [ ] Tekeleza ufuatiliaji wa takwimu za mtumiaji (WPM, usahihi kwa muda)
|
||||
- [ ] Tengeneza athari za sauti na michoro kwa uzoefu bora wa mtumiaji
|
||||
- [ ] Fanya mchezo wako ujibadilike kwa simu za mkononi na vifaa vya kugusa
|
||||
- [ ] Shiriki mchezo wako mtandaoni na ukusanye maoni kutoka kwa watumiaji
|
||||
|
||||
### 🌟 **Maendeleo yako ya Mchezo wa Miezi Kadhaa**
|
||||
- [ ] Jenga michezo mingi ikichunguza mifumo tofauti ya mwingiliano
|
||||
- [ ] Jifunze kuhusu mizunguko ya mchezo, usimamizi wa hali, na uboreshaji wa utendaji
|
||||
- [ ] Changia kwenye miradi ya maendeleo ya michezo ya chanzo huria
|
||||
- [ ] Shikilia dhana za hali ya juu za muda na michoro laini
|
||||
- [ ] Tengeneza jalada la miradi inayoonyesha programu mbalimbali zinazoingiliana
|
||||
- [ ] Telekeza wengine wanaopenda maendeleo ya michezo na mwingiliano wa watumiaji
|
||||
|
||||
## 🎯 Muda wa Kumiliki Mchezo wako wa Kuandika
|
||||
|
||||
```mermaid
|
||||
timeline
|
||||
title Maendeleo ya Kujifunza Kuunda Michezo
|
||||
|
||||
section Setup (dakika 10)
|
||||
Project Structure: Msingi wa HTML
|
||||
: Usanidi wa mtindo wa CSS
|
||||
: Uundaji wa faili la JavaScript
|
||||
|
||||
section User Interface (dakika 20)
|
||||
Interactive Elements: Sehemu za kuingiza
|
||||
: Kontrol za vitufe
|
||||
: Eneo la kuonyesha
|
||||
: Mpangilio unaojibu
|
||||
|
||||
section Event Handling (dakika 25)
|
||||
User Interaction: Matukio ya kibodi
|
||||
: Matukio ya panya
|
||||
: Maoni ya wakati halisi
|
||||
: Usimamizi wa hali
|
||||
|
||||
section Game Logic (dakika 30)
|
||||
Core Functionality: Uundaji wa nukuu
|
||||
: Ulinganishaji wa wahusika
|
||||
: Hesabu ya usahihi
|
||||
: Utekelezaji wa timer
|
||||
|
||||
section Performance Tracking (dakika 35)
|
||||
Metrics & Analytics: Hesabu ya WPM
|
||||
: Ufuatiliaji wa makosa
|
||||
: Uonyesho wa maendeleo
|
||||
: Kuonyesha matokeo
|
||||
|
||||
section Polish & Enhancement (dakika 45)
|
||||
User Experience: Maoni ya kuona
|
||||
: Athari za sauti
|
||||
: Michoro ya mienendo
|
||||
: Sifa za upatikanaji
|
||||
|
||||
section Advanced Features (wiki 1)
|
||||
Extended Functionality: Ngazi za ugumu
|
||||
: Jedwali la viongozi
|
||||
: Nukuu maalum
|
||||
: Chaguo nyingi-mchezaji
|
||||
|
||||
section Professional Skills (mwezi 1)
|
||||
Game Development: Uboreshaji wa utendaji
|
||||
: Miundo ya msimbo
|
||||
: Mikakati ya kujaribu
|
||||
: Mifumo ya kuanzisha
|
||||
```
|
||||
### 🛠️ Muhtasari wa Zana zako za Maendeleo ya Mchezo
|
||||
|
||||
Baada ya kumaliza mradi huu, utakuwa umejifunza:
|
||||
- **Programu Inayochochewa na Matukio**: Kiolesura cha mtumiaji kinachojibu kwa upendeleo wa kuingiza
|
||||
- **Mrejesho wa Wakati Halisi**: Sasisho za kuona na utendaji mara moja
|
||||
- **Upimaji wa Utendaji**: Mfumo sahihi wa muda na alama
|
||||
- **Usimamizi wa Hali ya Mchezo**: Kudhibiti mtiririko wa programu na uzoefu wa mtumiaji
|
||||
- **Ubunifu wa Kuingiliana**: Kuunda uzoefu wa mtumiaji unaovutia na kueneza uraibu
|
||||
- **APIs za Kisasa za Wavuti**: Kutumia uwezo wa kivinjari kwa mwingiliano tajiri
|
||||
- **Mifumo ya Ufikiaji**: Ubunifu wa kushirikisha watumiaji wote
|
||||
|
||||
**Matumizi Halisi**: Ujuzi huu unatumiwa moja kwa moja kwa:
|
||||
- **Programu za Wavuti**: Kiolesura chochote cha mwingiliano au dashibodi
|
||||
- **Programu za Elimu**: Majukwaa ya kujifunza na zana za tathmini ya ujuzi
|
||||
- **Zana za Ufanisi**: Wahariri wa maandishi, IDEs, na programu za ushirikiano
|
||||
- **Sekta ya Michezo**: Michezo ya kivinjari na burudani za kuingiliana
|
||||
- **Maendeleo ya Simu**: Kiolesura kinachogusa na usimamizi wa ishara
|
||||
|
||||
**Kipindi Kinachofuata**: Uko tayari kuchunguza mifumo ya mchezo ya hali ya juu, mifumo ya wachezaji wengi kwa wakati mmoja, au programu tata za mwingiliano!
|
||||
|
||||
## Mawasiliano
|
||||
|
||||
Imeandikwa kwa ♥️ na [Christopher Harrison](http://www.twitter.com/geektrainer)
|
||||
|
||||
---
|
||||
|
||||
**Kanusho**:
|
||||
Hati 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 kutokuwa sahihi. Hati ya asili katika lugha yake ya awali inapaswa kuzingatiwa kama chanzo cha mamlaka. Kwa taarifa muhimu, tafsiri ya kitaalamu ya binadamu inapendekezwa. Hatutawajibika kwa kutoelewana au tafsiri zisizo sahihi zinazotokana na matumizi ya tafsiri hii.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
|
||||
**Tangazo la Majeruhi**:
|
||||
Hati 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. Hati asili katika lugha yake ya asili inapaswa kuchukuliwa kama chanzo cha mamlaka. Kwa habari muhimu, tafsiri bora ya binadamu mtaalamu inapendekezwa. Hatuwajibiki kwa kutoelewana au tafsiri zisizo sahihi zinazotokana na matumizi ya tafsiri hii.
|
||||
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue