Programu ya Wavuti ya Elimu: Hatua 13

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:49

Mradi huu uliundwa kama mgawo wa video na kozi ya runinga ya dijiti ambayo tulilazimika kutatua shida ya ufundishaji na ujifunzaji katika viwango vitatu: Njia ya Kimfumo, Kazi na dhana.

Mradi huu uliundwa kama mgawo wa kipindi cha video na televisheni ya dijiti, ambayo ilibidi tusuluhishe shida ya kufundisha na kujifunza katika viwango hivi vitatu: Njia, Utendaji na dhana. Tuliamua kutatua shida hii kwa kutumia jukwaa la wavuti, ambamo wanafunzi na waalimu wa kozi wanaweza kuingia. Wanafunzi wanaweza pia kupata video za kufundishia zinazoangazia mada kama vile kodeki na fomati za video, baada ya kujifunza sehemu ya dhana ya mada wanaweza kuendelea kufanya tathmini. Tathmini ina shughuli tatu; kila shughuli itakuwa na aina ya video inayofundisha mada zinazohusiana na kodeki na fomati za video na wakati huo huo kila shughuli ina kusudi tofauti, kwa hivyo na jukwaa hili tunaweza kufikia ufundishaji na tathmini ya sehemu ya kiutaratibu, inayofanya kazi na ya dhana. Ili kufanikisha haya yote, tulitumia Angular 4 na Firebase, tukitumia maktaba kama AngularFire5 na dragula. Kwa video tulitumia programu ya wavuti "PowToon".

Kwa hili kufundisha utahitaji:

• NodeJs
• Angular4
• Mradi wa Firebase
• Kompyuta

Hatua ya 1: Usakinishaji

• Sakinisha nodejs 8.9.1 na NPM (Node Package Manager)
• Sakinisha Angular-CLI (Interface Line Command) kuandika kwenye kiweko "npm install -g @ angular / cli"

Hatua ya 2: Kuunda Mradi

• Unda mradi ukitumia "ng new my-app"
• Sakinisha vifurushi vya nodi na "npm install"
• Sakinisha dragula na "npm install dragula - save"
• Sakinisha AngularFire2 na "npm install firebase angularfire2 - save"

Hatua ya 3: Firebase

Kwa hili unaweza kuangalia picha za hatua hii

• Unda akaunti ya google
• Bonyeza "Nenda kufariji"
• tengeneza mradi
• Nenda kwa jumla na ushike funguo za mteja

Hatua ya 4: Kuunda Vipengele

Kwa hili unaweza kuangalia picha za hatua hii

Unda vifaa vya programu.

Kutumia "ng g c" jina la sehemu "" kwa kila moja ya vitu vifuatavyo:

• Ukurasa wa Kozi
• Mada Ukurasa
• Ukurasa wa Video
• Ukurasa wa Tathmini
• Ukurasa wa Njia
• Ukurasa wa dhana
• Ukurasa wa Kazi
• Sehemu ya maoni
• Usimamizi

Hatua ya 5: Ukurasa wa Kozi

Kwa hili unaweza kuangalia picha za hatua hii

Unda html na ts

Katika ts utaandika mantiki nyuma ya kiotomatiki, ikiwa mtumiaji ni mwanafunzi au Msimamizi, na utaandika meza na habari ya kozi kutoka kwa mwanafunzi. Kwa hiyo unaweza kutumia huduma ya uthibitishaji na huduma ya hifadhidata iliyotolewa mwishoni mwa hii inayoweza kufundishwa.

Hatua ya 6: Ukurasa wa Mada

Kwa hili unaweza kuangalia picha za hatua hii

Katika sehemu hii utaandika html na ts.

Sawa na ukurasa wa kozi isipokuwa sio lazima uangalie ikiwa mtumiaji ni msimamizi au mwanafunzi, itabidi uandike tu uthibitishaji na upe orodha ya mada kwenye kozi hiyo.

Hatua ya 7: Ukurasa wa Video

Kwa hili unaweza kuangalia picha za hatua hii

Katika sehemu hii utaandika html na ts.

Kwa sehemu hii utatoa kiunga kutoka kwa powToon ili kucheza video, na sehemu ya maoni

Hatua ya 8: Ukurasa wa Tathmini

Kwa hili unaweza kuangalia picha za hatua hii

kwa mchungaji huyu utatumia sehemu moja ya video na video tofauti ambayo utaelezea mchakato wa tathmini.

Basi tu kuwa na kifungo kwamba viungo kwa ukurasa dhana

Hatua ya 9: Ukurasa wa Dhana

Kwa hili unaweza kuangalia picha za hatua hii

Katika ukurasa huu utaunda html na ts.

• Unda vifaa viwili vya video na kitufe
• Unda safu ya video mbili na boolean "is Sahihi"
• Andika kazi ya CheckScore ()
• Pakia alama kwenye hifadhidata
• Usafiri kwa ukurasa unaofuata

Hatua ya 10: Ukurasa wa Njia

Kwa hili unaweza kuangalia picha za hatua hii

Katika ukurasa huu utaunda html na ts.

• Utatumia dragula, kwa kuwa soma hati za dragula
• Unda safu za video
• Unda mpangilio wa video
• andika alama ya kuangalia
• Pakia Alama
• Nenda kwenye ukurasa unaofuata

Hatua ya 11: Ukurasa wa Kazi

Kwa hili unaweza kuangalia picha za hatua hii

Katika ukurasa huu utaunda html na ts.

• Sawa na ukurasa wa dhana utakuwa na vifungo na video kama chaguzi.
• Katika html andika shida ili mtumiaji atatue
• Kisha weka video kwa safu na boolean "IsCor sahihi"
• Pakia alama kwenye hifadhidata

Hatua ya 12: Ukurasa wa Ingia

Kwa hili unaweza kuangalia picha za hatua hii

• Unda html na ts
• Weka kwenye html picha
• Andika fomu katika html
• Tuma fomu katika ts kwa huduma ya auth
• Hifadhi mtumiaji kwenye hifadhidata

Hatua ya 13: Pakua Msimbo Kamili wa Vipengele na Huduma

Ikiwa ulikuwa na shida, hapa kuna rar na vifaa na huduma