ITI0209 kevad 2022 2. kodutöö kirjeldus - Redigeerimiste ajalugu

Verrev – 28. märts 2023, kell 06:28

2023-03-28T06:28:24Z

Verrev: /* Tähtajad */

2022-04-19T09:59:38Z

Tähtajad

Verrev: /* Tähtajad */

2022-04-17T13:40:38Z

Tähtajad

Verrev – 17. aprill 2022, kell 13:40

2022-04-17T13:40:13Z

Verrev – 8. aprill 2022, kell 09:19

2022-04-08T09:19:24Z

Verrev – 8. aprill 2022, kell 09:16

2022-04-08T09:16:23Z

Verrev – 11. märts 2022, kell 10:43

2022-03-11T10:43:41Z

Verrev: Uus lehekülg: 'Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasuta...'

2022-03-11T09:51:39Z

Uus lehekülg: 'Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasuta...'

Uus lehekülg

Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid.

Töö peab esitamiseks olema paigutatud Turing serverisse aadressile http://turing.cs.ttu.ee/~SINU_UNI_ID/iti0209. Lisaks sellele peab olema lähtekood TTÜ Gitlabis https://gitlab.cs.ttu.ee projekti ITI0209_2022 kaustas "html_proto".

'''Nõuded:'''

# HTML rakendus peab võimaldama läbida kasutajal loodava teenuse põhiflow algusest lõpuni. Rakenduses peab olema jälgitud joondust ja elementide paigutust, s.t isegi ilma eraldi stiilimata ei tohi elemendid olla nihkes ega koledad. Nii pildid kui sisutekstid peavad olema "päris" - mitte igal lehel, küll toote põhiflow-ga seotutel. '''See nõue on kohustuslik - ka ülejäänud kodutöö puntid saab arvestatud alles siis kui see on realiseeritud.''' (5p)
# Rakendus on realiseeritud mõnel CSS raamistiku standardkomponentidel - kursuse käigus kasutame Bootstrappi, aga lubatud on nt Semantic UI, Material CSS, Zepto vms. Ära hakka tekitama enda elemente vaid kasuta raamistikku sisseehitatuid. Kõigis eelnimestatud raamistikes on enamus elemente mida vaja peaks olema juba olemas. Oluline on valida õige element/komponent mida kasutada. Alustamiseks on hea kopeerida lähtekood näidetest, nt https://getbootstrap.com/docs/4.3/examples/ ja muuta vaateid vastavalt enda vajadustele. '''Inline-stiilide ja !important tagi kasutamine CSSis on keelatud.''' (2p)
# Loodud on stiiliraamat. Stiiliraamat on lingitud loodava rakenduse menüüsse ja kättesaadav lehelt `style_guide.html` (2p)
# Rakendus peab olema kasutatav nii desktopis kui mobiilis. Kui järgisid eelmist punkti, s.t. ehitasid rakenduse mõnele standardraamistikule siis suure tõenäosusega enam suuremaid lisategevusi tegema ei pea. (2p)
# HTML rakenduse flow ja elementide paigutus peab vastama 1 praktikumitöös joonistatud vaadetele. Kui realisatsiooni käigus selgub et joonistatud prototüüpi on keeruline või ebaotstarbekas sellisel kujul realiseerida, tuleb muudatused viia prototüüpi - s.t. HTML ja proto peavad kooskõlas olema. Võib juhtuda, et HTMLi tehes selgub, et päris nii nagu joonistatud on liiga keeruline või ebaotstarbekas. Sellisel juhul tuleb muuta staatilist protoüüpi. See tagab, et saame suhtuda staatilisse prototüüpi kui dokumentatsiooni. (1p)
# Rakendus peab olema stiilitud. Stiilimiseks tuleb kasutada CSS eelprotsessoreid - LESSi, SASSi vms. Standardkomponentide stiilimiseks lisage vaadetele oma stiilifail mis muudab värvid, fondid, jms. Kui enda stiilifail vaadetel küljest ära võtta peab rakendus olema ikkagi kasutatav, st. paigustus joondus jms peavad jääma paika. (1p)
# Loodavate lehtede HTML peab olema valideeruv. Valideerimiseks on kõige lihtsam kasutada Web Developer brauseripluginat (https://chrispederick.com/) Kui oled selle enda brauserile lisanud (töötab Firefoxis, Operas ja Chromes) vali sealt "Tools -> Validate Local HTML" oma koodi kontrollimiseks lokaalses arvutis ja "Tools -> Validate HTML" serverisse paigaldatud koodi vaatamiseks. (1p)
# Rakendus on arvestab vaegnägijate erisustega. (1p)

'''Soovitusi:'''

* Kasuta nii palju kui võimalik valitud raamistiku standardkomponente - kindlasti on vii ennast kurssi grid-iga, mis Bootstrapi puhul on dokumenteeritud siin: https://getbootstrap.com/docs/5.1/layout/grid/

* Jälgi joondust! Kui kasutad raamistiku standardkomponente siis 99.99% tõenäolisusega juhtub see automaatselt.

* Oma pilte kasutada on hea, aga nende väljaotsimine otsimine tülikas. Pildid saad katsetamise ajal lihtsalt lisada mõne pildiplaceholderite teenuse abil, näiteks https://picsum.photos/ või https://loremflickr.com/. Kas kohe või hiljem saad leida sobivad fotod mõnest vabavara-pildipangast, nt. Pexels.com

* Kõige lihtsam viis eelprotsessorite kasutamiseks on teha seda kasutades IDE sisseehitatud pluginaid. IntelliJ toodete puhul on hea õpetus siin: https://www.jetbrains.com/help/webstorm/transpiling-sass-less-and-scss-to-css.html Kui kasutate mõnda muud editori, oleks esimene samm leida LESS/SASS plugin. Juhul kui pluginat leida ei õnnestu, siis SASSi puhul on hea juhend siin: https://webdesign.tutsplus.com/tutorials/watch-and-compile-sass-in-five-quick-steps--cms-28275 ja LESSi puhul siin: https://www.npmjs.com/package/less-watch-compiler

@@ 1. rida: / 1. rida: @@
 == Tähtajad ==
-Kodutöö tähtaeg on 17. aprill. 18. aprilli päeval jagab õppejõud tööd hindamiseks kaastudengitele. Tagasiside andmise tähtaeg on teisipäev 21. aprill.
+Kodutöö tähtaeg on 17. aprill. 18. aprilli päeval jagab õppejõud tööd hindamiseks kaastudengitele. Töö esitamise vorm moodles on: https://moodle.taltech.ee/mod/assign/view.php?id=376904. Tagasiside andmise tähtaeg on teisipäev 21. aprill ja selle saab ülesse laadida siit: https://moodle.taltech.ee/mod/assign/view.php?id=376905. Kui tundub et on midagi puudu siis suhelge omavahel ja jagage kindlasti tagasisidet ka enne Moodlesse ülesselaadimist.
-Töö esitamise vorm moodles on: https://moodle.taltech.ee/mod/assign/view.php?id=376904
 Palun tehke nii et igast meeskonnast esitab töö ainult üks liige.
 Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid. Loodud keskkonnal peab olema "päris" sisu.

@@ 2. rida: / 2. rida: @@
 Kodutöö tähtaeg on 17. aprill. 18. aprilli päeval jagab õppejõud tööd hindamiseks kaastudengitele. Tagasiside andmise tähtaeg on teisipäev 21. aprill.
-Töö esitamise vorm moodles on: https://moodle.taltech.ee/mod/assign/view.php?id=368960
+Töö esitamise vorm moodles on: https://moodle.taltech.ee/mod/assign/view.php?id=376904
 Palun tehke nii et igast meeskonnast esitab töö ainult üks liige.

←Vanem redaktsioon		Redaktsioon: 17. aprill 2022, kell 13:40
1. rida:		1. rida:
		+	== Tähtajad ==
		+
		+	Kodutöö tähtaeg on 17. aprill. 18. aprilli päeval jagab õppejõud tööd hindamiseks kaastudengitele. Tagasiside andmise tähtaeg on teisipäev 21. aprill.
		+	Töö esitamise vorm moodles on: https://moodle.taltech.ee/mod/assign/view.php?id=368960
		+	Palun tehke nii et igast meeskonnast esitab töö ainult üks liige.
		+
		+
	Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid. Loodud keskkonnal peab olema "päris" sisu.		Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid. Loodud keskkonnal peab olema "päris" sisu.

←Vanem redaktsioon		Redaktsioon: 11. märts 2022, kell 10:43
1. rida:		1. rida:
−	Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid.	+	Esimese praktikumi käigus saite valmis ja valideerisite staatilise prototüübi. Teise praktikumitöö põhieesmärk on realiseerida staatiline prototüüp HTML lehtedena kasutades selleks standardraamistikke - nt. Bootstrappi mis võtaks aluseks loengus räägitud hea kasutajaliidese printsiibid. Loodud keskkonnal peab olema "päris" sisu.

	Töö peab esitamiseks olema paigutatud Turing serverisse aadressile http://turing.cs.ttu.ee/~SINU_UNI_ID/iti0209. Lisaks sellele peab olema lähtekood TTÜ Gitlabis https://gitlab.cs.ttu.ee projekti ITI0209_2022 kaustas "html_proto".		Töö peab esitamiseks olema paigutatud Turing serverisse aadressile http://turing.cs.ttu.ee/~SINU_UNI_ID/iti0209. Lisaks sellele peab olema lähtekood TTÜ Gitlabis https://gitlab.cs.ttu.ee projekti ITI0209_2022 kaustas "html_proto".

@@ 25. rida: / 25. rida: @@
 '''Soovitusi:'''
-* Kasuta nii palju kui võimalik valitud raamistiku standardkomponente - kindlasti on vii ennast kurssi grid-iga, mis Bootstrapi puhul on dokumenteeritud siin: https://getbootstrap.com/docs/5.1/layout/grid/
+* Kasuta nii palju kui võimalik valitud raamistiku standardkomponente - kindlasti on vii ennast kurssi grid-iga, mis Bootstrapi puhul on dokumenteeritud siin: https://getbootstrap.com/docs/5.3/layout/grid/
 * Jälgi joondust! Kui kasutad raamistiku standardkomponente siis 99.99% tõenäolisusega juhtub see automaatselt.

@@ 7. rida: / 7. rida: @@
 # HTML rakendus peab võimaldama läbida kasutajal loodava teenuse põhiflow algusest lõpuni. Rakenduses peab olema jälgitud joondust ja elementide paigutust, s.t isegi ilma eraldi stiilimata ei tohi elemendid olla nihkes ega koledad. Nii pildid kui sisutekstid peavad olema "päris" - mitte igal lehel, küll toote põhiflow-ga seotutel. '''See nõue on kohustuslik - ka ülejäänud kodutöö puntid saab arvestatud alles siis kui see on realiseeritud.''' (5p)
 # Rakendus on realiseeritud mõnel CSS raamistiku standardkomponentidel - kursuse käigus kasutame Bootstrappi, aga lubatud on nt Semantic UI, Material CSS, Zepto vms. Ära hakka tekitama enda elemente vaid kasuta raamistikku sisseehitatuid. Kõigis eelnimestatud raamistikes on enamus elemente mida vaja peaks olema juba olemas. Oluline on valida õige element/komponent mida kasutada. Alustamiseks on hea kopeerida lähtekood näidetest, nt https://getbootstrap.com/docs/4.3/examples/ ja muuta vaateid vastavalt enda vajadustele. '''Inline-stiilide ja !important tagi kasutamine CSSis on keelatud.''' (2p)
-# Loodud on stiiliraamat. Stiiliraamat on lingitud loodava rakenduse menüüsse ja kättesaadav lehelt `style_guide.html`. Stiiliraamatus peaksid olema kokku tõstetud ühele lehele teie poolt kasutuses olevad elemendid. Hea kirjeldus mis, on näiteks see: https://xd.adobe.com/ideas/process/ui-design/ui-style-guide-template/ (2p)
+# Loodud on stiiliraamat. Stiiliraamat on lingitud loodava rakenduse menüüsse ja kättesaadav lehelt `style_guide.html`. Stiiliraamatus peaksid olema kokku tõstetud ühele lehele teie poolt kasutuses olevad elemendid. Hea kirjeldus mis, on näiteks see: https://xd.adobe.com/ideas/process/ui-design/ui-style-guide-template/. [TBC] (2p)
 # Rakendus peab olema kasutatav nii desktopis kui mobiilis. Kui järgisid eelmist punkti, s.t. ehitasid rakenduse mõnele standardraamistikule  siis suure tõenäosusega enam suuremaid lisategevusi tegema ei pea.  (2p)
 # HTML rakenduse flow ja elementide paigutus peab vastama 1 praktikumitöös joonistatud vaadetele. Kui realisatsiooni käigus selgub et joonistatud prototüüpi on keeruline või ebaotstarbekas sellisel kujul realiseerida, tuleb muudatused viia prototüüpi - s.t. HTML ja proto peavad kooskõlas olema. Võib juhtuda, et HTMLi tehes selgub, et päris nii nagu joonistatud on liiga keeruline või ebaotstarbekas. Sellisel juhul tuleb muuta staatilist protoüüpi. See tagab, et saame suhtuda staatilisse prototüüpi kui dokumentatsiooni. (1p)