Ueb-aplikacioni i edukimit: 13 hapa

2024 Autor: John Day | [email protected]. E modifikuara e fundit: 2024-01-30 12:10

Ky projekt u krijua si një detyrë për kursin video dhe televizion dixhital në të cilin ne duhej të zgjidhnim problemin e mësimdhënies dhe të mësuarit në tre nivele: Metodologjike, Funksionale dhe Konceptuale.

Ky projekt u krijua si një detyrë për kursin e videove dhe televizionit dixhital, në të cilin ne duhej të zgjidhnim problemin e mësimdhënies dhe të mësuarit në këto tre nivele: Metodologjike, Funksionale dhe Konceptuale. Ne vendosëm ta zgjidhim këtë problem duke përdorur një platformë në internet, në të cilën studentët dhe mësuesit e kursit mund të regjistrohen. Studentët gjithashtu mund të kenë qasje në videot mësimore që mbulojnë tema të tilla si kodikët dhe formatet video, pasi të kenë mësuar pjesën konceptuale të temës që mund të vazhdojnë për të bërë një vlerësim. Vlerësimi përbëhet nga tre aktivitete; çdo aktivitet do të ketë një lloj temash mësimore video të lidhura me kodikët dhe formatet video dhe në të njëjtën kohë çdo aktivitet ka një qëllim të ndryshëm, kështu që me këtë platformë ne mund të arrijmë mësimin dhe vlerësimin e pjesës metodologjike, funksionale dhe konceptuale. Për të arritur të gjitha këto, ne përdorëm Angular 4 dhe Firebase, duke përdorur biblioteka të tilla si AngularFire5 dhe dragula. Për videot kemi përdorur ueb-aplikacionin "PowToon".

Për këtë udhëzues do t'ju duhet:

• NodeJs
• Këndore4
• Projekti Firebase
• Një kompjuter

Hapi 1: Instalimi

• Instaloni nodejs 8.9.1 me NPM (Node Package Manager)
• Instaloni Angular -CLI (Ndërfaqja e Linjës së Komandës) duke shtypur në tastierë "npm install -g @angular/cli"

Hapi 2: Krijimi i projektit

• Krijoni një projekt duke përdorur "ng new my-app"
• Instaloni paketat e nyjeve me "instaloni npm"
• Instaloni dragula me "npm install dragula -ruani"
• Instaloni AngularFire2 me "npm install firebase angularfire2 --save"

Hapi 3: Baza e zjarrit

Për këtë ju mund të kontrolloni imazhet e këtij hapi

• Krijoni një llogari google
• Klikoni në "Shko në tastierë"
• krijoni një projekt
• Shkoni te General dhe kapni çelësat e klientit

Hapi 4: Krijimi i Komponentëve

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Krijoni përbërësit për aplikacionin.

Përdorimi i "ng g c" emrit të komponentit "" për secilin nga komponentët e mëposhtëm:

• Faqja e Kursit
• Faqja e temave
• Faqja e videos
• Faqja e vlerësimit
• Faqe metodologjike
• Faqja Konceptuale
• Faqja funksionale
• Komponenti i komenteve
• Administratori

Hapi 5: Faqja e Kursit

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Krijoni html dhe ts

Në ts ju do të shkruani logjikën prapa autentication, nëse përdoruesi është një student ose një Administrator, dhe ju do të shkruani një tabelë me informacionin e kursit nga studenti. Për këtë ju mund të përdorni një shërbim vërtetimi dhe një shërbim të dhënash të dyja të ofruara në fund të këtij udhëzuesi.

Hapi 6: Faqja e Temave

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Në këtë komponent do të shkruani html dhe ts.

Ngjashëm me faqen e kursit, përveçse nuk duhet të kontrolloni nëse përdoruesi është administrator ose student, ju vetëm do të duhet të shkruani vërtetim dhe të siguroni listat e temave në kurs.

Hapi 7: Faqja e videos

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Në këtë komponent do të shkruani html dhe ts.

Për këtë komponent ju do të siguroni lidhjen nga powToon për të luajtur videon dhe komponentin e komenteve

Hapi 8: Faqja e vlerësimit

Për këtë ju mund të kontrolloni imazhet e këtij hapi

për këtë komponent ju do të përdorni të njëjtin komponent video me një video të ndryshme në të cilën do të shpjegoni procesin e vlerësimit.

Pastaj thjesht keni një buton që lidhet me faqen konceptuale

Hapi 9: Faqja Konceptuale

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Në këtë faqe do të krijoni si html ashtu edhe ts.

• Krijoni dy komponentë video me një buton
• Krijoni një grup prej dy videosh me një "isCorrect" boolean
• Shkruani një funksion CheckScore ()
• Ngarko rezultatin në bazën e të dhënave
• Transporti në faqen tjetër

Hapi 10: Faqja metodologjike

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Në këtë faqe do të krijoni si html ashtu edhe ts.

• Ju do të përdorni dragula, për këtë lexoni dokumentet e dragula
• Krijoni një grup videosh
• Krijoni rendin e videove
• shkruani një Rezultat Kontrolli
• Ngarko Rezultatin
• Shkoni në faqen tjetër

Hapi 11: Faqja funksionale

Për këtë ju mund të kontrolloni imazhet e këtij hapi

Në këtë faqe do të krijoni si html ashtu edhe ts.

• Njësoj si faqja konceptuale do të keni butona dhe video si opsione.
• Në html shkruani një problem që përdoruesi ta zgjidhë
• Pastaj vendosni videot në një grup me një boolean "IsCorrect"
• Ngarko rezultatin në bazën e të dhënave

Hapi 12: Faqja e Hyrjes

Për këtë ju mund të kontrolloni imazhet e këtij hapi

• Krijoni html dhe ts
• Vendoseni imazhin në html
• Shkruani formën në html
• Paraqisni formularin në shërbimin e autoritetit
• Ruani përdoruesin në bazën e të dhënave

Hapi 13: Shkarkoni Kodin e Plotë të Përbërësve dhe Shërbimeve

Në rast se keni pasur probleme, këtu është rar me përbërësit dhe shërbimet