Merliti- Ülesanne on valmis

Pärast kahte nädalat VueJS õppimist olen jõudnud soovitud tulemuseni.

Vue JS õppimisel pidin endale selgeks tegema ka kuidas kasutada NPM (Node Package Manager) ja CLI (Command Line Client e. käsurea liidest).

Nagu eelmises postituses mainitud siis Vue on JavaScripti raamistik

„Vue.js (ka Vue) on arvutiteaduses vaba JavaScripti raamistik, millega luuakse kasutajaliideseid.[1] Integreerimine projektidesse, mis kasutavad teisi JavaScripti teeke, on lihtsustatud Vuega, sest see on disainitud olema järk-järgult kasutuselevõetav. Vue toimib ka veebirakenduse raamistikuna, võimaldades luua arenenud üheleheküljelisi rakendusi.“(Vikipeedia)

Kõige keerulisem oli selgeks saada kuidas Vue-d lihtsalt ja loogiliselt oma olemas oleva projektiga siduda, nii et kõik komponendid töötaksid. Teoorias peaks see lihtne olema, aga kuna enamus õpetusi olid pigem uue Vue projekti loomisest ja selle kaudu veebirakenduse või lehe arendamisest, siis oli see minule suur katsumus ja hea õppekoht.

Kuna Vue kasutab komponentide süsteemi ja iga komponent on omaette fail, siis pidin tõsiselt mõtlema, kuidas oma kausta struktuur luua ja kuidas mingid komponendid omavahel suhtlevad ja mis failid omavahel ühenduvad.

Minu ülesanne oli kuvada andmebaasis olev info (mis paikneb serveris) veebilehele, siis nende omavaheline sidumine oli kõige keerulisem ja aeganõudvam protsess, et sobiv lahendus leida.

Kui aga back-end ja front-end omavahel ühendatud, ja PHP sai aru, mis infot ma talle üritan saata, tuli ainult vastavad MySQL käsud mõelda.

Adminipaneeli idee seisnes selles, et lehe administraator saaks minu eelnevalt loodud tracking-tooli’ga andmebaasi salvestatud andmeid kuvada tabelikujul ja vajadusel ka sorteerida.

Näiteks, kui administraator tahab vaadata, kus lehel on kõige kauem üks kasutaja olnud või soovib ta, et andmed oleks järjestatud kõige varajasema sissekande järgi.

Selleks tuli veebilehele luua iga käsukohta nupp, mis saadaks info serverile (JavaScript), ning server teaks milline MySQL-i päring (PHP) veebilehele tagasi saata.

(Piltidel olev andmebaas ja funktsionaalsus on eelkõige loodud testimiseks)