Fakulteta za raˇ cunalniˇ stvo in informatiko
Aljaˇz Jazbec
Razvoj spletne aplikacije za upravljanje projektov za manjˇ sa
podjetja
DIPLOMSKO DELO
UNIVERZITETNI ˇSTUDIJSKI PROGRAM PRVE STOPNJE
RA ˇCUNALNIˇSTVO IN INFORMATIKA
Mentor : izr. prof. dr. Tomaˇ z Hovelja
Ljubljana, 2022
javo in koriˇsˇcenje rezultatov diplomske naloge je potrebno pisno privoljenje avtorja, Fakultete za raˇcunalniˇstvo in informatiko ter mentorja.
Besedilo je oblikovano z urejevalnikom besedil LATEX.
Tematika naloge:
Kandidat naj razvije aplikacijo za vodenje projektov v manjˇsih podjetjih.
Najprej naj analizira trg aplikacij za vodenje projektnega dela v podjetjih.
Pri tem naj se osredotoˇci na aplikacije, ki so primerne predvsem za manjˇsa podjetja. Na podlagi pregleda funkcionalnosti obstojeˇcih aplikacij ter zajema zahtev v podjetju, ki bo razvito aplikacijo testiralo, naj doloˇci nabor funk- cionalnosti lastne aplikacije za vodenje projektov. Nato naj tako aplikacijo razvije in testira.
Povzetek Abstract
1 Uvod 1
2 Analiza trga 3
2.1 Predstavitev konkurenˇcnih reˇsitev na trgu . . . 3 2.2 Predstavitev identificiranih funkcionalnosti v analizi konku-
renˇcnih izdelkov . . . 11
3 Zajem zahtev v podjetju 19
4 Doloˇcitev konˇcnih funkcionalnosti in arhitektura aplikacije 23 4.1 Konˇcne funkcionalnosti . . . 23 4.2 Opis ER-diagrama . . . 27 4.3 Uporabljeni arhitekturni vzorec . . . 33
5 Razvoj aplikacije 35
5.1 Predstavitev orodij . . . 35 5.2 Kljuˇcni izzivi programiranja . . . 39
6 Odzivi uporabnikov 45
7 Zakljuˇcek 49
kratica angleˇsko slovensko
CSS Cascading Style Sheets Slogovna predloga na spletni strani, v kateri je zapisana oblika spletne strani
HTML HyperText Markup Language Oznaˇcevalni jezik za oblikova- nje veˇcpredstavnostnih doku- mentov
PHP Hypertext Preprocessor Sploˇsno uporaben skrip- tni programski jezik, ki ga tolmaˇci streˇznik
MoSCoW A prioritization technique: M - Must have S — Should have C — Could have W — Won’t have
Tehnika doloˇcanja prioritet:
M - naj bo nujno, S — naj bi bilo, C — lahko bi bilo, W
— ne bo
AI Artificial Intelligence Umetna inteligenca
PW Progress view Napredek projekta
API Application Programming In- terface
Aplikacijski programski vme- snik
URL Uniform Resource Locators URI, ki opredeli naslov vira
Naslov: Razvoj spletne aplikacije za upravljanje projektov za manjˇsa pod- jetja
Avtor: Aljaˇz Jazbec
V diplomskem delu smo se usmerili v razvoj prototipa spletne aplikacije za pomoˇc podjetjem pri upravljanju projektov za podjetja z majhnim ˇstevilom zaposlenih. Pregledali smo trg aplikacij za upravljanje in vodenje projektov ter doloˇcili najprimernejˇse funkcionalnosti za mala podjetja. Hkrati smo zbrali zahteve podjetja, za katerega se je aplikacija razvila, te zahteve smo nato zdruˇzili s zahtevami, ki smo jih pridobili iz analize trga. Aplikacija vsebuje moˇznost sprejemanja novih projektov, razdeljevanje projektov na naloge, predajo nalog zaposlenim in merjenje dolˇzine dela, ki ga opravi vsak zaposleni pri doloˇceni nalogi. Podjetju daje moˇznost nadzora nad dejavnostjo zaposlenih in njihovo zasedenostjo, hkrati je vkljuˇcen tudi spletni sistem za video konference in moˇznost komentiranja posameznih nalog, kar daje uporabnikom moˇznost hitrega komuniciranja.
Kljuˇcne besede: vodenje projektov, spletna aplikacija, nadzor nad delom.
Title: Development of Project Management Web Application for Small Busi- nesses
Author: Aljaˇz Jazbec
In the diploma thesis, we have developed a prototype of a project manage- ment web application for small enterprises. We have analyzed the market of project management applications to identify the most appropriate func- tionalities for small businesses. We have also acquired the requirements of the company for which this application was developed, adding them to those obtained from the market analysis. The developed web application provides the option to create new projects, divide projects into tasks, and assign them to a suitable employee. Besides all of that, it can also track the time that an employee needs to finish a specific task. It gives the company the power to monitor employees’ activity and their occupancy. We also developed a functionality that enables users to video call each other and add comments into the comment section at each task.
Keywords: project management, web application, supervision of work.
Uvod
Uspeˇsno upravljanje ˇcasa je zelo pomembno tako za uspeˇsnost podjetja kot tudi posameznika. Velika veˇcina podjetij (veˇcjih in manjˇsih) ˇze uporablja digitalne pripomoˇcke pri vodenju projektov. Nujno je, da so orodja funkcio- nalno prilagojena velikosti podjetja, za katero je namenjeno. Kot so raziskali Turner, Ledwith in Kelly [31], so za manjˇsa podjetja kljuˇcna preprosta orodja za opravljanje projektov. To pomeni, da imajo orodja na voljo veˇcinoma samo osnovne funkcionalnosti. Kljuˇcno se je osredotoˇciti na funkcionalnost zajema zahtev strank in dodati funkcionalnosti, ki omogoˇcajo podporo za izpolnitev strankinih zahtev. Evropska unija in njene ˇclanice so prepoznale pomembnost digitalizacije in digitalne preobrazbe ter se dejavno usmerjajo k njeni izvedbi in pospeˇsitvi [22]. Zato je za podjetja zelo pomembno, da imajo na razpolago ustrezno programsko opremo, ki jim lahko omogoˇci hitrejˇso in jasnejˇso organizacijo dela ter izpolnitev zahtev po digitalizaciji.
Namen diplomskega dela je bil izdelati prototip spletne aplikacije, ki temelji na programskih jezikih PHP, HTML in CSS ter izpolnjuje zahteve, zbrane pri naroˇcniku (podjetju). Hkrati vsebuje vse pomembne funkcionalnosti, ki jih ponujajo konkurenˇcni izdelki na svetovnem trgu.
Cilj diplomskega dela je razviti aplikacijo za vodenje projektov, ki bo podje- tjem pomagala pri boljˇsi poslovni uspeˇsnosti in jim omogoˇcila boljˇsi nadzor nad potekom in porazdelitvijo dela.
1
Razvoj aplikacije je potekal z naslednjimi koraki:
1. analiza trga aplikacij za vodenje projektov, 2. zajem zahtev v podjetju,
3. doloˇcitev funkcionalnosti in arhitekture aplikacije, 4. razvoj aplikacije,
5. testiranje aplikacije.
Pri prvem koraku bomo predstavili vsako od analiziranih aplikacij ter pouda- rili njene pozitivne in negativne lastnosti. Predstavimo vse funkcionalnosti, ki smo jih analizirali in prikaˇzemo koliko od teh funkcionalnosti je implemen- tiranih v posamezni aplikaciji s pomoˇcjo tabele.
V drugem koraku bomo predstavili funkcionalnosti, ki smo jih zajeli v pod- jetju in jih razvrstili po pomembnosti. Pri tem bomo uporabili metodo Mo- SCoW, ki je glede na ˇclanek[10] odliˇcna zaˇcetna toˇcka za doloˇcanje prioritet zahtev, porabi malo ˇcasa, je preprosta za razumevanje in daje bralcu hiter vpogled v rang prioritet zahtev. Ker so prioritete zahtev med seboj neodvi- sne, se lahko brez teˇzav naknadno dodajajo nove zahteve.
Tretji korak predstavlja doloˇcitev funkcionalnosti aplikacije na podlagi ana- lize trga in na podlagi internega zajema zahtev v podjetju. Opredelimo, katere funkcionalnosti smo se odloˇcili razviti in zakaj. Dodamo ER-diagram arhitekture aplikacije in ga predstavimo, predstavimo tudi uporabljen arhi- tekturni vzorec.
Korak razvoja aplikacije razdelimo na dva dela: predstavitev orodji in pred- stavitev kljuˇcnih izzivov programiranja. V prvem opiˇsemo in predstavimo uporabljena orodja (knjiˇzice, programsko opremo, ...), v delu kljuˇcnih izzi- vov pa predstavimo dele razvoja, ki so nam povzroˇcali najveˇc teˇzav in vzeli najveˇc ˇcasa.
V zadnjem koraku — testiranje aplikacije, predstavimo odzive uporabnikov pri testni - pilotski uporabi, njihove predloge za izboljˇsave in njihovo sploˇsno mnenje.
Analiza trga
V tem poglavju bomo opisali 17 najbolj znanih aplikaciji oziroma orodij za projektno vodenje in njihov osnovni namen. Aplikacije se razlikujejo glede na namen — za velika ali mala podjetja in po ˇstevilu funkcionalnosti. Hkrati je naˇs cilj, da ugotovimo, katere so skupne funkcionalnosti vsem aplikacijam in bi jih naˇsa aplikacija nujno potrebovala, katere so manj pomembne in katere po naˇsem mnenju manjkajo in bi jih bilo smiselno dodati.
Naˇsa konˇcna aplikacija bo namenjena manjˇsim podjetjem, vendar kljub temu analiziramo tudi aplikacije (orodja), ki so namenjene veˇcjim podjetjem. S tem ˇzelimo pridobiti celovito predstavo o dogajanju na trgu, kar nam bo v naslednjem koraku omogoˇcalo laˇzjo doloˇcitev potrebnih funkcionalnosti.
2.1 Predstavitev konkurenˇ cnih reˇ sitev na trgu
Spodaj so najprej predstavljene analizirane aplikacije. Pri vsaki smo povzeli kljuˇcne in posebne lastnosti ter poudarili manjkajoˇce funkcionalnosti.
2.1.1 Monday.com Project Management
Monday.com je odliˇcno orodje, namenjeno uporabi za mala in srednje velika podjetja, ker ima intuitiven in na videz prijeten uporabniˇski vmesnik. Pred- nost vmesnika so zelo samoumevna imena elementov. Vmesnik ima podobo
3
preglednic in je preprosto razumljiv tudi za nove uporabnike [25].
Ima moˇznost izboljˇsanja sodelovanja med uporabniki (collaboration fe- atures), hkrati je zelo vsestransko in prilagodljivo orodje. Sploˇsno gledano je Monday.com zelo ugoden, hkrati je med dostopnimi naˇcrti in robustnimi funkcionalnostmi teˇzko najti boljˇso reˇsitev za projektno vodenje [15].
Monday.com je na voljo v ˇstirih paketih: osnovni (basic) — je name- njen predvsem podjetjem, ki ˇsele zaˇcenjajo svojo pot v svetu podjetniˇstva (startup-om), standardni (standard) — je namenjen srednje velikim podje- tjem, saj ima omejeno ˇstevilo akcij na mesec (250), profesionalni (pro) — je namenjen vsem veˇcjim podjetjem, za zelo velike multinacionalke je namenjen paket enterprise.
2.1.2 Asana
Asana je bolj osredotoˇcena v produktivnost in sodelovanje kot v samo upra- vljanje projektov. Predvsem zaradi manjka vgrajenega sledilnika ˇcasa in naprednih ˇcasovnic projektov, ki sta nujna za ohranjanje velikih projektov v predvidenem ˇcasovnem naˇcrtu. Vendar je Asana odliˇcna pri upravljanju nalog, saj ima zelo intuitiven in prilagodljiv uporabniˇski vmesnik, ki olajˇsa delo vsaki skupini uporabnikov [8].
Asana je primerna tako za velika kot tudi mala podjetja, vendar je naj- primernejˇsa za podjetja, ki potrebujejo platformo za dobro upravljanje nalog in ne potrebujejo vgrajenih funkcij za naˇcrtovanje proraˇcuna ali obraˇcuna plaˇc [11].
2.1.3 Hubstaff Tasks
Hubstraff Task uporablja Kanban pogled tabele (Kanban-board style), kjer se zelo dobro in nazorno v centralnem pogledu vidijo vsi projekti, ljudje in pro- cesi. Omogoˇca uporabo sprintov, tako da je v vsakem trenutku, vsak uporab- nik seznanjen z nalogo, na kateri mora delati. Orodje ima ˇstevilne vgrajene komunikacijske kanale, s ˇcimer poveˇca jasnost in komunikacijo. Predvsem
omogoˇca oddaljenim (remote) skupinam, da komunicirajo uˇcinkoviteje in s tem dvigne njihovo produktivnost [23].
V analizi smo ugotovili, da orodje ne vsebuje odprtega API-ja (za vzpo- stavite povezave z zunanjimi orodji), namenjenega strankam. Od projektnih pogledov vsebuje samo kanban prikazno ploˇsˇco (dashboard) in koledar. Za uporabnike je na voljo le spletna aplikacija.
2.1.4 Todoist
Todoist zaradi pomanjkanja naprednih pogledov in funkcionalnosti ne spada med najboljˇsa orodja na tem podroˇcju. Je zelo omejeno orodje, zato ni najboljˇse orodje za velike projekte. Kljub temu odliˇcno opravi opravila za katera je namenjen (seznam nalog in pod-nalog, ter obvestila in opozorila o bliˇzajoˇcih se skrajnih datumih). Zato je zelo primeren za manjˇsa podjetja.
Je tudi eno izmed najboljˇsih orodij za upravljanje projektov preko telefona [19].
V analizi smo ugotovili, da orodje ne vsebuje gantograma, vendar ga je mogoˇce dodati z zunanjo razˇsiritvijo (ganttify). Za ˇcasovno sledenje je na voljo povezava z zunanjo razˇsiritvijo (Time Doctor), avtomatizacijo nalog pa omogoˇca prav tako zunanja razˇsiritev (IFFT). Na voljo je vnos naravnega jezika (Quick Add) — ki omogoˇca, da se z vnosom besed v vrstico doda naloga, doloˇci njen skrajni rok, oznaka in prioriteta ter se jo doda k projektu ali sekciji. Prav tako jo je preko te funkcionalnosti moˇzno dodeliti sodelavcu.
2.1.5 Zoho Projects
Zoho Projects ponuja v veˇcini samo osnovne funkcionalnosti. Zoho je to orodje povezal s svojimi ostalimi orodji (CRM, Finance, Mail, ...), s ˇcimer je uporabnikom, ki uporabljajo pisarno Zoho, delo zelo olajˇsano (podobno kot Microsoft Office), vendar je uporabnost izdelka za uporabnike, ki celotne ponudbe izdelkov ne uporabljajo, moˇcno zmanjˇsana [18].
V analizi smo ugotovili, da ima orodje na razpolago razliˇcne aplikacije za
dostop, in sicer: spletno in mobilno (iOS in Android) aplikacijo, medtem ko namizna aplikacija za raˇcunalnik ni podprta. Orodje kot eno izmed redkih ponuja ogled zemljevida (map chart) in AI-pametnega asistenta — Zia, ki v glavnem sluˇzi kot “chat bot”, ki odgovori na uporabnikovo vpraˇsanje ali zahtevo, kot je npr: “Zia, kreiraj nov projekt, ...”.
2.1.6 Teamwork
Teamwork je impresivna platforma za vodenje projektov in sodelovanje. Odliˇcen je tako za velika kot mala podjetja. Aplikacija dovoljuje, da se k projektom poveˇze stranke in se jim doda dostop, da lahko vidijo napredek in tudi sode- lujejo pri komunikaciji [6].
V analizi smo ugotovili, da ima orodje na razpolago razliˇcne aplikacije za dostop, in sicer: spletno in mobilno (iOS in Android) aplikacijo, medtem ko namizna aplikacija za raˇcunalnik ni podprta.
2.1.7 GanttPro
GanttPro je spletno usmerjena reˇsitev za upravljanje in vodenje projek- tov, ki temelji na Gantogramu, ki poskrbi, da ostane naˇcrtovanje prepro- sto, ˇclani ekipe povezani in stranke vkljuˇcene. Platforma pomaga prihra- niti ˇcas pri naˇcrtovanju in upravljanju, veˇcji uˇcinkovitosti ekipe, zmanjˇsanju podaljˇsevanja skrajnih rokov projektov in omogoˇca prihranek pri izdatkih projekta pri projektnem vodenju [28].
V analizi smo ugotovili, da orodje nima pregledne prikazne ploˇsˇce (da- shboard), ne omogoˇca povezave z zunanjimi koledarji (moˇzen je samo izvoz dogodkov v zunanji koledar), za dostop je na voljo le spletna aplikacija.
2.1.8 TeamGantt
Kljub svojemu imenu ima TeamGantt na voljo veliko veˇc funkcionalnosti kot zgolj gantograme. Orodje vsebuje vse znane funkcionalnosti za upravljanje nalog, deljene ekipnih koledarjev, povezovanje ekipe, poroˇcila, ... Orodje
je primerno tako za manjˇsa kot velika podjetja, v vseh panogah industrije, vendar je zaradi visoke cene morda bolj priporoˇcljiv za veˇcja podjetja [17].
V analizi smo ugotovili, da ima orodje na razpolago razliˇcne aplikacije za dostop, in sicer: spletno in mobilno (iOS in Android) aplikacijo, medtem ko namizna aplikacija za raˇcunalnik ni podprta.
2.1.9 Kissflow Project
Kissflow project je intuitiven za uporabo, zato je namenjen tudi ljudem, ki nimajo izkuˇsenj z vodenjem projektov. Nudi ˇstiri vrste upravljanja: upra- vljanje delovnih tokov (workflow management), upravljanje posameznih na- log (case management), upravljanje projektov in komunikacijo. Orodje je primerno za uporabo tako v velikih, kot v malih podjetjih. [12].
V analizi smo ugotovili, da ima orodje za projektni pogled na voljo se- znam, ki v doloˇceni meri nadomeˇsˇca koledar, kanban pogled in pogled ma- trike, ki je alternativa gantogramu. Orodje ima na voljo rest API za vzpo- stavitev povezave z zunanjimi orodji. Za dostop je na voljo samo spletna aplikacija.
2.1.10 Wrike
Wrike se primarno osredotoˇca na povezovanje zaposlenih in strank. Je dobro zaokroˇzena celota, namenjena predvsem srednjim in velikim podjetjem zaradi visoke cene. Wrike je osredotoˇcen na agilni pristop — projekt razdeli na manjˇse naloge in spodbuja stalno sodelovanje [7].
V analizi smo ugotovili, da ima orodje na voljo ˇsirok spekter povezlji- vosti z zunanjimi orodji preko vmesnika Wrike Integrate. Orodje ponuja tudi moˇznost pametnega naˇcrtovanja (samodejno dodeljevanje datumov na projektu) — Dates Rollup in AI-pametnega asistenta Risk Prediction — ki uporabnika opozori na morebitne nevarnosti za preseˇzek skrajnih rokov in tem nevarnostim dodeli raven (majhna, srednja, velika).
2.1.11 Trello
Trello je ena izmed najbolj intuitivnih kanban aplikacij, saj omogoˇca po- ljubno prilagajanje tabele, ki jih uporabnik ustvari. Omogoˇca komunikacijo med ˇclani lastne ekipe in tudi z zunanjimi sodelavci. Ni najprimernejˇsa apli- kacija za tradicionalen naˇcin vodenja projektov. V osnovi je namenjen laˇzjim projektom, saj ne nudi tradicionalnih funkcionalnosti, kot je gantogram [5].
V analizi smo ugotovili, da ima orodje na voljo projektna pogleda kanban in koledar, namesto gantograma pa ima njegov pribliˇzek (Timeline view).
Funkcionalnost merjenja ˇcasa pri posamezni nalogi je na voljo le kot povezava z zunanjimi orodji. Vnos naravnega jezika je prav tako na voljo kot povezava z zunanjim orodjem Zapier. Trello ima na voljo tudi AI-pametnega asistenta
— suggested actions, ki uporabniku ponudi akcije, ki jih pogosto uporablja, v pravem trenutku.
2.1.12 Toggl Plan
Toggl plan je bil prvotno ustvarjen, ker so bili uporabniki naveliˇcani naˇcrtovanja v tradicionalnih gantogramih. ˇZeleli so reˇsitev, ki je bolj prilagodljiva in od- pornejˇsa na napake. Njegova prednost je, da je preprosto orodje, kar pomeni, da ima na voljo veˇcinoma osnovne funkcionalnosti. V primerjavi z veliko veˇcino ima malo funkcionalnosti, ki so namenjene toˇcno temu, da uporabnik pridobi pregled nad svojim delom in sledi napredku projektov. Orodje je v osnovi namenjeno podjetjem vseh velikosti, vendar je zaradi svoje preprosto- sti in namembnosti primerno predvsem za ekipe, ki uporabljajo agilni pristop [13].
V analizi smo ugotovili, da orodje nudi sledilnik ˇcasa, ki je na voljo kot interna povezava z orodjem Toggl Track, avtomatizacija je na voljo le kot povezava z zunanjimi orodji, npr. Week plan integrations.
2.1.13 ProofHub
ProofHub zadosti zahtevam tako velikih kot malih podjetij. Orodje nudi pro- jektnim vodjem od pomoˇci pri naˇcrtovanju in organizacij dela do upravljanja in dostavljanja ciljev pravoˇcasno. Omogoˇca osrednjo povezavo med ekipami in strankami za uˇcinkovitejˇso komunikacijo in hitrejˇse odzive [2].
2.1.14 Jira Software
Jira je najbolj znana po tem, da jo v veˇcji meri uporabljajo ekipe, ki razvijajo programsko opremo, vendar se je orodje v zadnjem ˇcasu preusmerilo tako, da je namenjeno ˇsirˇsim vrstam ekip, ki potrebujejo koordinacijo in komunikacijo na projektu. V osnovi je bila aplikacija narejena za ekipe, ki uporabljajo agilni pristop, predvsem metodo Scrum. Zaradi svoje visoke cene pri ekipah nad 10 zaposlenih se priporoˇca predvsem za male ekipe — do 10 ljudi [16].
V analizi smo ugotovili, da orodje ne vsebuje projektnih pogledov ganto- gram in koledar, vendar namesto njiju ponuja skupen pogled (Roadmaps), ki ponuja “ˇsiroko sliko” za laˇzje naˇcrtovanje velikih nalog veˇc mesecev v naprej.
Za dostop do orodja sta na voljo mobilna aplikacija (iOS, Android) in spletna aplikacija. Za uporabnike je na voljo tudi AI-pametni asistent “smarts”, ki predvidi, katerega uporabnika ˇzeli uporabnik dodeliti k nalogi in nudi “pame- tne filtre”, ki uporabniku ponudijo moˇznost filtriranja prikazanih rezultatov.
2.1.15 Microsoft Project
Microsoft Project je klasiˇcna aplikacija za upravljanje projektov. V primer- javo s konkurenco, ki je usmerjena v spletne aplikacije, je MS Project usmer- jen v namizno aplikacijo, ki je del ˇsirˇse druˇzine Office. Je zelo zmogljiva aplikacija, z vsemi funkcionalnostmi, ki so potrebne za projektno vodenje in upravljanje. Aplikacija je primernejˇsa za velika podjetja tudi zato, ker za mala podjetja ni na voljo brezplaˇcne razliˇcice [20].
V analizi smo ugotovili, da orodje vsebuje vse tri projektne poglede, ven- dar namesto klasiˇcnega kanban pogleda vsebuje tako imenovani Task board
view, ki je v osnovi namenjen naˇcrtovanju sprintov. Namesto prikazne ploˇsˇce (dashboard) ima na voljo poroˇcila (reports). Za dostop do aplikacije so na vo- ljo mobilna aplikacija (iOS, Android), spletna aplikacija in namizna aplikacija
— samo za Windows. Posameznih nalog ni moˇzno komentirati neposredno v MS Projectu, vendar je moˇzno vzpostaviti povezavo z orodjem MS Teams in razpravo zaˇceti tam.
2.1.16 Slack
Slack je oblaˇcna storitev za izmenjavo sporoˇcil znotraj ekipe. Ima moˇznost poˇsiljanja sporoˇcil v realnem ˇcasu ter glasovnih in video konferenc. Ima moˇznost integracije s produktivnimi aplikacijami, kot so Google Drive in Asana, ne da bi uporabnik moral preklopiti med zavihki (zato spada med orodja za projektno vodenje, v svoji osnovi pa je namenjen le kot orodje za sodelovanje), da lahko ˇclani ekipe nemoteno komunicirajo. Namenjen je podjetjem vseh velikosti [24].
V analizi smo ugotovili, da orodje ne vsebuje projektnih pogledov, ven- dar se lahko poveˇze z zunanjimi orodji, ki te poglede ponujajo. Prav tako v osnovi ne podpira moˇznosti ˇcasovnega sledenja, vendar ima na voljo po- vezavo z zunanjim orodjem — TrackingTime. Slackove prikazne ploˇsˇce so namenjene zgolj sporoˇcilom in komunikaciji. Uporabnikom je na voljo AI- pametni asistent — AI bot, ki ga uporabnik lahko poljubno reprogramira, nudi pomoˇc pri procesiranju dejavnosti v komunikacijskem kanalu, objavi avtomatiziranih sporoˇcil in avtomatizaciji nalog.
2.1.17 Basecamp
Basecamp je spletno orodje za sodelovanje (collaboration tool), ki omogoˇca uporabnikom, da opravljajo svoje delo povezani in komunicirajo en z drugim.
Zaradi pomanjkanja naprednih funkcionalnosti je primeren za manjˇsa podje- tja, ki teh funkcionalnosti ne potrebujejo. Zaradi manjkajoˇcega gantograma poteka upravljanje projektov drugaˇce kot v klasiˇcnih aplikacijah za projektna
vodenja [4].
V analizi smo ugotovili, da orodje ne vsebuje projektnega pogleda — gantograma, nima vgrajenega ˇcasovnega sledenja, vendar se lahko poveˇze z zunanjimi orodji, kot je Toggl Track. Prav tako nima vgrajene avtomatizacije oziroma prikazne ploˇsˇce, vendar lahko tudi to pridobi s povezavo z zunanjimi orodji, kot je Jira oziroma Weekdone. V osnovi ni namenjen za podporo agilnim pristopom vodenja projektov.
2.2 Predstavitev identificiranih funkcionalno- sti v analizi konkurenˇ cnih izdelkov
Najprej bomo naˇsteli in na kratko opisali funkcionalnosti, na katere smo bili pozorni med analizo. Le-te bodo nato v nadaljevanju vkljuˇcene v tabeli primerjave funkcionalnosti med aplikacijami.
1. Razliˇcni projektni pogledi:
moˇzni projektni pogledi so kanban, gantogram in koledar.
2. Dnevni ali ˇsirˇsi meseˇcni pogled:
uporabnik lahko izbira med razliˇcnimi stopnjami pogleda (minimalni
— dnevni pogled, ˇsirˇsi — meseˇcni pogled).
3. Sledilnik ˇcasa:
merjenje koliˇcine ˇcasa, porabljenega pri doloˇceni nalogi ali celotnem projektu.
4. Avtomatizacija ponavljajoˇcih se nalog:
avtomatiˇcno izvrˇsi ponavljajoˇce se naloge, kot je na primer poˇsiljanje elektronskega sporoˇcila zaposlenim na doloˇceno ˇcasovno periodo.
5. Povezljivost z zunanjimi orodji:
prek API-ja ali prek vgrajenih vmesnikov z aplikacijami, kot sta na primer (gmail, orodje za sledenje ˇcasa, ...).
6. Predloge za zaˇcetek projektov 7. Preprostost uporabe:
ekipa brez izkuˇsenj uporabe tega orodja, ga osvoji in uporablja v zelo kratkem ˇcasu.
8. Prikazna ploˇsˇca z ˇzivimi podatki:
prikazna ploˇsˇca (dashboard) ima vse pomembne in aktualne informacije na enem mestu, s ˇcimer omogoˇci preglednost.
9. Naˇcrtovanje razpoloˇzljivosti:
vodje projektov lahko vidijo spremembe razpoloˇzljivosti zaposlenih v ˇzivo, kar jim omogoˇca, da laˇzje ustrezno razporedijo razpoloˇzljiva sred- stva.
10. Odvisnost nalog:
naloga je odvisna od konˇcanja predhodne/predhodnih naloge/nalog.
Primer: postavitev spletne strani je odvisna od konˇcnega naˇcrta oblike (designa) spletne strani.
11. Video sporoˇcila:
video sporoˇcilo se lahko deli s sodelavci, kar lahko zmanjˇsa potrebo po ne-nujnih sestankih.
12. Povezava z zunanjimi koledarji:
gre za posebne vrste povezav z zunanjimi orodji, kjer se lahko podatki sinhronizirajo in prenaˇsajo med razliˇcnimi koledarji.
13. Delovanje na mobilnih, namiznih in spletnih aplikacijah:
mobilni aplikaciji (Android, iOS), namizni aplikaciji (Windows, Ma- cOS).
14. Pregled napredka projekta:
pri projektu ali nalogi je prisotna oznaka napredka (progress bar), ki oznaˇcuje odstotek, na katerem se naloga ali projekt trenutno nahaja.
15. Bliˇznjice na tipkovnici:
ob pritisku na doloˇceno kombinacijo tipk se sproˇzi doloˇcena akcija/ukaz.
16. Komentiranje nalog:
uporabniki imajo moˇznost komentiranja posameznih nalog v realnem ˇcasu.
17. Shranjevanje nalog in pod-nalog v predlogo:
s tem se omogoˇci prihodnjo hitrejˇso uporabo le-teh v drugih projektih.
18. Informacija o poteku dela zaposlenega:
informacije, koliko ˇcasa je zaposleni prijavljen na delo na doloˇceni nalogi in koliko ˇcasa so mu vodje za to nalogo namenile.
19. Oznaˇcbe nalog (labels):
omogoˇci preglednejˇse in laˇzje iskanje med nalogami.
20. Oznaˇcitev naloge kot konˇcane:
moˇznost, da uporabnik nalogo oznaˇci kot konˇcano in moˇznost od- oznaˇcitve v prvotno stanje.
21. Pomembnost naloge:
pri vsaki nalogi je na voljo polje, ki prikazuje pomembnost naloge. Npr:
(nizka, srednja, visoka) in njeno napredovanje, npr. nereˇseno, v teku, ˇcaka na potrditev.
22. Varnost zasebnih informacij:
moˇznost, da uporabnik ohrani doloˇcene informacije zasebne (private), npr. projekte ali naloge. Lahko so v popolnosti zasebne (vidi jih le uporabnik) ali so vidne doloˇceni skupini ljudi.
23. Nastavitev dostopa do vsebine:
moˇznost nastavitve dovoljen dostopa do vsebine za uporabnika, na pri- mer le ogled vsebine — (view-only) ali samo pregled in komentiranje
— (comment-only).
24. Moˇznost iskanja projektov po razliˇcnih parametrih:
moˇznost nastavitve filtrov vsebine, na primer po nazivu projekta ozi- roma datumu.
25. Urejanje dovoljenj za uporabnike:
administrator lahko uporabnikom dodeli ali odvzame dovoljenja za do- stop in urejanje vsebine.
26. Razliˇcne razliˇcice proti plaˇcilu:
podjetjem in uporabnikom so na voljo razliˇcni paketi/razliˇcice, ki so plaˇcljivi. Ponujajo razliˇcne funkcionalnosti.
27. Nastavitev obvestil:
izbira, katera obvestila (notifications) ˇzeli uporabnik prejemati na ele- ktronski naslov.
28. Nastavitev stolpcev:
pri vsakem projektu (nalogi) lahko uporabnik izbere, koliko stolpcev (columns) in katere bo uporabljal (npr. ˇcasovno sledenje (time tracking), priloˇzene datoteke . . . )
29. Pogled lokacije (map view):
ima moˇznost pogleda lokacije - dodano polje za prikaz strankine loka- cije.
30. Podpora agilnega pristopa:
na primer: moˇznost podpore za Scrum, strankam omogoˇca dostop do sodelovanja na projektu ...
31. Podpora vnosa naravnega jezika:
interpretacija naravnega jezika, kot npr. ”ev monday-interpretira kot ponovitev neke naloge vsak ponedeljek.
32. Moˇznost pametnega naˇcrtovanja:
ˇce nalogi poteˇce datum, sam ponudi moˇznost ponovnega naˇcrtovanja
(glede na posameznikove navade — nekdo najveˇc naredi v ˇcetrtek ali nekdo ima bolj proste ponedeljke . . . ).
33. AI-pametni asistent:
asistent za tolmaˇcenje naravnega jezika, pametni klepetalni robot (chat- bot), opozorila za presego skrajnih rokov projektov ...
34. Prijava razliˇcnih uporabnikov:
v aplikacijo se lahko prijavi veˇc tipov uporabnikov (na primer: stranka, administrator, zaposleni).
Spodaj bomo prikazali tabele analize trga, v katerih so v stolpcih prika- zani analizirani produkti, v vrsticah so oˇstevilˇcene funkcionalnosti, ki smo jih predstavili zgoraj.
V vsakem stolpcu je ustrezno oznaˇcena kljukica (✓), ˇce je funkcionalnost (v posamezni vrstici) prisotna oziroma kriˇzec (✗), ˇce ni.
Stevilkaˇ
fun. Monday Asana Hubstaff
Tasks Todoist Zoho
Projects Teamwork GanttPro TeamGantt Kissflow Project
1 ✓ ✓ ✗ ✓ ✓ ✓ ✓ ✓ ✗
2 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✗
3 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
4 ✓ ✓ ✗ ✗ ✓ ✓ ✗ ✗ ✗
5 ✓ ✓ ✗ ✓ ✓ ✓ ✗ ✗ ✓
6 ✓ ✓ ✓ ✓ ✗ ✓ ✓ ✓ ✓
7 ✓ ✗ ✓ ✓ ✓ ✓ ✓ ✓ ✓
8 ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✓ ✓
9 ✓ ✗ ✗ ✗ ✓ ✓ ✓ ✓ ✓
10 ✗ ✓ ✗ ✓ ✓ ✓ ✓ ✓ ✓
11 ✗ ✓ ✗ ✗ ✓ ✓ ✗ ✗ ✗
12 ✓ ✓ ✗ ✓ ✓ ✗ ✗ ✗ ✗
13 ✓ ✓ ✗ ✓ ✓ ✓ ✗ ✓ ✗
14 ✓ ✓ ✗ ✗ ✓ ✗ ✓ ✓ ✗
15 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
16 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
17 ✓ ✗ ✗ ✓ ✓ ✓ ✓ ✓ ✓
18 ✓ ✗ ✓ ✗ ✓ ✓ ✓ ✓ ✓
19 ✓ ✓ ✗ ✓ ✓ ✓ ✓ ✓ ✗
20 ✓ ✓ ✓ ✓ ✗ ✓ ✗ ✗ ✓
21 ✓ ✓ ✗ ✓ ✓ ✓ ✓ ✓ ✗
22 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
23 ✓ ✓ ✓ ✗ ✓ ✓ ✓ ✓ ✓
24 ✓ ✓ ✓ ✓ ✗ ✗ ✓ ✓ ✓
25 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
26 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
27 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
28 ✓ ✗ ✗ ✗ ✓ ✓ ✓ ✗ ✗
29 ✓ ✗ ✗ ✗ ✓ ✗ ✗ ✗ ✗
30 ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✗ ✓
31 ✗ ✗ ✗ ✓ ✗ ✗ ✗ ✗ ✗
32 ✗ ✗ ✗ ✗ ✗ ✗ ✗ ✗ ✗
33 ✗ ✗ ✗ ✗ ✓ ✗ ✗ ✗ ✗
34 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
Tabela 2.1: Analizirane aplikacije 1—9.
ˇStevilka
fun. Wrike Trello Toggl
Plan ProofHub Jira MS
Project Slack Basecamp
1 ✓ ✗ ✓ ✓ ✗ ✓ ✗ ✗
2 ✓ ✓ ✓ ✓ ✗ ✓ ✗ ✗
3 ✓ ✗ ✓ ✓ ✓ ✓ ✗ ✗
4 ✓ ✓ ✗ ✗ ✓ ✓ ✓ ✗
5 ✓ ✓ ✓ ✓ ✓ ✗ ✓ ✓
6 ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✓
7 ✓ ✗ ✓ ✓ ✓ ✗ ✓ ✓
8 ✓ ✓ ✓ ✗ ✓ ✗ ✗ ✗
9 ✓ ✗ ✓ ✓ ✓ ✓ ✗ ✗
10 ✓ ✗ ✗ ✓ ✓ ✓ ✗ ✗
11 ✗ ✗ ✗ ✗ ✗ ✓ ✓ ✗
12 ✓ ✓ ✓ ✓ ✓ ✗ ✓ ✓
13 ✓ ✓ ✓ ✓ ✓ ✗ ✓ ✓
14 ✗ ✗ ✗ ✗ ✓ ✓ ✗ ✗
15 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
16 ✓ ✓ ✓ ✓ ✓ ✗ ✗ ✓
17 ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✓
18 ✓ ✗ ✓ ✓ ✓ ✓ ✗ ✗
19 ✓ ✓ ✓ ✓ ✓ ✓ ✗ ✗
20 ✗ ✗ ✗ ✗ ✗ ✓ ✗ ✗
21 ✓ ✗ ✓ ✗ ✓ ✓ ✗ ✗
22 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
23 ✓ ✗ ✓ ✓ ✓ ✗ ✗ ✓
24 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
25 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
26 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
27 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
28 ✗ ✓ ✓ ✗ ✗ ✓ ✗ ✗
29 ✗ ✓ ✗ ✗ ✗ ✗ ✗ ✗
30 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✗
31 ✗ ✗ ✗ ✗ ✗ ✗ ✗ ✗
32 ✓ ✗ ✗ ✗ ✗ ✗ ✗ ✗
33 ✓ ✓ ✗ ✗ ✓ ✗ ✓ ✗
34 ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
Tabela 2.2: Analizirane aplikacije 10—17.
Zajem zahtev v podjetju
Kot je zapisano v uvodu, smo prototip aplikacije razvijali za toˇcno doloˇceno podjetje. V tem poglavju bomo predstavili zahteve, ki smo jih zajeli v tem podjetju in jih razvrstili v ˇstiri kategorije po metodi MoSCoW — must, sho- uld, could, would. Zbiranje zahtev je potekalo med razliˇcnimi kadri podjetja (med vodstvom podjetja ter med programerji in grafiˇcnimi oblikovalci). Te zahteve nam bodo v naslednjem poglavju pomagale pri doloˇcitvi konˇcnih funkcionalnosti aplikacije.
V omenjenem podjetju so za osnovni namen rabe aplikacije omenili, da si ˇzelijo orodje, ki bo povezalo zahteve strank (nov projekt) z moˇznostjo beleˇzenja porabljenih ur na tem projektu. Z nadaljnjo komunikacijo z vod- stvom podjetja smo priˇsli do ideje za interni razvoj orodja za upravljanje projektov, ki je zmoˇzen poleg zbiranja zahtev strank in beleˇzenja porablje- nih ur tudi organizacije dela in dodeljevanje nalog. S tem smo priˇsli do osnovne ideje, nakar smo lahko zbrali zahteve, ki so napisane spodaj.
1. Must
(a) Prijava razliˇcnih uporabnikov (zaposlenega, vodje, stranke, admi- nistratorja)
(b) Dodajanje novega projekta s strani strank na podlagi obrazca, ki vsebuje: naziv projekta, prenos slik in drugega materiala itd., po-
19
leg tega pa ima stranka moˇznost dopisati vrsto projekta v obrazcu (ˇce to ˇzeli storiti)
(c) Moˇznost oznaˇcitve projekta kot konˇcanega
(d) Dodeljevanje nalog projekta s strani vodje na zaposlene (e) Polje za indikacijo pomembnosti pri posamezni nalogi (f) Moˇznost oznaˇcitve naloge kot konˇcane
(g) Polje za spremljanje poteka izvedbe naloge, kot je na primer:
[ˇcaka], [v delu], [konˇcano]
(h) Spletna aplikacija 2. Should
(a) Iskanje projekta in naloge po razliˇcnih parametrih (b) Komentiranje nalog za laˇzjo izvedbo dela
(c) Spreminjanje statusa posamezne naloge iz narejeno nazaj v ne narejeno s strani projektne vodje
3. Could
(a) Merjenje ˇcasa pri doloˇceni nalogi
(b) Zaposleni, zadolˇzen za doloˇceno nalogo, prejme obvestilo o na- paki/popravku, ki ga mora izvrˇsiti
(c) Oznaka nalog (labels) (d) Nastavitve obvestil
(e) ˇCe naloga preseˇze skrajni rok, se obarva rdeˇce, hkrati se poˇslje sporoˇcilo (obvestilo) odgovornemu zaposlenemu in vodji projekta 4. Would
(a) Prikaz stranki samo njenih projektov (b) Vnos stroˇskov projekta
(c) Poroˇcilo projekta (porabljene ure, prihodki, stroˇski) (d) Razvrˇsˇcanje projektov po abecedi in datumu
(e) Slika v profilu uporabnika (f) Izdajanje raˇcunov na podlagi ur
Doloˇ citev konˇ cnih
funkcionalnosti in arhitektura aplikacije
V tem poglavju bomo doloˇcili konˇcne funkcionalnosti aplikacije, pridobljene na osnovi zajema zahtev preuˇcevanega podjetja in analize funkcionalnosti konkurenˇcnih izdelkov. Ob vsaki funkcionalnosti bo zapisana utemeljitev, zakaj smo se jo odloˇcili razviti. Predstavili bomo tudi arhitekturo podatkovne baze aplikacije s pomoˇcjo ER-diagrama in arhitekturni vzorec aplikacije.
4.1 Konˇ cne funkcionalnosti
Spodaj predstavljene konˇcne funkcionalnosti so doloˇcene na podlagi zahtev trga in/ali podjetja, doloˇcene, ki so se nam zdele nujne, so dodane po naˇsem lastnem mnenju.
Spletna aplikacija– na podlagi zahteve v podjetju, kjer so ˇzeleli spletno aplikacijo, smo se odloˇcili za spletno aplikacijo, ki temelji na jeziku PHP.
V podjetju namreˇc v veliki meri uporabljajo ta jezik, hkrati je tudi dobro zdruˇzljiv z drugimi programskimi jeziki. Veˇc o odloˇcitvah za njegovo uporabo smo zapisali v poglavju 5.1) in arhitekturi MVC.
23
Prijava razliˇcnih uporabnikov – na podlagi analize trga in zahteve v podjetju smo se odloˇcili, da je to ena izmed kljuˇcnih funkcionalnosti spletne aplikacije. V osnovi se uporabniki delijo na dve enoti: stranke in zaposlene, zaposleni se nadalje delijo ˇse na ˇstiri vrste (grafiˇcni oblikovalci, programerji, projektni vodje in administratorji).
Dodajanje novega projekta - za stranke – na podlagi zahteve v podjetju smo razvili funkcionalnost, kjer stranka na podlagi obrazca odda zahtevo za nov projekt. V obrazcu so polja za naziv projekta, datum za skrajni rok projekta, moˇznost dodati datoteke (.zip, .rar, .7zip), polje za vnos natanˇcnega opisa in navodil ter izbirno polje, kjer lahko stranka izbere vrsto storitev, ki so ˇze vpisane (oblikovanje, programiranje, postavitev sple- tne strani, postavitev spletne trgovine, postavitev elektronskega sporoˇcila) ali vpiˇse poljuben naziv.
Pregled vseh projektov – razvili smo funkcionalnost pregled projek- tov — pregledna ploˇsˇca (dashboard), ki stranki vrne v pogled samo njene projekte, programerjem in grafiˇcnim oblikovalcem prikaˇze samo projekte, v katerih so zadolˇzeni za katero izmed nalog, medtem ko lahko projektni vodja in administrator vidita vse projekte. Hkrati je pri vsakem projektu dodano polje za napredek projekta (progress bar), ki prikaˇze odstotek konˇcanih nalog na projektu. Po naˇsem mnenju je to pomembna lastnost, ki tako strankam, kot tudi vodjem projektov nudi vpogled v napredek projekta in laˇzjo oceno za nadaljnjo razporeditev dela.
Brisanje projektov– na podlagi lastne presoje smo v aplikacijo vkljuˇcili moˇznost brisanja projektov, saj menimo, da je za uporabnika priroˇcno, da lahko izbriˇse projekte. Ta funkcionalnost je na voljo le projektnemu vodji in administratorju.
Urejanje projektov – na podlagi analize trga in lastne presoje smo v aplikacijo vkljuˇcili moˇznost urejanja projektov, saj menimo, da je za upo- rabnika priroˇcno, da lahko uredi projekt. Ta funkcionalnost je na voljo le projektnemu vodji in administratorju.
Pregled posameznega projekta– razvili smo funkcionalnost, kjer upo-
rabnik iz seznama vseh projektov izbere doloˇcen projekt, nakar se mu odprejo podrobnosti posameznega projekta.
Dodajanje nalog – razvili smo funkcionalnost, kjer vodja projektov v sklopu posameznega projekta ustvari nove naloge in jih dodeli posameznim uporabnikom.
Pregled nalog - prikazna ploˇsˇca– razvili smo funkcionalnost za pre- gled vseh nalog na posameznem projektu v pogledu prikazne ploˇsˇce (dashbo- ard). Uporabnikom (grafiˇcni oblikovalci in programerji) se izpiˇsejo le naloge, ki so jim bile dodeljene, medtem ko vodja projektov in administrator vidita vse naloge pri dotiˇcnem projektu.
Kanban pogled nalog– na podlagi analize trga smo priˇsli do zakljuˇcka, da je to funkcionalnost, ki jo podpira veˇcina sodobnih aplikacij in je praktiˇcna predvsem za mala podjetja, ki pri doloˇcenem projektu navadno nimajo ogro- mnega ˇstevila nalog. S tem razlogom smo jo tudi implementirali v naˇsi aplikaciji. Vsaka naloga se nahaja v enem izmed treh stolpcev (ˇcaka, v delu, narejeno), medtem ko lahko uporabnik naloge z klikom in drsenjem prenaˇsa iz enega v drug stolpec. Uporabnikom (grafiˇcni oblikovalci in programerji) se izpiˇsejo le naloge, ki so jim bile dodeljene, medtem ko vodja projektov ter administrator vidita vse naloge pri dotiˇcnem projektu. Naloge imajo hkrati v tem pogledu tudi oznake (labels) za preglednejˇsi pogled.
Pregled posamezne naloge – razvili smo funkcionalnost, kjer upo- rabnik iz seznama nalog (pregled nalog – prikazna ploˇsˇca) izbere doloˇceno nalogo, nakar se mu odprejo podrobnosti posamezne naloge.
Komentiranje nalog– na podlagi analize trga smo v aplikacijo vkljuˇcili funkcionalnost za komentiranje posameznih nalog, saj s tem uporabniki lahko medsebojno komunicirajo o morebitnih nejasnostih na posamezni nalogi s kronoloˇsko prikazanim potekom pogovora.
Brisanje nalog – na podlagi lastne presoje smo v aplikacijo vkljuˇcili moˇznost brisanja nalog, saj menimo, da je za uporabnika priroˇcno, da lahko izbriˇse naloge. Ta funkcionalnost je na voljo projektnemu vodji in admini- stratorju.
Urejanje nalog – na podlagi analize trga in lastne presoje smo v apli- kacijo vkljuˇcili moˇznost urejanja nalog, saj menimo, da je za uporabnika priroˇcno, da lahko uredi nalogo. Ta funkcionalnost je na voljo projektnemu vodji in administratorju.
Polje za potek izvedbe naloge – na podlagi zahteve podjetja smo dodali funkcionalnost, kjer ima vsaka naloga polje za spremljanja poteka naloge pri pregledu prikazne ploˇsˇce. Potek se lahko nahaja v treh stanjih (ˇcaka, v delu, narejeno).
Oznaˇcitev konˇcane naloge – na podlagi zahteve podjetja smo dodali moˇznost oznaˇcitve vsake naloge kot konˇcane. Ko je naloga oznaˇcena kot konˇcana, se tudi polje potek naloge in naloga v kanban pogledu samodejno prestavita v stanje narejeno, hkrati pa je moˇzno funkcionalnost uporabiti tudi v obratni smeri.
Polje za pomembnost pri posamezni nalogi – na podlagi zahteve podjetja in analize trga smo dodali funkcionalnost, kjer ima vsaka naloga polje za prikaz pomembnosti, ki lahko zavzame tri stanja (urgentno, po- membno, normalno). Ta funkcionalnost je pomembna za uporabnike, saj z njeno pomoˇcjo vidijo katera naloga je bolj kritiˇcna in potrebuje veˇcjo priori- teto dela.
Video konferenca - zunanje orodje – na podlagi lastne presoje smo ocenili, da lahko ta funkcionalnost omogoˇci laˇzjo in hitrejˇso komunikacijo stranke in podjetja. Video konferenca je v aplikacijo vgrajena s pomoˇcjo brezplaˇcnega zunanjega orodja Jitsi.
Zapis porabljenega ˇcasa – na podlagi zahteve podjetja in analize trga smo dodali funkcionalnost, ki omogoˇca uporabniku vnos porabljenih ur na opravljeni nalogi, s ˇcimer projektnemu vodji olajˇsa izraˇcun stroˇskov projekta.
Poroˇcilo zasedenosti zaposlenih– na podlagi lastne presoje smo oce- nili, da je predvsem za manjˇsa podjetja izjemnega pomena podatek o zasede- nosti zaposlenih. Zato smo razvili funkcionalnost, ki projektnemu vodji nudi podatke o ˇstevilu nalog, ki jih ima posamezni zaposleni na trenutni dan in ˇstevilo nalog, ki jih mora narediti v naslednjih petih dneh. Hkrati s pomoˇcjo
povpreˇcnega ˇcasa , ki ga je zaposleni porabil za dokonˇcanje vseh svojih nalog (ˇce je ˇze dokonˇcal kakˇsno nalogo in vnesel porabljene ure), izraˇcuna njegovo zasedenost za trenutni dan in naslednjih sedem dni. ˇCe je izraˇcun pod vna- prej doloˇceno mejo (7 ur za dan in 38 ur za teden), se ˇstevilka obarva modro in pomeni prenizko zasedenost. ˇCe je izraˇcun znotraj vnaprej doloˇcene meje (7-8 ur za dan in 38 - 40 ur za teden), se ˇstevilka obarva z zeleno in pomeni ravno prav dela, sicer se obarva rdeˇce in pomeni, da je zaposleni prezaseden.
Upravljanje uporabniˇskih profilov – na podlagi lastne presoje smo dodali funkcionalnost, ki je na voljo samo administratorju in sluˇzi dodajanju raˇcunov (stranka, usluˇzbenec), ter njihovo brisanje. Ta funkcionalnost je kljuˇcna za uporabnost sistema, saj je sistem zaprte narave in se vanj ni moˇzno registrirati.
Spreminjanje gesla– vsak uporabnik ima na voljo funkcionalnost spre- minjanja gesla, s ˇcimer se poveˇca varnost uporabe.
Samodejna odjava – z vidika varnosti in lastne presoje smo implemen- tirali funkcionalnost, kjer se uporabniˇski raˇcun (ki je nedejaven veˇc kot 20 minut) samodejno odjavi iz seje.
Vse druge zahteve in funkcionalnosti, ki smo jih zbrali bodisi pri zajemu zahtev, bodisi smo jih analizirali pri analizi trga, se nismo odloˇcili implemen- tirati in razviti, saj so bile preobseˇzne za diplomsko delo, ali se nam niso zdele primerne za uporabo v manjˇsem podjetju.
4.2 Opis ER-diagrama
ER-diagram, prikazan na sliki 4.1, prikazuje entitete, atribute entitet in re- lacije med entitetami v podatkovni bazi naˇse aplikacije. Kot je razvidno, smo ustvarili pet entitet: Stranka(Customers),Projekt(Project),Naloga (Task) (ki je ˇsibka entiteta — to pomeni, da je ne moremo identificirati brez primarnega kljuˇca projekta),Uporabnik(User) inKomentar(Comment), ki je sicer vmesna entiteta, ki povezuje entiteti Naloga in Uporabnik.
Entitete so med seboj povezane s ˇstirimi relacijami:
• Ustvari (create) – povezuje entiteti Stranka s kardinalnostjo 1..1 in Projekt s kardinalnostjo 0..*, saj ena stranka lahko ustvari niˇc ali veˇc projektov.
• Je razdeljen (is divided) – povezuje entiteti Projekt s kardinalnostjo 1..1 in Naloga s ˇsibko kardinalnostjo (je odvisna od primarnega kljuˇca projekta) 1..*, saj se en projekt lahko razdeli na eno ali veˇc nalog.
• Vsebuje(contains) – povezuje entiteti Naloga s kardinalnostjo 1..1 in Komentar s kardinalnostjo 0..*, saj ima lahko ena naloga niˇc ali veˇc komentarjev.
• Lahko doda(can add) – povezuje entiteti Uporabnik s kardinalnostjo 1..1 in Komentar s kardinalnostjo 0..*, saj lahko en uporabnik doda niˇc ali veˇc komentarjev k nalogi, doloˇceni komentar je lahko napisan s strani toˇcno enega uporabnika.
Vsaka entiteta vsebuje atribute, spodaj bomo naˇsteli vse atribute pri posamezni entiteti in jih na kratko predstavili.
• Strankaima naslednje atribute:
– stranka id (customer id), predstavlja identifikator za iskanje zapi- sov v tabeli Stranka, ter je hkrati primarni kljuˇc in celo ˇstevilo (Integer).
– stranka ime (customer name), je besedilni zapis, ki hrani stran- kino ime.
– stranka priimek (customer surname), je besedilni zapis, ki hrani strankin priimek.
– stranka podjetje (customer company), je besedilni zapis, ki hrani ime strankinega podjetja.
– stranka geslo(customer password), je besedilni zapis, ki hrani ˇsifrirano vrednost strankinega gesla.
– stranka epoˇsta (customer email), je besedilni zapis, ki hrani stran- kin elektronski naslov.
• Projekt ima naslednje atribute:
– projekt id (project id), predstavlja identifikator za iskanje zapisov v tabeli Projekt ter je hkrati primarni kljuˇc in celo ˇstevilo (Inte- ger).
– datoteka ime (file name), je besedilni zapis, ki hrani ime datoteke (.zip), ki je shranjena na streˇzniku za doloˇcen projekt, ˇce jo stranka doda – ni obvezen zapis.
– datum prevzema (date of pickup), je datumski zapis, ki hrani da- tum oddaje projekta s strani stranke.
– skrajni rok (date deadline), je datumski zapis, ki hrani datum, do kdaj mora biti projekt konˇcan.
– projekt napredek (project progress), je celo ˇstevilo, ki hrani odsto- tek [0, 100] napredka projekta.
– projekt ime (project name), je besedilni zapis, ki hrani ime pro- jekta, ki ga izbere stranka.
– projekt tip (project type), je besedilni zapis, ki hrani vrsto pro- jekta, ki ga poljubno dodeli stranka, lahko ostane tudi prazen - ni obvezen zapis.
– projekt opis (project description), je besedilni zapis, ki hrani opis projekta, ki ga poda stranka.
– projekt selektor (project selector), je besedilni zapis, dolg natanko 16 znakov, ki preveri del URL-naslova, ki ga pridobimo pri HTTP metodi GET.
– projekt potrditev (project verificator), je besedilni zapis, dolg na- tanko 16 znakov, ki preveri preostali del URL-naslova, ki ga pri- dobimo pri HTTP metodi GET.
• Naloga ima naslednje atribute:
– naloga id (task id), predstavlja identifikator za iskanje zapisov v tabeli Naloga, ter je hkrati primarni kljuˇc in celo ˇstevilo (Integer).
– naloga ime (task name), je besedilni zapis, ki hrani ime naloge, ki ga poda tisti, ki kreira nalogo. Ponavadi je to vodja projekta.
– naloga dodeljenec (task assigned to), je celoˇstevilski zapis, ki vse- buje identifikator uporabnika, kateremu je ta naloga dodeljena.
– naloga dodelitelj (task assigned from), je celoˇstevilski zapis, ki vse- buje identifikator uporabnika, kateri je to nalogo dodelil drugemu uporabniku.
– naloga narejena (task done), je celoˇstevilski zapis, ki predstavlja, ali je naloga konˇcana (0 - ni konˇcana, 1 - konˇcana).
– naloga pomembnost (task importance), je celoˇstevilski zapis, ki predstavlja pomembnost naloge (0 - urgentno, 1 - pomembno, 2 - normalno).
– naloga status (task status), je celoˇstevilski zapis, ki predstavlja trenutni status naloge (0 - v ˇcakanju, 1 - v delu, 2 - narejena).
– naloga ure (task hours), je ˇcasovni zapis, ki hrani ˇcas, ki ga upo- rabnik porabi, da dokonˇca nalogo.
– naloga opis (task description), je besedilni zapis, ki hrani opis na- loge, ki ga poda tisti, ki ustvari nalogo, po navadi je to vodja projekta.
– naloga zaˇcetni datum (task start date), je datumski zapis, ki hrani datum, stvaritve naloge s strani projektnega vodje.
– naloga skrajni rok (task deadline), je datumski zapis, ki hrani da- tum, do kdaj mora biti projekt konˇcan.
– naloga datoteka (task file), je besedilni zapis, ki hrani ime dato- teke (.zip), ki je shranjena na streˇzniku za doloˇceno nalogo, ˇce jo projektni vodja doda – ni obvezen zapis.
– naloga selektor (task selector), je besedilni zapis dolg natanko 16 znakov, ki preveri del URL-naslova, ki ga pridobimo pri HTTP metodi GET.
– naloga potrditev (task verificator), je besedilni zapis dolg natanko 16 znakov, ki preveri preostali del URL-naslova, ki ga pridobimo pri HTTP metodi GET.
• Uporabnik ima naslednje atribute:
– uporabnik id (user id), predstavlja identifikator za iskanje zapisov v tabeli Uporabnik, ter je hkrati primarni kljuˇc in celo ˇstevilo (Integer).
– uporabnik ime (user name), je besedilni zapis, ki hrani uporabni- kovo ime.
– uporabnik priimek (user surname), je besedilni zapis, ki hrani upo- rabnikov priimek.
– uporabnik funkcija (user function), je celoˇstevilski zapis, ki pove vlogo uporabnika v podjetju (0 - grafiˇcni oblikovalec, 1 - progra- mer, 2 - vodja projektov, 3 - administrator).
– uporabnik geslo(user password), je besedilni zapis, ki hrani ˇsifrirano vrednost uporabnikovega gesla.
– uporabnik epoˇsta (user email), je besedilni zapis, ki hrani uporab- nikov elektronski naslov.
• Komentar ima naslednja atributa:
– komentar id (comment id), predstavlja identifikator za iskanje za- pisov v tabeli Komentar, ter je hkrati primarni kljuˇc in celo ˇstevilo (Integer).
– komentar besedilo (comment text), je besedilni zapis, ki hrani upo- rabnikov komentar pri nalogi.
Slika 4.1: ER-diagram aplikacije
4.3 Uporabljeni arhitekturni vzorec
Odloˇcili smo se za uporabo arhitekturnega vzorcamodel-pogled-krmilnik (MVC), saj je s tem naˇsa aplikacija pridobila pregledno strukturo s tremi logiˇcnimi enotami, hkrati je podatke moˇzno spreminjati neodvisno od njihove predstavitve in obratno. Moˇzno je iste podatke predstaviti na razliˇcne naˇcine, vendar se spremembe podatkov v eni predstavitvi odrazijo v vseh.
Vzorec je prilagodljiv in nudi moˇznost razbitja kode na manjˇse dele za veˇcjo preglednost. Obenem je primeren za uporabo tudi v svetu mobilnih aplikaciji, kar puˇsˇca moˇznost za nadaljnji razvoj mobilne aplikacije na podlagi ˇze obstojeˇce spletne aplikacije[9].
Razvoj aplikacije
V tem poglavju se bomo osredotoˇcili na predstavitev razvoja aplikacije. Naj- prej bomo predstavili uporabljena orodja, nato pa bomo predstavili ˇse pet kljuˇcnih izzivov pri programiranju, ki so nam pri implementaciji predstavljali najveˇc teˇzav.
5.1 Predstavitev orodij
PHP– kot pravita Kevin Ttroe & Peter MacIntyre v knjigi [26], je jezik PHP namenjen pisanju kode na strani streˇznika in je bil originalno narejen kot jezik za oblikovanje dinamiˇcnih spletnih strani, za kar je ˇse vedno najprimernejˇsi.
Za generiranje HTML-vsebine potrebujemo PHP-razˇclenjevalnik in spletni streˇznik, skozi katerega se poˇsiljajo kodirane datoteke. PHP se uporablja tudi za generiranje dinamiˇcne vsebine s povezavo s podatkovno bazo.
V njegovo uporabo nas je prepriˇcalo dejstvo, da je jezik zdruˇzljiv s ˇstevilnimi drugimi jeziki (HTML, JavaScript) in ga z njimi z lahkoto kombiniramo. To nam je omogoˇcalo, da smo lahko vnaprej pripravljeno HTML-predlogo sple- tne vsebine v PHP iteraciji vkljuˇcevali in po potrebi tudi spreminjali podatke, ki smo jih s pomoˇcjo poizvedbe pridobili iz podatkovne baze.
Naslednja pozitivna lastnost, ki nas je prepriˇcala v njegovo uporabo, je velika skupnost, ki ga uporablja. Ker ne gre za nov programski jezik (pred-
35
stavljen je bil leta 1994), ima veliko preverjenih programskih reˇsitev, ki so nastale skozi leta, hkrati omogoˇca povezavo tudi s sodobnimi orodji. Dej- stvo, ki govori v prid njegovi uporabi, je tudi to, da skoraj 79 % vseh spletnih strani temelji na njegovi uporabi[1].
Za dostop do podatkovne baze smo uporabili vgrajen razredPDO (PHP Data Objects). Kot v knjigi [14] pravijo Rasmus Ledorf, Kevin Tatroe in Peter MacIntyre, gre pravzaprav za abstraktno razˇsiritev podatkovne baze, ki podpira povezavo praktiˇcno z vsemi poznanimi podatkovnimi bazami. Pred- nost te razˇsiritve je, da omogoˇca pripravo poizvedenih stavkov vnaprej (pre- pare statements) in ˇsele nato njihovo dejansko izvedbo. To nam omogoˇca, da uporabimo rezervirano mesto (positional placeholder) – mesto vrednosti spre- menljivke oznaˇcimo z “?”, ki predstavlja rezervirano mesto, ki je pri izvedbi poizvedbe nadomeˇsˇcena z vrednostmi iz tabele, ki jo podamo v argumentu.
Za upravljanje z nizi in prepreˇcevanje vrivanja kode (sql injections) smo uporabili vgrajene PHP-funkcije (String Functions), kot je htmlspecialchars [33], ki spremeni posebne znake (special characters) v nizu. Zamenja jih z njihovimi entitetami s tem, da odstrani HTML-znaˇcke, s ˇcimer pomaga pri obrambi pred preprostimi napadi na strani streˇznika.
JavaScript je, kot pravi Kevin J. Theisen [30], jezik za skriptiranje, kar pomeni, da se tradicionalno tolmaˇci med izvajanjem in ni pred prevedena v bitno kodo. V praksi je njegov glavni namen posodobitev izvajanja aplikacije, ki je tipiˇcno napisana v drugem programskem jeziku, ki je raztolmaˇcen in iz- vajan v realnem ˇcasu. Obstajajo trije naˇcini izvajanja programske kode Java- Script. Prvi je preko brskalnikove konzole, drugi je z vkljuˇcenjem kode nepo- sredno v DOM (Document Object Model), z uporabo znaˇck “<script></script>”
in tretji je z uvozom JavaScript izvorne datoteke v spletno stran, tipiˇcno z .js konˇcnico.
JavaScript je jezik brez podatkovnih tipov, kar pomeni, da tolmaˇca ne zanima, kateri podatkovni tip je dodeljen spremenljivki, dokler izraza ne preveri.
JavaScript knjiˇznica jQuery, katere glavni namen je zmanjˇsati koliˇcino JavaScript kode in jo narediti preglednejˇso. Uporablja se za spreminjanje in urejanje kode HTML-DOM in CSS, za uˇcinke in animacije ter uporabo klicev AJAX (za kar smo jo v veˇcji meri uporabili tudi v svoji aplikaciji). AJAX (Asynchronous JavaScript and XML) se uporablja za nalaganje podatkov v ozadju in njihovo prikazovanje na strani brez osveˇzevanja strani. To doseˇze z asinhronimi HTTP-zahtevami (GET in POST), ki jih poˇslje na oddaljeni streˇznik. Kot odgovor prejme podatke v poljubnem podatkovnem formatu (HTML, XML, JSON), ki jih potem s pomoˇcjo jezika JavaScript (Jquery) dinamiˇcno prikaˇze na spletni strani.
HTML (Hypertext Markup Language) je protokol XML (Extensive Markup Language), ki opredeljuje DOM. DOM predstavlja postavitev in la- stnosti, ki opredelijo podatke, predstavljene na spletni strani [30].
CSS (Cascading Style Sheets) predstavlja uˇcinkovit in zmogljiv naˇcin upravljanja upodobljenih elementov v DOM-u, s pomoˇcjo izbirnih razredov za dodajanje slogov in zdruˇzevanje podatkov [30].
MySQL je odprto-kodni sistem za upravljanje relacijskih podatkovnih baz, ki temeljijo na jezku SQL (Structured Query Language) v lasti Oracla. Za sistem MySQL smo se odloˇcili, ker je to najbolj priljubljen sistem, ki se upo- rablja v povezavi z jezikom PHP, je hiter, zanesljiv in preprost za uporabo, uporablja standardno sintakso SQL, je brezplaˇcen in teˇce na streˇzniku [21].
Spletni streˇznik je raˇcunalnik, ki shranjuje programsko opremo spletnega streˇznika in pripadajoˇce datoteke spletne strani. Povezan je s spletom in nudi fiziˇcno povezavo za izmenjavanje podatkov z napravami, ki so prikljuˇcene na splet.
V programskem smislu nudi spletni streˇznik ˇstevilna orodja za nadzor uporabniˇskih dostopov do gostujoˇcih datotek. HTTP-streˇznik je lahko na-
slovljen prek imen domen spletnih strani, ki jih hrani in prikaˇze vsebino teh spletnih strani na napravah konˇcnih uporabnikov [3]. V podjetju so nam za testno uporabo naˇse aplikacije omogoˇcili uporabo spletnega streˇznika Ser- vage.
Domena je identifikacijski niz, potreben za objavo in dostop aplikacije na spletu. Je del spletnega naslova (URL), preko katerega je mogoˇc dostop do spletne aplikacije. V naˇsem primeru smo dobili testno za uporabo na voljo pod-domeno domene, ki je v lasti podjetja, za katerega smo aplikacijo razvili.
phpMyAdmin je brezplaˇcno programsko orodje, napisano v jeziku PHP, in je namenjeno upravljanju MySQL podatkovnih streˇznikov. Z njim je moˇzno izvajati veˇcino administrativnih nalog, kot je ustvarjanje podatkovnih baz, izvajati poizvedbe in ustvariti raˇcune uporabnikov[27].
PowerDesigner je orodje, ki ga proizvaja Sybase in je namenjeno modeli- ranju razliˇcnih modelov. V svojem primeru smo ga uporabili za modeliranje fiziˇcnega modela podatkovne baze, pretvorbo fiziˇcnega v logiˇcni model in kreacijo MySQL podatkovne baze, samodejno iz logiˇcnega modela.
Total Commander je upravitelj datotek za operacijski sistem Windows.
Ima opcijo, da vzpostavi povezavo FTP (File Transfer Protocol), s katero smo prenaˇsali datoteke iz lokalnega okolja (raˇcunalnik) na spletni streˇznik.
VisualStudio Code je integriano razvojno okolje (IDE) za pisanje, ureja- nje in testiranje programske kode. Je v lasti podjetja Microsoft, vendar je odprto-koden. Na voljo ima pametne asistente za samodejno predlaganje kode in oznaˇcevanje napak, poleg tega pa ima vgrajen tudi razhroˇsˇcevalnik za iskanje napak v kodi. Zelo je priroˇcen za delu z Git-om in drugimi SCM- ponudniki, saj ima vgrajene ukaze za le-te. Povrhu vsega ima na voljo ˇstevilne razˇsiritve, ki se lahko poljubno dodajo v razvojno okolje in podporo za skoraj
vse moderne programske jezike [32].
5.2 Kljuˇ cni izzivi programiranja
Kanban pogled
Programiranja tako imenovane “logike” te funkcionalnosti smo se lo- tili v jeziku JavaScript, saj ima vgrajen objekt za prenos podatkov po za- slonu s pomoˇcjo prijemanja in spuˇsˇcanja (drag and drop) elementov. Najveˇc teˇzav sta nam povzroˇcala koncept premikanja elementov s pomoˇcjo dogod- kov (event) in vkljuˇcitev uporabe objekta DataTransfer. Obenem nam je izziv predstavljalo dejstvo, da je elemente treba premikati v realnem ˇcasu in hkrati shranjevati posodobitve premikanja v zapisih podatkovne baze. Spo- daj je predstavljena naˇsa reˇsitev.
Najprej smo v jeziku HTML ustvarili tri obmoˇcja, kamor bomo naloge spuˇsˇcali in prijemali. Poimenovali smo jih Caka,ˇ V delu in Konˇcano. Vsa- kemu smo dodali dva dogodka (events): ondrop - ki, ˇce uporabnik spusti element v to obmoˇcje, pokliˇce funkcijo za izpust elementa - release in on- dragover, ki ob preletu tega obmoˇcja z elementom, pokliˇce funkcijo notify, ki prepreˇci prvotno obnaˇsanje brskalnika in omogoˇci izpustitev elementa, ˇce uporabnik to ˇzeli.
Nato smo ustvarili JavaScript funkcije:
• hold (za prijemanje elementov) – najprej smo v globalno spre- menljivko hold location zabeleˇzili ID-obmoˇcja od koder je bil element prijet, hkrati smo objektuDataTransfer- s funkcijosetData() sporoˇcili, kateri tip podatkov bomo prenaˇsali (ID prijetega elementa v besedilnem zapisu – text),
• release (za izpust elementov) – tukaj smo najprej podatke, shra- njene v objektuDataTransfer, shranili v spremenljivkovar datas pomoˇcjo funkcijegetData(). Nato smo prek urejanja dogodka (event) izpuˇsˇceni element pripeli v spuˇsˇceno obmoˇcje s klicemev.currentTarget.appendCh- ild(document.getElementById(data)). Nato smo v spremenljivkostolpec
zapisali ID trenutnega obmoˇcja in iz HTML elementa div s pomoˇcjo funkcije getElementById pridobili ID elementa (naloge). Nato smo glede na stolpec - ustrezno spremenili barvo naloge in preverili, ali zaˇcetna lokacija stolpca (hold location) ni enaka novi lokaciji (kjer je bil element izpuˇsˇcen – released). V primeru uspeˇsne primerjave smo v datotekoindex.php poslali POST-zahtevo za spremembo stanja naloge v podatkovni bazi (glede na stolpec) s pomoˇcjo asinhrone metode na- vigator.sendBeacon(). V zahtevo smo priloˇzili ID trenutnega projekta, ID spreminjajoˇce se naloge in novi status naloge v obliki ˇstevila.
• uredi byName– v tej funkciji smo uredili barvo nalog v posameznih stolpcih ob nalaganju strani, saj so bile prvotne naloge postavljene v stolpce brez barve (direktno iz baze prek PHP-zanke).
Vse naloge smo v ustrezne stolpce razvrstili s pomoˇcjo jezika PHP. Najprej smo ustvarili tri tabele in v vsako tabelo ustrezno razvrstili naloge, glede na status. V naslednjem koraku smo jih ustvarili v ustreznem stolpcu (nad- elementu div) in vsakemu dodali dva dogodka (event),draggable – ki smo ga nastavili na true (resniˇcno), zato omogoˇci, da se element lahko premika, ter ondragstart – ki ob zaˇcetku premikanja elementa pokliˇce funkcijo hold().
Vzpostavitev dinamiˇcne spletne strani
Izziv nam je predstavljala funkcionalnost za vzpostavitev dinamiˇcne sple- tne strani. Odloˇcili smo se za pristop z AJAX (Asynchronous JavaScript And XML) in knjiˇznico jQuery, saj je ta pristop hiter in zanesljiv, hkrati omogoˇca nadzor in komunikacijo s streˇznikom v ozadju. Najveˇcja teˇzava je bila uporaba tega pristopa, saj ga do sedaj ˇse nisem uporabljal in sem se ga moral sproti uˇciti.
Najveˇc preglavic pri programiranju nam je povzroˇcalo asinhrono nalaga- nje spletnih strani, saj se komunikacija s streˇznikom odvija v ozadju, vrnjeno vsebino (html response) smo izpisovali v ospredju s pomoˇcjo ID - elementa div. To nam je v doloˇcenih primerih onemogoˇcilo, da bi dinamiˇcno prika- zane vsebine ˇse bolj razˇclenili z uporabo tega istega pristopa. Vsebina, ki jo
