Lični projekat

5/1/2019

Raspored

Pretražite i organizujte raspored časova Mitrovačke Gimnazije

"Raspored" je napredna veb-aplikacija namenjena prikazu rasporeda časova za odeljenja Mitrovačke Gimnazije.

Inicijativa

Još od osnovne škole na poleđinu sveska smo lepili raspored časova kako bi redovno pregledali za koji časove treba da se pripremimo, neki su odlazili korak dalje i zapisali su i kada se koji čas završava i kada počinje sledeći.

Malo je onih koji svoje rasporede uče napamet, tako da problem traženja te jedne sveske gde se nalazi raspored preneo i u srednju školu. Srećom, u Mitrovačkoj Gimnaziji postoji digitalni zapis rasporeda časova na veb-sajtu škole.

Učenici bi preuzeli svoj raspored i sačuvali ga u galeriju ili stavili kao pozadinu na zaključanom ekranu svoga telefona. Кako ove metode nisu efikasne (dovoljno) i imajući u obzir da je bilo neophodno da korisnik sam preuzme novi raspored ukoliko se izvrši neka promena ili ukoliko želi videti neki drugi raspored, došao sam na ideju da napravim aplikaciju koja bi radila upravo to, a laka instalacija i pristup je baš ono što je neophodno ovako jednostavnoj usluzi kako bi se izbeglo frustriranje korisnika.

Slika projekta

Realizacija

Nabavljanje svih rasporeda

Кako bih uštedeo na veličini sajta, umesto PNG datoteka sa sajta, preuzeo sam dve PDF datoteke sa rasporedima za učenike i profesore sa sajta gimnazije. Slike moraju biti vektorskog formata kako bi sajt bio ispod 5MB (Što sam sebi postavio kao cilj ovog projekta).

Prikaz PDF stranica je mnogo komplikovaniji nego prikaz recimo SVG slike, tako da sam konvertovao oko 97 stanica PDF-a u posebne SVG datoteke. U poređenju sa PNG datotekama, SVG je zauzimao oko 80% manje mesta.

“Vue.js” – Javaskript okvir

Da bi pojednostavio proces razvijanja i kako bi umanjio nepotreban rad na standardne veb-principe, odlučio sam da aplikacija razvijam u modularnom okviru zvanom „Vue.js”.

Butstrep – Stil i kontrole

Za dizajniranjem posebnih kontroli i stilova u ovakvom projektu nije bilo potrebe, sve je lako regulisano korišćenjem Butstrep biblioteke kontroli i stilova.

Pored standardnih stilova, korišćene su i sledeće kontrole:

  • Dugme,
  • Modal (iskočna poruka)
  • Formular opcije
    • Grupe,
    • Radio dugme,
    • Selektor element,
    • Input element,
    • Dugme na štikliranje

Pomenuti elementi su dodati u „main.js” datoteci projekta. Butstrep isecak

Fajerbejs – Hosting i servisiranje

Radi brzine distribucije i lakog održavanja servera, za hosting je izabran servis Gugl Fajerbejs koji nudi besplatni veb-hosting i podržava sve potrebne standarde za „PWA“ tehnologiju.

Upotreba i performanse

Gugl Lajthaus

Gugl lajthaus ocena

Кorišćenjem Gugle alatke za testiranje performansi i kompatibilnosti veb-aplikacija projekat raspored postiže sledeće rezultate:

Pristupačnost

Optimizovano 91% (ovo poglavlje je jedino koje ne dostiže 100% - glavni razlog tome je što Butstrep dugmad ispod prikaza rasporeda imaju istu pozadinu kao i veb-stranica, ali to ne bi trebalo da predstavlja problem jer imaju jasnu boju ivica – prilog 4 i prilog 6)

Dostupnost

Aplikacija „Raspored“ se nalazi na domenu rs.draganovik.com rs.draganovik.com, a izvorni kod rada je postavljen i na GitHub mreži.