UI:Kodutöö 3

Kolmas praktikumitöö on jätk esimesele ja teisele praktikumile. Praktikumitöö põhieesmärk on realiseerida rakenduse põhifunktsionaalsus Vue komponentidena mis loevad andmeid staatilistest JSON failidest. JSON andmeobjektid loetakse Fetch API abil. See võimaldab lahus hoida front- ja backendi.

Vue asemel on lubatud kasutada ka Reacti või standardseid HTML komponente.

Töö peab esitamiseks olema paigutatud Dijkstra serverisse aadressile http://dijkstra.cs.ttu.ee/~Eesnimi.Perenimi/kasutajaliidesed/prax3/ kus Eesnimi.Perenimi on sinu kasutajatunnus arvutiklassides (suured/väikesed tähed õigesti, kui on lisanumbreid vms, siis need ka

Nõuded:

1. HTML rakendus vastab 2. praktikumitöö nõuetele, s.t võimaldab läbida loodava teenuse põhivoo algusest lõpuni, kus korduvad osad ja tsüklid on realiseeritud eraldiseisvate Vue komponentidena. (8p)
2. Rakenduse sisu vastab tegelikkusele, s.t. [Pilt], [Pealkiri] ja [Tekst] on asendatud tegeliku sisuga (2p)
3. Isegi kui tegelikku andmete salvestamist ei toimu on kogu sisend valideeritud. Vigast sisendit ei lubata salvestada ja kuvatakse kasutajale veateated, samuti teavitused õnnestunud sisendi puhul. (2p)
4. Kasutatud on mõnda välist Vue/Reacti teeki või komponenti, nt. kalender (1p)
5. Rakendus on ehitatud kasutades npm build-tööriistu (1p)
6. Rakendus on realiseeritud ühelehelise (single page) rakendusena (1p)

Nõuandeid ja soovitusi:

Kui rakendus töötab teie lokaalses serveris, aga dijkstras ei leia õiged pathe, siis määrake vue-router komponendis 'base' atribuutiks '/~uni-id/kasutajaliidesed/prax3' [1]. Vaikimisi suunab router linkidele juurkataloogis ehk base väärtus on '/', aga Dijkstra serveris paikneb teie teenus alamkataloogis. Näide:

 const router = new VueRouter({
   base: '/~Martin.Verrev/kasutajaliidesed/prax3/',
   routes: [
     { path: '/', component: Home },
     { path: '/login', component: Login },
     { path: '/about', component: About }
   ]
 })