Besedilo - FIŠ - Fakulteta za informacijske študije

Transcription

Besedilo - FIŠ - Fakulteta za informacijske študije
FAKULTETA ZA INFORMACIJSKE ŠTUDIJE
V NOVEM MESTU
D I P L O M S K A NALOGA
VISOKOŠOLSKEGA STROKOVNEGA ŠTUDIJSKEGA PROGRAMA
PRVE STOPNJE
PETER ZUPANČIČ
FAKULTETA ZA INFORMACIJSKE ŠTUDIJE
V NOVEM MESTU
D I P L O M S K A NALOGA
RAZVOJ SPLOŠNO NAMENSKEGA CMS SISTEMA
NA OSNOVI ODPRTOKODNEGA MVC OGRODJA
Mentor: viš. pred. mag. Andrej Dobrovoljc
Novo mesto, junij 2015
Peter Zupančič
IZJAVA O AVTORSTVU
Podpisani Peter Zupančič, študent FIŠ Novo mesto, izjavljam:

da sem diplomsko nalogo pripravljal samostojno na podlagi virov, ki so navedeni v
diplomski nalogi,

da dovoljujem objavo diplomske naloge v polnem tekstu, v prostem dostopu, na
spletni strani FIŠ oz. v elektronski knjižnici FIŠ,

da je diplomska naloga, ki sem jo oddal v elektronski obliki, identična tiskani verziji,

da je diplomska naloga lektorirana.
V Novem mestu, dne _________________
Podpis avtorja ______________________
ZAHVALA
Zahvaljujem se mentorju za strokovno pomoč in vodenje pri diplomskem delu.
Posebna zahvala gre staršema, ki sta me v času celotnega študija podpirala in mi stala ob
strani.
POVZETEK
CMS sistem oziroma sistem za urejanje vsebine je v današnjem času vse bolj popularna
spletna aplikacija, ki se uporablja predvsem na spletnih straneh, kjer je potrebno pogosto
posodabljati vsebine in s tem izboljšati učinkovitost spletne strani. Smotrno je, da za izdelavo
spletne aplikacije uporabimo MVC Framework (slov. ogrodje), ki omogoča bolj kakovostno
in predvsem bolj optimizirano izdelavo spletnih aplikacij. Prednost MVC ogrodij je tudi ta, da
je mogoče logiko spletne aplikacije ločiti na tako imenovan model, ki skrbi za podatkovno
logiko, View, ki skrbi za predstavitveni sloj aplikacije, ter Controller, ki skrbi za poslovno
logiko delovanja spletne aplikacije. Glede na to, da je na voljo večje število ogrodij, ki so
večinoma brezplačna, smo se za razvoj naše spletne aplikacije odločali med petimi najbolj
učinkovitimi, ki se uporabljajo za razvoj kompleksnih spletnih aplikacij. V diplomski nalogi
bomo tako predstavili razvoj splošno namenskega CMS sistema na PHP ogrodju, ki bo najbolj
učinkovito služil našemu namenu.
KLJUČNE BESEDE: PHP, Framework, CMS, Codeigniter, Bootstrap
ABSTRACT
CMS or content management system is nowadays increasingly popular Web application that
is mainly used on websites, which mostly want to update the content and thereby improve the
efficiency of the website. In order to tackle the manufacturing of such a web application it is
advisable to use the MVC Framework, which provides better quality and more especially
optimized to create Web applications. The advantage of MVC frameworks is also in this,
because we have separated the logic of Web applications on the so-called Model, which is
responsible for the data logic View which caters to the presentation layer of applications, and
Controller - which is responsible for the business logic of Web applications. Given that we
have a larger number of frameworks, most of which are free, we have to develop our web
applications to decide during the current five most effective frameworks to be used for the
development of complex web applications.
In this thesis, we will present the general development of dedicated CMS system to PHP
Framework that will most effectively serve our purpose.
KEY WORDS: PHP, Framework, CMS, Codeigniter, Bootstrap
KAZALO
1.
2.
UVOD................................................................................................................................. 1
1.1
Opis problema .............................................................................................................. 1
1.2
Hipoteze ....................................................................................................................... 2
1.3
Cilj raziskave ............................................................................................................... 2
IZDELAVA SPLETNE STRANI ...................................................................................... 3
2.1
Kaj je spletna stran ....................................................................................................... 3
2.2
Vrste spletnih strani ..................................................................................................... 3
2.2.1
Statična spletna stran ........................................................................................... 3
2.2.2
Dinamična spletna stran....................................................................................... 3
2.3
Spletna aplikacija ......................................................................................................... 4
2.4
Tehnologije za izdelavo spletnih strani ....................................................................... 4
2.4.1
Označevalni jezik HTML ...................................................................................... 4
2.4.2
Jezik CSS .............................................................................................................. 5
2.4.3
Skriptni jezik Javascript ....................................................................................... 7
2.4.4
Odzivni dizajn za mobilne naprave ...................................................................... 9
2.4.5
Programski jezik PHP ........................................................................................ 11
2.4.6
Podatkovni jezik MySQL .................................................................................... 12
2.4.7
Templating system .............................................................................................. 13
2.5
PHP MVC ogrodje ..................................................................................................... 16
2.5.1
Kaj je PHP ogrodje ............................................................................................ 16
2.5.2
Uporaba PHP ogrodja ....................................................................................... 16
2.5.3
Najpopularnejša PHP ogrodja ........................................................................... 17
2.5.4
Primerjava spletnih ogrodij ............................................................................... 20
2.5.5
Analiza zastavljenih hipotez ter izbira spletnega ogrodja ................................. 22
3.
4.
PREDSTAVITEV CMS SISTEMA ................................................................................. 30
3.1
Predstavitev sistema ................................................................................................... 30
3.2
Predstavitev modulov ................................................................................................ 31
3.2.1
Template editor ................................................................................................... 32
3.2.2
Page editor ......................................................................................................... 34
3.2.3
Menu editor ........................................................................................................ 35
3.2.4
News ................................................................................................................... 37
3.2.5
Gallery ................................................................................................................ 37
3.2.6
Slider................................................................................................................... 38
3.2.7
Contact form ....................................................................................................... 39
3.2.8
Language ............................................................................................................ 39
3.2.9
User .................................................................................................................... 40
PREDSTAVITEV IZDELAVE SISTEMA...................................................................... 41
4.1
Uporabljena orodja za izdelavo spletne aplikacije .................................................... 41
4.2
Podatkovna struktura spletne aplikacije..................................................................... 41
4.2.1
ContactForm....................................................................................................... 42
4.2.2
ContactFormLog ................................................................................................ 42
4.2.3
Gallery ................................................................................................................ 43
4.2.4
GalleryCategory ................................................................................................. 43
4.2.5
Slider................................................................................................................... 44
4.2.6
Language ............................................................................................................ 45
4.2.7
Menu ................................................................................................................... 45
4.2.8
MenuCategory .................................................................................................... 46
4.2.9
News ................................................................................................................... 46
4.2.10
NewsCategory..................................................................................................... 47
4.2.11
Page .................................................................................................................... 48
4.2.12
PageCategory ..................................................................................................... 49
4.2.13
TemplateBlock .................................................................................................... 50
4.2.14
TemplateCss ....................................................................................................... 50
4.2.15
TemplateHtml ..................................................................................................... 51
4.2.16
User .................................................................................................................... 51
4.3
5.
Integracija ogrodja .................................................................................................... 52
4.3.1
Model .................................................................................................................. 52
4.3.2
View .................................................................................................................... 54
4.3.3
Controller ........................................................................................................... 54
ZAKLJUČEK ................................................................................................................... 56
PRILOGA
KAZALO SLIK
Slika 2.1: Primer uporabe CSS ................................................................................................... 5
Slika 2.2: Primer uporabe LESS ................................................................................................. 6
Slika 2.3: Primer uporabe jQuery ............................................................................................... 8
Slika 2.4: Odzivne spletne strani .............................................................................................. 10
Slika 2.5: Primer uporabe PHP kode ........................................................................................ 11
Slika 2.6: Primer SQL poizvedbe ............................................................................................. 13
Slika 2.7: Primer uporabe templating sistemov ........................................................................ 13
Slika 2.8: Primer uporabe Blade ............................................................................................... 14
Slika 2.9: Primer uporabe Twig ................................................................................................ 15
Slika 2.10: Primer uporabe Smarty........................................................................................... 15
Slika 2.11: MVC vzorec ........................................................................................................... 17
Slika 2.12: Primerjava uporabe ogrodij .................................................................................... 18
Slika 3.1: CSS/Less stilski urejevalec ...................................................................................... 33
Slika 3.2: Html urejevalnik....................................................................................................... 34
Slika 3.3: Vsebinski urejevalnik ............................................................................................... 35
Slika 3.4: Menijska struktura .................................................................................................... 36
Slika 3.5: Izpis objavljenih novic v sistemu ............................................................................. 37
Slika 3.6: Prikaz foto galerije ................................................................................................... 38
Slika 3.7: Prikaz slider modula ................................................................................................. 38
Slika 3.8: Kontaktni obrazec za povpraševanje ........................................................................ 39
Slika 3.9: Prijava v sistem ........................................................................................................ 40
Slika 4.1: Primer Controllerja za Gallery modul ...................................................................... 55
KAZALO TABEL
Tabela 2.1: Primerjava ogrodij ................................................................................................. 21
Tabela 2.2: Primerjava med odprtokodnim in lastnim sistemom ............................................. 26
Tabela 2.3: Primerjava med Codeigntier in Laravel ogrodjem ................................................ 28
Tabela 4.1: Tabela ContactForm .............................................................................................. 42
Tabela 4.2: Tabela ContactFormLog ........................................................................................ 43
Tabela 4.3: Tabela Gallery ....................................................................................................... 43
Tabela 4.4: Tabela GalleryCategory......................................................................................... 44
Tabela 4.5: Tabela Slider .......................................................................................................... 44
Tabela 4.6: Tabela Language.................................................................................................... 45
Tabela 4.7: Tabela Menu .......................................................................................................... 46
Tabela 4.8: Tabela MenuCategory ........................................................................................... 46
Tabela 4.9: Tabela News .......................................................................................................... 47
Tabela 4.10: Tabela NewsCategory ......................................................................................... 48
Tabela 4.11: Tabela Page.......................................................................................................... 49
Tabela 4.12: Tabela PageCategory ........................................................................................... 49
Tabela 4.13: Tabela TemplateBlock ......................................................................................... 50
Tabela 4.14: Tabela TemplateCss ............................................................................................ 51
Tabela 4.15: Tabela TemplateHtml .......................................................................................... 51
Tabela 4.16: Tabela User .......................................................................................................... 52
1. UVOD
V današnjem času spletna stran igra pomembno vlogo na področju oglaševanja. Ljudje se za
izdelavo strani odločajo po tehtnem premisleku in glede na to, da jim lahko takšen način
oglaševanja prinese bistveno boljše rezultate kot drugi načini oglaševanja. Smisel spletne
strani je predstaviti izdelek, storitev ali tisto, kar želimo, da je vidno vsem. Namen je pridobiti
maksimalni delež povpraševanj ali pa zgolj predstaviti svoje podjetje z naborom osnovnih
informacij, ki jih določena ciljna skupina ravno tisti trenutek potrebuje. Na izvedbo spletnih
strani vpliva več različnih faktorjev, s pomočjo katerih definiramo uporabnost strani. V
samem izhodišču je pomembno, ali bo spletna stran statična, za kar se večinoma odločajo
podjetja, ki potrebujejo zgolj predstavitev, ali pa bo spletna stran dinamična, kar pomeni, da
se bo na njej dnevno, tedensko ali mesečno posodabljala vsebina. Vse to je odvisno od tipa
želene predstavitve. Glede na to, da se podjetja bolj zanimajo za dinamične spletne strani
oziroma CMS spletne strani, smo se tudi v podjetju odločili za celovito izdelavo omenjene
spletne aplikacije. CMS sistem oziroma »Content Managment System« je spletna aplikacija, s
pomočjo katere lahko uporabnik ureja vsebino neodvisno od lokacije, podjetja, ki je poskrbelo
za izdelavo strani, ter ostalih uporabnikov. Pri tem sistemu namreč uporabnik dobi le spletni
naslov, kjer mu je na voljo urejevalnik vsebin.
Sistem je grajen na osnovi ogrodja (angl. framework), ki omogoča bistveno boljšo izvedbo
programiranja, ker pri procesu uporablja t. i. objektno programiranje, ki naredi kodo veliko
bolj optimizirano, lažje razumljivo in bolj enostavno.
V diplomski nalogi je predstavljen celoten koncept izdelave spletne aplikacije CMS s
pomočjo ogrodja, ki smo ga na podlagi analize izbrali med različnimi ponudniki. Diplomska
naloga je razdeljena na dva dela, in sicer na teoretični ter praktični del. Teoretični del obsega
splošna teoretična pojasnila glede izdelave spletne aplikacije, primerjavo trenutno najbolj
uporabljenih ogrodij ter njihovo analizo. V praktičnem delu pa je opisan postopek izdelave
lastnega CMS sistema glede na predhodno izbrano ogrodje.
1.1
Opis problema
Največji problem podjetij, ki se ukvarjajo z izdelavo spletnih strani, je vprašanje, zakaj se
sploh odločiti za izdelavo lastnega CMS sistema in ustrezna določitev, v čem bo ta boljši od
že obstoječe izdelanih odprtokodnih (angl. opensource) sistemov. V diplomski nalogi smo
1
poskušali pojasniti, zakaj smo se odločili za izdelavo CMS sistema kar v lastni režiji. Že v
osnovi je mogoče izpostaviti kar nekaj prednosti. Vsak del kode, ki je bil napisan s strani
programerja, je v celoti osmišljen in je natančno določeno, čemu je namenjen. Prav tako
pomembno vlogo igra varnost – glede na to, da kot programerji poznamo kar nekaj ranljivosti
sistemov, lahko vse potencialne nevarnosti pri izvedbi lastnega sistema predvidimo in
odpravimo.
Kadar se odločamo za izvedbo izdelave lastnega CMS sistema ali katere koli druge spletne
aplikacije, se vedno poraja vprašanje, ali je boljša izbira izdelati sistem povsem na novo ali
začeti izdelavo s pomočjo že narejenih ogrodij. Tudi ta problem smo v diplomski nalogi
pojasnjevali ter na koncu ugotovili, katero je najbolj smiselno in najbolj uporabno ogrodje za
izdelavo želene spletne aplikacije.
1.2
Hipoteze
Pri izvedbi diplomske naloge smo si zastavili nekaj hipotez, s pomočjo katerih smo lažje
analizirali rezultate. Naše hipoteze so:

Odprtokodni CMS sistemi imajo bistveno več prednosti kot CMS sistemi, izdelani v
lastni izvedbi.

Ogrodja se močno razlikujejo med seboj po razpoložljivih virih, ki jih programer
nujno potrebuje pri razvoju produkta (navodila, skupnost, rešitve problemov ...).

Ogrodja se med seboj razlikujejo po podprtih funkcionalnostih, zato verjetno nekatera
ne podpirajo vseh komponent in funkcionalnosti, ki jih bomo potrebovali pri izdelavi
želenega sistema.
1.3
Cilj raziskave
Naš cilj v diplomski nalogi je seznanitev z različnimi ogrodji za izdelavo spletnih aplikacij, ki
olajšajo proces izdelave s pomočjo že izdelanih funkcionalnosti.
Naslednji cilj je analizirati pet najbolj uporabljenih ogrodij in izbrati tistega, ki bo najbolj
ustrezal specifikacijam glede na želene zahteve samega sistema. Končni cilj je izdelati spletno
aplikacijo, tako imenovani CMS sistem za urejanje vsebin, s pomočjo enega od vnaprej
izbranih ogrodij.
2
2. IZDELAVA SPLETNE STRANI
2.1
Kaj je spletna stran
Spletna stran je dokument, ki je kodiran v HTML jeziku. Omogoča nam, da svoje storitve,
dejavnosti in ponudbo predstavimo na spletu ter na ta način poskrbimo za oglaševanje,
prepoznavnost in lažji pretok informacij. V nadaljevanju so opisane osnove spletnih strani, ki
jih je potrebno poznati za učinkovito izdelavo.
2.2
Vrste spletnih strani
Glede na trenutni trend ločimo kar nekaj različnih tipov spletnih strani, pri čemer jih v osnovi
delimo na statične strani, ki se ne posodabljajo vsakodnevno, in dinamične spletne strani, ki
omogočajo kontinuirano posodabljanje in spreminjanje vsebin.
2.2.1 Statična spletna stran
Statična spletna stran je kodirana in napisana v HTML jeziku. Te strani so uporabne predvsem
v primerih, kjer vsebina ostane nespremenjena dlje časa. Slaba stran je, da moramo v primeru
sprememb znotraj vsebine ročno kodirati stran, pri čemer je mogoče uporabiti tudi
programsko opremo za tovrstno urejanje. Vsakršna sprememba dizajna strani je veliko bolj
zahtevna in dolgotrajna, zato lahko to dolgoročno za podjetje predstavlja velik strošek.
Statične strani imajo torej kar nekaj omejitev na področju spreminjanja vsebin in dizajna, ena
izmed ključnih prednosti pa je hitrost nalaganja vsebine, ki posledično pomeni boljšo
odzivnost. (Vining, 2008)
2.2.2 Dinamična spletna stran
Dinamične spletne strani so narejene tako, da se urejajo s pomočjo CMS urejevalnika, v
katerem so ločene oblika, menijska struktura, slike itd. na vsak strani posebej. Videz je
nadzorovan preko urejevalnika, vsebinski del pa se nahaja v podatkovni bazi. Večina CMS
sistemov, pa tudi forumi, blogi ter ostale spletne aplikacije delujejo na podoben način. Sistem
je odličen za hitre in enostavne posodobitve, saj omogoča enostavno manipulacijo s celotnim
spletnim mestom. (Vining, 2008)
3
Dinamična stran ima v primerjavi s statično kar nekaj prednosti, saj omogoča nenehno
posodabljanje spletnih vsebin. S pomočjo sistema lahko izdelamo nove spletne strani, dodamo
članke, uredimo menijsko strukturo itd. brez dejanskega znanja programiranja. Tudi, če
želimo spremembe opraviti na ravni grafične podobe, jo lahko enostavno uredimo in dodamo
preko vmesnika ter jo integriramo v sam sistem. (Vining, 2008)
2.3
Spletna aplikacija
Spletna aplikacija je vsaka spletna stran, ki v ozadju dinamično generira določen del izpisa
spletne strani in ima vnaprej določen namen. Prednost spletne aplikacije v primerjavi s
standardnimi spletnimi stranmi je, da omogoča izvajanje zahtevanih nalog brez kakšnih koli
večjih posegov v ozadju spletne strani. Spletna aplikacija se običajno povezuje s podatkovno
bazo in operacije se izvajajo na strani strežnika. Spletne aplikacije se večinoma izdelujejo v
skriptnem jeziku PHP, vse bolj pogosta pa je tudi uporaba jezika »Ruby«. Aplikacije so
uporabne predvsem v primerih, kjer je potrebna dinamika spletne strani in kjer se izvajajo
naloge, ki jih ni mogoče izvajati na statičnih spletnih straneh.
2.4
Tehnologije za izdelavo spletnih strani
2.4.1
Označevalni jezik HTML
HTML je kratica za HyperText Markup Language, ki je jezik za objavljanje na svetovnem
spletu. Je podmnožica mednarodnega standarda za izmenjavo elektronskih dokumentov
imenovan SGML (Standard Generalized Markup Language). Računalniki potrebujejo
programsko opremo, da lahko ta jezik razumejo. Ta programska oprema vključuje grafične
brskalnike, tekstovne in govorne naprave. (Breščak, 2010a)
HTML je označevalni jezik (angl. Markup Language). S posebnimi elementi se označi
besedilo, ki brskalniku pove, kako naj strukturo dokumenta prikaže. Obstaja način, kako
označiti naslove, odstavke, sezname, tabele in mnoge druge elemente. HTML je
hipertekstovni jezik (angl. Hypertext Language). Hipertekst uporablja postopek sklicevanja
na druge spletne dokumente, ki so med seboj povezani. Ko se v spletnem dokumentu klikne
povezavo, se v resnici kliče hiperpovezavo. (Breščak, 2010a)
HTML ponuja:

elektronsko objavo dokumentov z besedili, tabelami, fotografijami ...,
4

preusmeritev in napotitev na druge informacije s pomočjo hiperpovezav,

uporabo obrazcev, ki omogočajo iskanje po spletu, naročanje izdelkov ...,

dodajanje video izrezkov, zvoka in drugih aplikacij v dokumente. (Breščak, 2010a)
2.4.2 Jezik CSS
CSS je kratica, ki pomeni »Cascading Style Sheets«. Gre za predlogo, ki določa, kako bo
videti spletna stran v brskalniku.
Razvoj se je začel kot poskus, da izdelovalcem spletnih strani omogoči ločevanje vsebine
spletnih strani od dizajna, kar je tudi v celoti uspelo. Preboj CSS-a se je zgodil, ko se je
pojavila potreba po lepših, boljših in predvsem zahtevnejših spletnih straneh, saj je bistveno
poenostavil doseganje teh učinkov.
Ena od njegovih značilnosti je namreč, da je podoba spletnih strani ločena od kode, kar v
praksi pomeni, da je tudi menjavanje videza spletne strani enostavnejše, saj lahko npr. z nekaj
preprostimi ukazi zamenjamo celotno grafiko spletne strani. (Šunta, 2012)
Glede na to, da se tehnologije izdelave spletnih strani vse bolj razvijajo, smo tudi pri naši
spletni aplikaciji uporabili eno od predprocesorskih tehnologij za stilsko oblikovanje spletne
strani. Spodaj sta opisani tudi dve tehnologiji, ki sta vse bolj v uporabi, in sicer LESS ter
SASS.
Slika 2.1: Primer uporabe CSS
Vir: Zupančič, lastni prikaz (2015)
5
2.4.2.1 Predprocesorski jezik LESS
LESS uporablja samo eno sintakso, ki se zgleduje po CSS sintaksi in je tudi zelo podobna
SCSS sintaksi. Uporablja zavite oklepaje za označevanje posameznih blokov kode in podpičja
za ločevanje vrstic. Datoteke imajo končnico .less.
LESS je bil prvotno programiran v programskem jeziku Ruby, v novejših verzijah pa je le-ta
zamenjan z JavaScriptom. Za razliko od tehnologije SASS lahko LESS teče tako na strani
strežnika (angl. server-side) kot na strani uporabnika (angl. client-side). (Polc, 2012)
Slika 2.2: Primer uporabe LESS
Vir: Zupančič, lastni prikaz (2015)
2.4.2.2 Predprocesorski jezik SASS
SASS (angl. Syntactically Awesome Stylesheets) uporablja dve različni sintaksi. Prva
sintaksa je bila podobna sintaksi Haml, ki uporablja zamike za ločevanje posameznih blokov
kode in nove vrstice brez ločil na koncu.
Druga z imenom SCSS se zgleduje po CSS sintaksi in uporablja zavite oklepaje za
označevanje posameznih blokov kode ter podpičja za ločevanje vrstic. Datoteke imajo
končnico .sass oziroma .scss.
6
SASS je bil prvotno programiran v programskem jeziku Ruby, kasneje pa so se pojavile tudi
druge oblike, na primer PHP za Drupal. SASS lahko uporabljamo le na strežniški strani
(server-side). (Polc, 2012)
2.4.3 Skriptni jezik Javascript
JavaScript je skriptni jezik, ki se uporablja pri izdelavi interaktivnih spletnih strani. JavaSript
nam omogoča, da na spletno stran dodamo interaktivne funkcionalnosti, validacijo spletnih
obrazcev, funkcije za komunikacijo s strežnikom, … (Presentia, 2008)
Sintaksa JavaScript jezika je podobna sintaksi jezika C, mnogo značilnosti in struktur pa si
deli z Javo, s katero sicer ni povezana. Java in JavaScript imata zelo različno semantiko.
(Presentia, 2008)
JavaScript je predmetno orientiran programski jezik, ki se uporablja za izračunavanje in
rokovanje z objekti na uporabniški strani. JavaScript sam po sebi ni uporaben – vanj ne
moremo vnašati podatkov in nam jih tudi ne vrača. Sodelovati mora s predmeti na
uporabniški strani ter njihovimi lastnostni in postopki. JavaScript omogoča integracijo
dokumentov HTML, spletnih komponent (Java, ActiveX...) in komponent plug-in tako, da
postanejo spletne strani dinamične.
JavaScript je primer predmetno orientiranega skriptnega jezika, ki se izvaja na strani
uporabnika. Namenjen je izračunavanju in rokovanju s predmeti v brskalniku. Sam po sebi ni
uporaben, temveč potrebuje aplikacijo, znotraj katere se nahaja. Uporablja se na mnogih
področjih, in sicer:

upravljanje z okni in okvirji,

meniji,

predstavitev besedila in slik,

upravljanje z zgodovino in s povezavami,

delo s piškotki (cookies),

oblikovanja integriranih uporabniških vmesnikov,

preverjanje vnesenih podatkov,

pošiljanje podatkov,

časovni nadzor. (Breščak, 2010b)
7
2.4.3.1 jQuery knjižnica
jQuery je JavaScript ogrodje ali knjižnica, ki vsebuje vnaprej napisane JavaScript funkcije.
Filozofija ogrodja jQuery se glasi: »Write less, do more« (z manj pisanja narediti več), kar
pomeni, da je programerjem z uporabo tega ogrodja potrebno napisati bistveno manj, da
dosežejo boljše rezultate. Le z nekaj kratkimi klici funkcij lahko s tem ogrodjem na stran
dodamo veliko animacij in efektov ter vizualnih učinkov, za katere bi brez ogrodja porabili
veliko več časa.
jQuery knjižnica se navezuje na naslednje funkcije uporabe:

izbor elementov HTML,

manipulacija elementov HTML,

manipulacija dokumentov CSS,

učinki in animacije JavaScript-a,

spreminjanje HTML DOM objekta,

uporaba tehnologije Ajax. (Lemajič, 2010)
Slika 2.3: Primer uporabe jQuery
Vir: Zupančič, lastni prikaz (2015)
2.4.3.2 AJAX - asihroni JavaScript
Asynchronous Javascript + XML (AJAX) ni tehnologija, temveč skupek tehnologij za
izdelavo interaktivnih spletnih aplikacij.
Tehnika AJAX vključuje:

XHTML in CSS standarda,
8

interakcijo s stranjo preko DOM (Domain Object Model),

izmenjavo podatkov s pomočjo označevalnega jezika XML in XSLT,

objekt XMLHttpRequest za asinhrono pridobivanje podatkov,

programski jezik JavaScript za povezavo vsega naštetega.
V klasičnih spletnih aplikacijah poteka interakcija med odjemalcem in strežnikom tako, da
vsaka uporabnikova akcija v spletnem vmesniku povzroči HTTP zahtevek, ki se pošlje
spletnem strežniku. Strežnik obdela zahtevek in pošlje rezultate nazaj k odjemalcu. Pri
naslednji akciji se celoten postopek ponovi. AJAX tehnika po drugi strani prispeva k temu, da
so spletne aplikacije bolj podobne namiznim. Deluje namreč tako, da se zahtevki k strežniku
pošiljajo asinhrono, kar pomeni, da lahko – medtem ko odjemalec čaka na odgovor strežnika
– uporabnik nemoteno uporablja spletno aplikacijo. Ko so podatki pripravljeni, jih s pomočjo
JavasScript-ta prikažemo na spletni strani, ne da bi pri tem morali osvežiti celotno stran.
Posebnost tehnike AJAX je tudi ta, da se pri komunikaciji med odjemalcem in strežnikom
prenese veliko manj podatkov, saj se osvežujejo le deli spletne aplikacije in ne celotna stran.
Posledica tega je bolj odzivna in do uporabnika prijaznejša spletna aplikacija. (Marinšek,
2010)
2.4.4 Odzivni dizajn za mobilne naprave
Porast tabličnih računalnikov in pametnih telefonov vse bolj zahteva, da se sodobne spletne
strani poleg standardne verzije izdelajo tudi v mobilni verziji – responsive design. To pomeni,
da je videz strani na računalniku klasičen, medtem ko se stran ustrezno prilagodi različnim
tabličnim računalnikom in pametnim telefonom na način, da uporabniku zagotavlja enostavno
brskanje in učinkovit ogled strani. Odzivni dizajn spletnih strani obsega oblikovanje strani na
način, da se vedno prilagodijo napravi, s katero uporabnik dostopa do spletne strani. Pri
odzivnem oblikovanju strani je tudi upoštevano, da se funkcionalnost prilagodi zaslonom na
dotik. Namen tega je, da se pripravi le ena spletna stran, ki je prilagojena različnim napravam.
Mobilne spletne strani so narejene tako, da sistem samodejno zazna uporabnike, ki stran
obiščejo preko mobilnega telefona ali tabličnega računalnika, ter prikaže vsebine v mobilni
različici, prilagojeni specifiki posamezne naprave.

Grafična prilagoditev: ekran mobilnega telefona oz. tablice zahteva posebne grafične
prilagoditve spletne strani, pri čemer je potrebno poskrbeti, da izhodiščna predstavitev
tudi na novem mediju doseže želeni namen.
9

Prilagoditev funkcionalnosti: brskanje po internetu z mobilnih telefonov in tablic ima
določene omejitve, zato je potrebno mobilne spletne strani prilagoditi tako, da
uporabnik hitro in enostavno najde informacije ter lahko dostopa do vseh funkcij, ki
jih zagotavlja klasična spletna stran.
Trenutno najbolj uporabljena ogrodja za izdelavo mobilnih spletnih strani so: Boostrap,
Foundation, Yaml, Kube in Toast. (1A Internet , 2014)
Slika 2.4: Odzivne spletne strani
Vir: 1A Internet (2014)
2.4.4.1 Twitter Bootstrap ogrodje za izdelavo odzivnih spletnih strani
Twitter Boostrap je zbirka sodobnih orodij, s katerimi lahko na enostaven način zastavimo
osnovno ogrodje sodobnih spletnih strani. Je odprtokoden način, ki je zaščiten z licenco
Apache License 2.0. Vsebuje številne sodobno oblikovane HTML komponente, kot so
tipografija, tabele, obrazci, gumbi, ikone, navigacija, poleg njih pa tudi JavaScript
komponente, kot so modalna okna, zaslonski namigi, spustni meniji idr. ter mrežo, ki
omogoča enostavno razporeditev elementov.
V zadnjem času je na trgu prisotnih vse več različnih brskalnikov in naprav, zato je enoten
videz spletnih strani zelo težko doseči. Ravno to je glavna prednost Twitter Bootstrap-a, saj
razvijalcem omogoča doseganje enotnega videza v skoraj vseh brskalnikih. Vse bolj
popularen postaja tudi zato, ker na enostaven način omogoča ustvarjanje modernega in
funkcionalnega vmesnika. Njegovo popularnost dokazuje tudi trenutno prvo mesto na
GitHub-ovi lestvici najbolj popularnih projektov. (Župec, 2012)
10
2.4.5 Programski jezik PHP
PHP je jezik, ki je prerasel svoje ime. V osnovi je bil namreč zamišljen kot niz makrov, ki bi
piscem kode pomagali pri vzdrževanju osebnih domačih strani, ime pa se je razvilo iz
njegovega namena. Od takrat so bile zmožnosti PHP-ja razširjene iz niza pripomočkov v
programski jezik s številnimi možnostmi, s katerim je mogoče upravljati velika spletna okolja,
ki jih poganjajo zbirke podatkov. (Zandstra 2004, str. 7)
PHP je uradno znan kot PHP:Hypertext Preprocessor. Je strežniški skripnti jezik, pogosto
zapisan v povezavi s HTML-jem. V nasprotju z običajno HTML stranjo se PHP skripta izvaja
na strani strežnika, medtem ko se HTML izvaja na strani uporabnika. Elementi HTML v
skripti so izpuščeni, koda PHP pa je prevedena in izvedena. S kodo PHP v skriptu lahko
poizvedujemo po zbirkah podatkov, izdelujemo slike, beremo in zapisujemo datoteke,
komuniciramo z oddaljenimi strežniki. (Zandstra 2004, str. 8)
Je fleksibilen, dinamičen jezik, ki podpira celo vrsto programskih tehnik. Ima celoten nabor
lastnosti objektnega programiranja, ki vključujejo podporo za razrede (angl. classes),
abstraktne razrede, vmesnike (angl. interfaces), dedovanje, konstruktorje, kloniranje, izjeme
in še več. Podpira prvorazredne funkcije, kar pomeni, da je lahko funkcija dodeljena
spremenljivki. Tako uporabniško definirane ali vgrajene funkcije se lahko sklicujejo na
spremenljivko in se jih kliče dinamično. Funkcije se lahko podaja kot argumente drugim
funkcijam (lastnost višji red – higher-order funkcije) in tako lahko funkcije vrnejo tudi druge
rezultate podanih funkcij. Rekurzija, lastnost, ki dovoljuje funkciji, da kliče samo sebe, je
podprta v jeziku, vendar se večina PHP kode osredotoča na iteracije. (Lockhart, 2015)
Slika 2.5: Primer uporabe PHP kode
Vir: Zupančič, lastni prikaz (2015)
11
2.4.5.1 PHP Composer
Composer je orodje za upravljanje z odvisnostmi v PHP. Omogoča deklariranje odvisnih
knjižnic, ki jih izbrani projekt potrebuje, in jih ustrezno namesti vanj. Composer ni paketni
urejevalec, temveč je njegov namen, da pakete na ravni določenega projekta namesti v izbrani
direktorij in poskrbi za pravilno integracijo. Paketov nikdar privzeto ne namesti globalno,
temveč preveri odvisnosti oziroma razlike med drugimi paketi in na podlagi tega izdela
posodobitev oziroma namestitev. Composer tako vedno najde, katero verzijo paketa je
potrebno namestiti ter jo po potrebi prenese in namesti v projekt. Eden od osnovnih
repozitorijev za prenos in namestitev paketov je Packagist, med drugimi pa se uporabljajo tudi
Bitbucket in GitHub. (Adermann in Boggiano, 2015)
2.4.6
Podatkovni jezik MySQL
SQL (angl. Structured Query Language) je standardiziran jezik za upravljanje zbirk podatkov
RDBMS (angl. Relational DataBase Managenent System), torej zbirk, v katerih so podatki
shranjeni v povezanih dvodimenzionalnih tabelah. Temeljni elementi relacijske zbirke
podatkov so tabela (angl. table), stolpec (angl. column), vrstica (angl. row) in polje (angl.
field), ki predstavlja presek stolpca in vrstice. V celici je shranjen posamezen podatek oz.
vrednost. Na voljo je cela paleta sistemov za upravljanje relacijskih zbirk podatkov. Med
najbolj razširjene sodijo Oracle DB, IBM DB2, IBM Informix, PostgreSQL, MySQL, MS
Access in MS SQL Server. Čeprav je jezik SQL standardiziran, se lahko sintaksa jezika med
različnimi sistemi RDBMS precej razlikuje, saj so številni razvijalci uvedli različne omejitve
in razširitve (npr. T-SQL, PL/SQL). S stališča uporabe to pomeni, da je uspeh vrivanja SQL
pogojen s poznavanjem specifičnih lastnosti ciljne zbirke podatkov. Izvajanje ukazov ob
pomoči stavkov SQL imenujemo poizvedba (angl. query). (Strosar, 2008)
Večina aplikacij za zbirke podatkov, kot je na primer MySQL, se izvaja kot strežniška
storitev, na katero se lahko priključujejo uporabniki iz istega ali celo iz oddaljenih
računalnikov. Ko je uporabnik priključen na strežnik in ima ustrezne pravice, lahko izbere
zbirko podatkov. (Zandstra 2004, str. 246)
Zbirka podatkov vsebuje različno število tabel s podatki, vsaka pa je urejena v vrstice in
stolpce. Vsak stolpec sprejema le vnaprej določen tip podatkov, INT na primer za celo število
ali VARCHAR za spremenljivo število znakov do določene meje. (Zandstra 2004, str. 246)
12
Slika 2.6: Primer SQL poizvedbe
Vir: Zupančič, lastni prikaz (2015)
2.4.7 Templating system
»Templating system« je način prikazovanja PHP kode v HTML sintaksi brez uporabe PHP
sintaks. Uporablja tako imenovane HTML spremenljivke, ki so ob prikazu spletne strani
zamenjane s PHP kodo. Pri tem sistemu je prednost predvsem v tem, da je HTML sintaksa
ločena od PHP sintakse, kar pomeni, da je prikazovalni del v celoti ločen od logike, ki se
izvaja v ozadju. Dodatna prednost je tudi enostavna uporaba »Template« sintaks, saj ni
potrebno predhodno znanje PHP skriptnega jezika.
Najpogosteje trenutno uporabljeni »Templating« sistemi so: Blade, Twig in Smarty.
Pomembne prednosti, zaradi katerih se odločimo za tak sistem prikaza spletnih strani, so:

nova enostavna sintaksa,

avtomatsko izpuščanje kode,

enostavnejša uporaba za ne-razvijalce spletnih aplikacij,

varnost, saj je prikaz ločen od logike, ki se izvaja v ozadju. (Underwood, 2014)
Slika 2.7: Primer uporabe templating sistemov
Vir: Zupančič, lastni prikaz (2015)
13
2.4.7.1 Blade
Blade je preprost, a zmogljiv templating sistem, ki je v osnovi integriran v Laravel ogrodju.
Za razliko od ostalih postavitvenih sistemov deluje na principu dedovanja elementov in
razdelitvi po več sekcijah. Vse Blade predloge se označuje s končnico .blade.php. Omenjen
template sistem ima možnost uporabe enostavnih izpisov, uporabo if pogojev, uporabo zank,
podajanje komentarjev, izpisovanje jezikovnih značk ter prepisovanje sekcij. (Laravel, 2014)
Slika 2.8: Primer uporabe Blade
Vir: Zupančič, lastni prikaz (2015)
2.4.7.2 Twig
Prednosti uporabe Twig templating sistema so: hitrost, varnost in fleksibilnost. Twig pretvori
predlogo v navadno optimizirano PHP kodo. Ta pretvorba omogoča zmanjšanje v primerjavi z
regularnim PHP-jem na njegov minimum. Vgrajen ima sistem za preverjanje kode in s tem
prepreči blokiranje neprimerne kode uporabnikom, ki imajo direkten dostop do spletnih
predlog. V ta namen se lahko Twig uporablja predvsem tam, kjer do predlog dostopajo tudi
uporabniki sami in imajo tako popoln nadzor nad podano kodo. Razvijalcem omogoča tudi
definiranje poljubnih tagov in filtrov, ki jih lahko uporabijo kasneje v kodi. (Twig, 2012)
14
Slika 2.9: Primer uporabe Twig
Vir: Zupančič, lastni prikaz (2015)
2.4.7.3 Smarty
Smarty je template sistem za PHP, ki ima predstavitveno plast (HTML/CSS) ločeno od logike
same aplikacije. To pomeni, da je PHP koda logika aplikacije, ki je ločena od predstavitve. Je
enostaven sistem tako za frontend kakor za backend izdelavo spletnih strani. Omogoča zelo
enostavno in hitro razvijanje tako dizajnerjem kot tudi programerjem. Je relativno enostaven
za vzdrževanje z zelo enostavno razumljivo sintakso, kjer predznanje PHP-ja ni pogoj. Tako
lahko s pomočjo tega sistema izdelamo fleksibilne spletne strani in pri tem uporabljamo
poljubno določanje sintakse. (Ohrt, 2015)
Slika 2.10: Primer uporabe Smarty
Vir: Zupančič, lastni prikaz (2015)
15
2.5
PHP MVC ogrodje
2.5.1
Kaj je PHP ogrodje
PHP je svetovno znan skriptni jezik, ki je tolikšen uspeh dožive zaradi več razlogov, kot so
fleksibilnost, preprostost in veliko število uporabnikov. Programiranje v PHP-ju ali katerem
drugem jeziku lahko postane monotono in ponavljajoče (angl. Boilerplate), zato si je mogoče
v takem primeru pomagati s PHP ogrodjem.
PHP ogrodje racionalizira razvoj spletnih aplikacij, napisanih v PHP, saj zagotavlja osnovno
strukturo za izdelavo spletnih aplikacij. Drugače povedano PHP ogrodje pomaga spodbuditi
hiter razvoj aplikacij, prihrani čas, omogoča izgradnjo bolj stabilnih aplikacij in zmanjšuje
količino ponavljajočega kodiranja za razvijalce. Ogrodje lahko pomaga tudi začetnikom
graditi bolj stabilno aplikacijo z zagotavljanjem ustrezne interakcije s podatkovno bazo in
kodiranje na predstavitvenem sloju. (Reyes, 2009)
Splošna ideja ogrodja se navezuje na tako imenovani »Model View Controller« (MVC).
MVC je arhitekturni vzorec v programiranju, ki loči poslovno logiko od uporabniškega
vmesnika. Črka M označuje tako imenovani Model, ki se nanaša na podatkovno strukturo,
črka V View, ki se nanaša na predstavitveni sloj oziroma grafični vmesnik, ter C Controller,
ki se nanaša na poslovno logiko delovanja spletne aplikacije. V bistvu MVC razbije razvojni
proces na način, da individualno delamo na določenem segmentu, ki je večinoma neodvisen
od drugih, zaradi česar je kodiranje v PHP bistveno hitrejše in manj zahtevno. (Reyes, 2009)
2.5.2
Uporaba PHP ogrodja
Eden izmed ključih razlogov za uporabo PHP ogrodij je skrajšanje časa razvoja spletnih
aplikacij. Pri izdelavi spletnih aplikacij se razvijalci vedno srečujejo z istimi težavami, in
sicer:

zasnova uporabniškega vmesnika,

poslovna logika,

manipulacija podatkovne baze,

nadzor uporabniškega dostopa.
Drugi razlog je stabilnost izdelka. PHP ima enostavno sintakso, zaradi česar ga mnogi
začetniki izberejo za učenje. Hkrati je PHP zelo neobčutljiv na napake in mnogokrat se lahko
zgodi, da razvijalec sploh ne ve, da je naredil napako, saj spletna stran vseeno deluje, vendar
16
pa obstaja nevarnost, da se zaradi napake ogrozi varnost spletne strani. Problematiko
enostavnosti kodranja v PHP-ju pomaga zmanjševati uporaba primernega PHP ogrodja. K
stabilnosti prispeva tudi dejstvo, da ogrodje razvijajo profesionalni razvijalci, ki spremljajo
odkrite napake in skrbijo za popravke ogrodja. To še posebej velja za odprtokodna ogrodja,
kjer lahko za popravke poskrbi kar skupnost, ki pregleda ogrodje in ugotavlja morebitne
napake. Razvijalcu spletne aplikacije, ki ogrodje uporablja, tako ni potrebno skrbeti za
napake, ampak le uveljavi popravek ogrodja, ko je ta na voljo. Na ta način lahko na enostaven
način odpravi napake v vseh aplikacijah, ki to ogrodje uporabljajo. (Kovačič, 2010)
Slika 2.11: MVC vzorec
Vir: DITEA (2015)
2.5.3 Najpopularnejša PHP ogrodja
PHP ogrodja so skupek že izdelanih funkcij, s pomočjo katerih lahko spletno aplikacijo
izdelamo bistveno hitreje in bistveno bolj varno. Na spletu je trenutno na voljo okoli dvajset
17
različnih PHP ogrodij, ki vsebujejo približno enake funkcionalnosti, vendar se glede na način
delovanja in lastnosti med seboj razlikujejo po učinkovitosti. Glede na to, da smo za
razvijanje sistema potrebovali PHP ogrodje, smo se odločili za analizo trenutno petih
najpopularnejših ogrodij ter glede na razpoložljive vire določili, katero je najbolj primerno za
izdelavo našega CMS sistema.
Na spodnji sliki je razvidna trenutna popularnost uporabe PHP ogrodij.
Slika 2.12: Primerjava uporabe ogrodij
Vir: Skvorc (2013)
Na podlagi grafa popularnosti smo se odločili, da najbolj primerno PHP ogrodje izberemo
med naslednjimi: Laravel, Phalcon, Symfony2, Codeigniter in Yii.
2.5.3.1 Laravel
Laravel je spletno aplikacijsko ogrodje z izrazito elegantno sintakso. Poskrbi namreč, da so
najtežja opravila, kot so avtorizacija, preusmerjanje, seje ipd., opravljena lažje in bolj
enostavno.
Ogrodje pomaga pri tem, da razvoj spletne aplikacije poteka enostavno brez žrtvovanja
funkcionalnosti aplikacije. Ogrodje bodo v bodoče tudi funkcionalno integrirali v jezike, kot
so Ruby on Rails, ASP.NET MVC ter Sinatra.
18
Je enostavno dosegljivo orodje, ki se ga uporablja predvsem za bolj kompleksne in robustne
aplikacije. Še posebej dobra funkcionalnost je migracija sistema in enostavno integrirana
testna podpora, ki celostno poskrbi za dobro uporabniško izkušnjo. (Laravel, 2014)
2.5.3.2 Phalcon
Phalcon je večnamensko spletno ogrodje. Izdelano je na MVC arhitekturi, ki ponuja dodatke,
kot so ORM, objektno orientirane knjižnice, templating sistem, caching, paginacijo in kup
ostalih dodatkov, ki jih najdemo na njihovi spletni strani.
Ogrodje Phalcon je unikatno ogrodje, ker se ga ne prenese le na strežnik in tam naloži, kot je
to praksa ostalih ogrodij, ampak se ga namesti kot dodaten PHP modul. Namestitev ne vzame
več kot nekaj minut in namestitvena dokumentacija je vidna na njihovi spletni strani.
Pomembno je tudi dejstvo, da je to ogrodje odprtokodno, kar pomeni, da lahko uporabnik po
svoji želji prilagodi kodo. (Cogneau, 2013)
2.5.3.3 Symfony2
Symfony je skupek PHP komponent in eno vodilnih PHP ogrodij za izdelavo spletnih strani
ter spletnih aplikacij, ki so grajene na Symfony komponentah. Na tem ogrodju je grajenih kar
nekaj znanih spletnih aplikacij, kot so: Drupal, phpBB(forum) ter eZ Publish. Za vzdrževanje
skrbi velika skupnost uporabnikov in razvijalcev, ki skrbijo za redne popravke in novosti.
Njihova filozofija poudarja profesionalnost, uvajanje najboljših praks, standardizacijo in
interoperabilnost aplikacij. (SensioLabs, 2014)
2.5.3.4 CodeIgniter
CodeIgniter je aplikacijsko razvijalno ogrodje za vse, ki gradijo spletne strani z uporabo PHP
skriptnega jezika. Njihov glavni cilj je omogočiti hiter razvoj spletnih aplikacij od samega
začetka, saj vsebuje mnogo knjižic, ki so potrebne za enostavno implementacijo želenih
ciljev. Ogrodje omogoča kreativno izvedbo projekta z minimaliziranjem celotne kode, ki je
potrebna za določeno nalogo.
Ogrodje je primerno predvsem za uporabnike, ki

potrebujejo majhno ogrodje,

želijo učinkovito izvajanje,
19

želijo dobro združljivost na vseh standardnih spletnih strežnikih (lahko deluje na več
različnih verzijah),

imajo minimalne zahteve glede konfiguracije,

ne želijo uporabljati komandne vrstice,

nimajo želje po dodatnih templating sistemih,

potrebujejo dobro dokumentacijo. (Technology, 2015)
2.5.3.5 Yii
Yii je visokozmogljivo PHP ogrodje za izdelavo spletnih 2.0 aplikacij. Razvijalcem pomaga
izdelati kompleksno spletno aplikacijo v najkrajšem možnem času. Yii je definirana kot "Yee"
oziroma "ji" in je akronim za besedo "Yes It Is". Je brezplačno odprtokodno ogrodje, izdelano
v PHP5 skriptnem jeziku, ki promovira enostavno oblikovanje in podpira hiter razvoj. Glavni
cilj je omogočiti hiter, enostaven in učinkovit končni produkt. (LLC, 2015)
2.5.4
Primerjava spletnih ogrodij
Pri izbiri spletnega ogrodja se je potrebno vprašati, katere funkcionalnosti bomo potrebovali
pri izvedbi spletne aplikacije. Najbolje je vnaprej določiti faktorje, na podlagi katerih bomo
lahko ovrednotili različna ogrodja za izdelavo spletne aplikacije. Spodnja tabela prikazuje prej
omenjenih pet najbolj uporabljenih ogrodij in njihove specifikacije.
20
Tabela 2.1: Primerjava ogrodij
Phalcon
BSD
Maj 2015
2.0.1
PHP 5.3
/
/
Servisi
Laravel
MIT
Maj 2015
5.1
PHP 5.3.7
CLI
ELOQUENT
ORM
/
Templating sistem
Avtentikacija
XSS
CSRF
SQL vrivanje
Enostavnost
Blade, PHP
Da
Da
Da
Da
5
/
Licenca
Zadnja posodobitev
Verzija
Minimalne zahteve
Generacija kode
ORM
/
Ne
Da
Da
Da
3
Symfony2
MIT
Maj 2015
2.6.7
PHP 5.3.2
CLI
Doctrine2,
Propel
/
Codeigniter
BSD
Marec 2015
3.0
PHP 5.1.6
/
AR
Yii
BSD
Marec 2015
2.0.3
PHP 5.4
Yii CLI, Gii
AR, DAO
XML-RPC
PHP, Twig
Da
Da
Da
Da
3
PHP
Soap / Web
Service
PHP, Prado
Ne
Da
Da
Da
4
Ne
Da
Da
Da
5
Vir: Zupančič, lastna raziskava (2015)
Iz zgornje tabele je mogoče razbrati prednosti oziroma slabosti posameznih ogrodij, ki jih
bomo analizirali. Za lažje razumevanje smo v nadaljevanju opisali posamezno lastnost.

Licenca posameznega ogrodja sicer ni toliko pomembna pri sami uporabi, kljub vsemu
pa poda osnovno informacijo o posameznem ogrodju. Med izbranimi ogrodji Laravel
in Symfony2 uporabljata licenco MIT, medtem ko ogrodja Phalcon, Codeginiter, Yii
uporabljajo BSD licenco.

Zadnja posodobitev, ki je trenutno na voljo, je pomemben podatek, saj lahko
razberemo, kako redno posamezna ogrodja spremljajo trenutne trende in skrbijo za
posodobitve tekom celotnega leta. Iz tabele je razvidno, da so verzije posameznih
ogrodij dokaj redno posodobljene. Codeigniter in Yii sta zadnji verziji pridobila v
mesecu marcu, ostala ogrodja pa so bila zadnjič posodobljena v mesecu maju.

Minimalne zahteve so bistvenega pomena, še posebej v primeru, če naš strežnik ne
omogoča določenih zahtev, ki so potrebne za popolno funkcionalnost ogrodja. Večina
izmed izbranih ogrodij za uporabo potrebuje verzijo PHP-ja na strežniku 5.3, izjema
pa je Codeigniter, ki lahko deluje še na starejši verziji PHP 5.16. Posebnost je tudi
Laravel, ki potrebuje dodatno vključen modul mcrypt, namenjen kriptiranju in
dekriptiranju podatkov.

Za generacijo kode (angl. Code Generation) Laravel in Symfony2 uporabljata CLI
(angl. Command line interface) oziroma ukazno vrstico, s pomočjo katere lahko lažje
izvedemo namestitev posebnih paketov in celotno namestitev ogrodja, Codeginiter in
21
Phalcon v osnovi ne uporabljata nobenega vmesnika, medtem ko Yii uporablja Yii
CLI, ki je identičen Laravel ter Symfony 2 vmesniku, ter tudi Gii vmesnik, ki je vezan
na spletno okolje, do katerega lahko dostopamo preko spleta.

Spletnih servisov izbranima ogrodja nima integriranih, pri čemer Codeginiter po
privzeti namestitvi že vsebuje XML-RPC servis, Yii pa vsebuje Soap.

Avtentikacija je proces, pri katerem strežnik, na katerega se uporabnik povezuje,
preveri vnesene podatke in na ta način potrdi identiteto posameznega uporabnika.
Avtentikacijo imata nameščeno Laravel in Symfony 2, ostala tri ogrodja pa ne, kar je
lahko velika pomanjkljivost.

XSS (angl. Cross-site scripting) je tip napada, kjer se v ozadju brez naše vednosti
križno izvaja več skriptov, ki pošiljajo podatke na našo spletno stran in lahko s tem
povzročijo veliko škodo. Vsa obravnavana ogrodja vsebujejo zaščito pred XSS
napadom.

CSRF (angl. cross-site request forgeries) je vrsta napada, kjer napadalec uporabnikov
zahtevek na spletni strani prevzame in s tem brez njegove vednosti dostopa do
določenih podatkov. Tudi to zaščito vsebujejo vsa obravnavana ogrodja.

SQL vrivanje je vrsta napada na spletno aplikacijo, kjer pri generiranju SQL poizvedb
s pomočjo vrivanja različnih simbolov napadalec pridobi podatke, ki so shranjeni v
podatkovni bazi. Napada se lahko ubranimo z uporabo raznih ORM modelov, preko
katerih se vsa vnosna polja filtrira in tako izloči nepotrebne oziroma nedovoljene
znake.
Glede na zadnjo postavko v naši tabeli smo podali tudi lastno mnenje glede enostavnosti
uporabe in splošne uporabnosti posameznih ogrodij. Zaključili smo, da si najvišjo oceno pet
(5) zaslužita Codeigniter ter Laravel, sledi pa jima ogrodje Yii z oceno štiri (4). Najslabše
ocenjena sta Phalcon in Symfony2, ker sta zelo kompleksna in zahtevna za uporabo, poleg
tega pa imata tudi slabšo dokumentacijo.
2.5.5
Analiza zastavljenih hipotez ter izbira spletnega ogrodja
Izbira spletnega ogrodja za izdelavo spletnih aplikacij je eden prvih korakov, potrebnih pred
začetkom izvedbe, zato je potrebno predhodno ovrednotiti naše zahteve in potrebe. Izbirali
smo med trenutno najbolj uporabljenimi ogrodji, ki jih najdemo na spletu, in sicer Laravel,
Phalcon, Symfony2, Codeigniter in Yii. Vsa ogrodja so si relativno podobna, saj imajo
22
podobne lastnosti in funkcionalnosti, vendar je za optimalno izbiro potrebno upoštevati še
nekaj ključnih faktorjev. V našem primeru so to bili sledeči: dokumentacija, enostavna
uporaba in implementacija.
2.5.5.1 Dokumentacija
Dokumentacija za posamezno ogrodje je zelo pomembna predvsem zato, ker nam omogoča,
da določeno aplikacijo izdelamo točno tako, kot smo si jo zamislili. Pomembno je, da je
dokumentacija napisana zelo nazorno, saj tako pripomore k poenostavitvi izdelave spletne
aplikacije.
V nadaljevanju je predstavljen kratek pregled posameznih dokumentacij.

Laravel – vsebuje zelo dobro dokumentirane posamezne segmente funkcij, ki jih
vsebuje.
Obsežno
dokumentacijo
vsebujeta
tako
domača
privzeta
stran
http://laravel.com/ kot tudi stran https://laracasts.com/. Laracasts spletna stran vsebuje
še posebej dokumentirane video posnetke, kjer je nadzorno prikazanih večina
segmentov.

Phalcon – spletna stran z dokumentacijo je suhoparna in nezanimiva. Predvsem
moteče je to, da na njihovi spletni strani nimajo podanih konkretnih iztočnic in bolj
podrobno razloženih posameznih segmentov. Na splošno je to ogrodje slabše
dokumentirano in ima tudi slabšo podporo s strani uporabnikov.

Symfony2 – The Symfony Book, kakor so poimenovali svoj dokumentacijski vzorec,
je eden izmed zelo dobrih primerov, kako uporabniku na enostaven in razumljiv način
razložiti dokumentacijo. Pogrešali smo le iskalnik po dokumentaciji, ki bi olajšal
proces iskanja.

Codeigniter – njihova dokumentacija je odlično predstavljena, saj so nazorno
razloženi konkretni primeri z logičnimi zaključki. Potek dokumentacije je enostavno
sledljiv. Imajo tudi kar nekaj spletnih strani, kjer so objavljeni video vodiči za
posamezne segmente. Podpora uporabnikov je še posebej velika, saj je forum
Codeigniter zelo dobro obiskan in se na njem dnevno pojavlja veliko objav.

Yii – dokumentacija ogrodja na njihovi spletni strani je precej ohlapna. Podanih je
nekaj osnovnih primerov s kodo in kratkimi komentarji, vendar je to z vidika
uporabnika premalo. Slabost njihove dokumentacije je tudi ta, da imajo na uradni
strani ogrodja dokumentacije podane v obliki knjig, ki jih je mogoče kupiti preko
23
Amazona, kar pomeni, da celotna dokumentacija ni brezplačna, temveč je zanjo treba
odšteti 10 € in več.
Glede na opravljeno analizo v kategoriji Dokumentacija izstopata ogrodji Laravel in
Codeigniter. Njuna dokumentacija je enostavno razumljiva ter dobro podprta tako s strani
uporabnikov kot na forumih in Youtube kanalih. Kot zmagovalno smo izbrali ogrodje
Codeginiter, predvsem zato, ker je bistveno boljše najdeno na spletnih iskalnikih in je
podpora uporabnikov občutno večja. Ena od prednosti je tudi ta, da je že pred prihodom nove
verzije Codeginiterja podana nova dokumentacija, medtem ko Laravel še ni v celoti posodobil
dokumentacije v skladu z novo verzijo ogrodja.
2.5.5.2 Enostavna uporabna in implementacija
Enostavna uporaba je predvsem ob prvi uporabniški izkušnji s posameznim ogrodjem še
posebej pomembna. Glede na to, da se pri večini ogrodij uporablja tako imenovani MVC
vzorec programiranja, ki ima ločeno logiko od predstavitvenega vzorca, je koncept na začetku
še toliko težji. Enostavno uporabo smo testirali predvsem na primeru inštalacije kompletnega
sistema ter konfiguracije za pripravo uporabe ogrodja. Implementacijo posameznega ogrodja
pa smo testirali na podlagi namestitve oziroma izdelave dodatnega modula.
Laravel
Namestitev ogrodja je ob prvi uporabi precej zahtevna. Laravel uporablja tako imenovani
Composer za direktno namestitev s spletnega mesta GitHub. Slabost je ta, da je v primeru, če
nimamo direktnega dostopa do spletnega strežnika, potrebna precej zahtevna ročna
namestitev. Prednost ogrodja je ta, da omogoča izredno enostavno posodobitev obstoječe
spletne aplikacije na popolnoma novo verzijo. Enako enostavna je namestitev tako
imenovanih paketov.
Phalcon
Namestitev je enostavna, ker poteka s snemanjem celotnega ogrodja in namestitvijo ogrodja
direktno v želen direktorij. Kljub temu pa je glede na slabo podporo ogrodja težje izdelati in
pridobiti že prej izdelane knjižnice. Glede na to, da je za izdelavo novega vtičnika potrebnega
ogromno časa za razumevanje koncepta tega ogrodja, bi ga začetniku odsvetovali.
24
Symfony2
Namestitev je podobna namestitvi Laravel ogrodja, saj tudi Symfony2 uporablja CLI vmesnik
za namestitev ogrodja in dodatnih knjižic ter paketov. Glede na podano dokumentacijo je
namestitev dokaj enostavna. Programiranje v Symfony2 ogrodju je zahtevno in za začetnika
dokaj neprijazno. Prednost pripisujemo predvsem zelo dobro zamišljeni arhitekturi, čeprav je
ta za uporabnika precej kompleksna.
Codeigniter
Namestitev Codeigniter-ja je relativno enostavna. Postopek je podoben kot pri Phalcon
ogrodju. Z uradne spletne strani prenesemo kompletno verzijo sistema, razširimo v podan
direktorij in nastavimo nekaj najosnovnejših nastavitev za pravilno delovanje. Namestitev je
enostavna tudi za začetnika, k temu pa dodatno pripomore zelo dobra dokumentacija. Glede
na to, da ogrodje privzeto ne vsebuje Composerja, je namestitev dodatnih paketov otežena. Pri
namestitvi novih paketov je tako potrebno s spletne strani prenesti celoten paket, ga razširiti v
pravilne mape in nadaljevati z implementacijo paketa v sistem.
Yii
Namestitev poteka zelo enostavno kot pri Codeigniter in Plahcon ogrodju. Integracija novih
vtičnikov je dokaj otežena, saj je potrebno dobro razumevanje navodil, ki so napisana precej
ohlapno. Vsekakor tega ogrodja ne bi priporočali začetniku, saj je za splošno razumevanje
ogrodja potrebnega več časa, poleg tega pa je tudi koncept dokaj nerazumljiv.
Enostavnost uporabe ogrodja je zelo pomembna še posebej za začetnike. V ožjem izboru pri
tej kategoriji so bila ogrodja Laravel, Symfony2 in Codeigniter, ko so najbolj enostavna za
uporabo in so, kot je bilo že prej omenjeno, tudi zelo dobro dokumentirana. Symfony2 sicer
izpade iz kategorije enostavnejše uporabe predvsem zaradi preveč kompleksne strukture.
Tako smo se na koncu odločali med dvema ogrodjema, in sicer Laravel ter Codeigniter. Sicer
je Laravel po namesitvi zelo enostaven za uporabo, konfiguracijo in implementacijo novih
vtičnikov oziroma knjižic, vseeno pa je preveč zahteven za začetnika. Če bi se odločali med
omenjeni ogrodji kot začetniki, bi vsekakor izbrali ogrodje Codeigniter, ki je namenjeno za
enostavnejše, manjše in manj kompleksne projekte.
2.5.5.3 Analiza hipotez
V diplomski nalogi smo oblikovali naslednje hipoteze:
25

Odprtokodni CMS sistemi imajo bistveno več prednosti kot CMS sistemi, izdelani v
lastni izvedbi.

Ogrodja se močno razlikujejo med seboj po razpoložljivih virih, ki jih programer
nujno potrebuje pri razvoju produkta (navodila, skupnost, rešitve problemov …).

Ogrodja se med seboj razlikujejo glede na podprte funkcionalnosti, zato verjetno
nekateri ne podpirajo vseh komponent in funkcionalnosti, ki jih bomo potrebovali pri
izdelavi želenega sistema.
Na opredelitev prve hipotezi vpliva kar nekaj faktorjev. Odprtokodni (angl. Opensource)
sistemi so sistemi, ki so jih izdelala podjetja ali posamezniki in so namenjena brezplačni
uporabi, če ta zadostuje njihovi licenci uporabe. Prednost takšnih sistemov je, da so dobro
podprti. Običajno imajo večje število uporabnikov, ki v skupnosti ažurno sporočajo napake in
poskrbijo, da so le-te hitro in učinkovito odpravljene. Tako je poskrbljeno za redne izboljšave
in posodobitve sistema. Prednost je tudi ta, da je vsaka sprememba v relativno kratkem času
vidna na spletu in uporabnik je hitreje obveščen o vseh novostih oziroma spremembah.
CMS sistemi, izdelani v lastni izvedbi, se večinoma uporabljajo v privatne namene in niso
izpostavljeni javni uporabi – posledično imajo manjše število uporabnikov. Njihova prednost
je predvsem varnost, saj je koda vidna le redkim in tako obstaja manjša verjetnost za zlorabo
sistema. Če že pri sami izvedbi poskrbimo za maksimalno varnost, se lahko tako izogibamo
večini varnostnih lukenj in smo izpostavljeni manjšim grožnjam. Še ena od dodatnih
prednosti izdelave sistema v lastni režiji je, da dejansko poznamo vsak delček kode, ki smo ga
implementirali v sistem, in lahko tako samostojno hitreje najdemo rešitve v primeru težav.
Spodnja tabela prikazuje prednosti/slabosti uporabe odprtokodnih oziroma v lastni izvedbi
izdelanih CMS sistemov.
Tabela 2.2: Primerjava med odprtokodnim in lastnim sistemom
-
Odprtokodni sistemi
Konstantne posodobitve
Večji nabor uporabnikov
Enostavnost implementacije
Večja podpora uporabnikom
dodatnih spremembah
Večja ranljivost
Možno
lastno
poseganje
popravljanje kode
-
ob
in
Vir: Zupančič, lastna raziskava (2015)
26
Sistemi izdelani v lastni izvedbi
Manjši po velikosti, saj vsebujejo le
določene funkcionalnosti
Dobro poznavanje vsakega dela kode
Boljša varnost zaradi manjšega nabora
uporabnikov
Večinoma namenjeni privatni uporabi
Glede na podane prednosti/slabosti posameznih sistemov lahko sklepamo, da je ne glede na
njihovo ranljivost uporaba odprtokodnih sistemov bistveno boljša in enostavnejša, in sicer
predvsem zato, ker večji nabor uporabnikov skrbi za konstantno posodabljanje in posredno
tudi za izboljšanje ranljivosti. Tako lahko to hipotezo potrdimo.
Druga hipoteza »Ogrodja se močno razlikujejo med seboj po razpoložljivih virih, ki so za
programerja nujno potrebni pri razvoju produkta (navodila, skupnost, rešitve problemov …)«
smo podrobneje analizirali v predhodnem poglavju, ko smo primerjali pet najpogosteje
uporabljenih ogrodij in ugotavljali razlike oziroma skupne lastnosti. Ugotovili smo, da se
ogrodja že v osnovi razlikujejo med sabo po dokumentaciji. Pri večini ogrodij težavo
predstavlja površna oziroma nepopolno razložena dokumentacija, ki bi sicer pripomogla k
bolj učinkovitem in hitrejšem razvijanju želene aplikacije. Kot je bilo omenjeno, je glede
dokumentacije vsekakor najbolje razdelano ogrodje Codeigniter, ki poskrbi, da je vsak
segment posebej zelo nazorno in kvalitetno razložen in tako omogoča uporabniku z najmanj
truda narediti sistem, kot si ga želi. Prav tako smo tudi ugotovili, da ima vsako ogrodje
različno podporo skupnosti. Laravel in Codeigniter imata zelo dobro podprto skupnost tako z
video zapisi kot z objavami na forumih, kar nam omogoča hitrejšo pot do rešitve
posameznega problema pri razvoju spletne aplikacije. Tudi to hipotezo je mogoče potrditi, saj
se je izkazalo, da se sistemi močno razlikujejo po razpoložljivih virih.
Glede zadnje hipoteze se je izkazalo, da imajo nekatera ogrodja kar nekaj prednosti oziroma
slabosti v primerjavi drugimi. Pri podrobni analizi petih ogrodij smo namreč med njimi
opazili kar nekaj razlik Pri naši spletni aplikaciji je pomembno predvsem, da je poskrbljeno za
varnost, torej za dobro zaščito pred XSS, CSRF in SQL napadi. Prav tako je pomembna tudi
velikost ogrodij. Med obravnavanimi je kar nekaj ogrodij zelo velikih, kar pomeni, da
vsebujejo tudi mnogo za nas nepotrebnih knjižic. To pomeni, da pri našem procesu izdelave
ne bodo uporabne in smo jih zato izločili iz ožjega izbora. Pomembna je tudi čim lažja
integracija določenih knjižic, paketov in modulov v ogrodje z najmanjšim vložkom dela. Na
tem segmentu izstopa ogrodje Laravel. Tudi zadnjo hipotezo je mogoče potrditi, saj vsako
ogrodje ne podpira vseh funkcionalnosti, ki jih potrebujemo, oziroma podpira tiste
funkcionalnosti, ki jih ne potrebujemo, pri čemer je zaradi tega sistem prevelik, zahtevnejši in
počasnejši.
27
2.5.5.4 Izbira ogrodja
Kljub opravljeni analizi izbira najbolj optimalnega ogrodja ni bila enostavna, saj so si po
funkcionalnostih med seboj zelo podobna. Za lažjo odločitev smo določili nekaj ključnih
faktorjev, ki so najpomembneje vplivali na končno izbiro. Dva ključna faktorja, ki sta
odtehtala pri odločitvi, sta dostopnost in kvaliteta dokumentacije ter enostavnost namestitve in
integracije oziroma programiranje novih funkcionalnosti.
V ožjem izboru sta bili ogrodji Laravel in Codeigniter. Glavna prednost ogrodja Laravel je ta,
da uporablja Composer, s pomočjo katerega lahko z enostavno namestimo nove knjižnice
oziroma pakete, ki jih potrebujemo. Poleg tega omogoča tudi Eloquent ORM – tako
imenovano orientacijsko dostopanje do podatkovne baze, medtem ko Codeigniter uporablja
AR – active record dostop do podatkovnega modela.
Glavni prednosti Codeigniter ogrodja sta enostavna namestitev in enostavna nadaljnja
uporaba. Na podlagi analize smo oblikovali tudi primerjalno tabelo in se s pomočjo tega lažje
odločali, katero ogrodje bo za nas najboljše za izdelavo omenjenega sistema.
Tabela 2.3: Primerjava med Codeigntier in Laravel ogrodjem
Codeigniter
- Odlična dokumentacija
- Enostavna uporaba za začetnika
- Majhna velikost
- Podpora na starejših strežnikih
- Dobra podpora s strani skupnosti
Laravel
- Zelo dobro razdelan arhitekturni vzorec
ogrodja
- Težji za uporabo za začetnike
- Primernejši za izdelavo kompleksnejših
aplikacij
- Enostavna implementacija dodatnih paketov
Vir: Zupančič, lastna raziskava (2015)
Kot je razvidno iz zgornje tabele imata obe ogrodji tako prednosti kot slabosti.
Obe sodita med boljša ogrodja na trgu z zelo dobro podporo tako s strani proizvajalcev kot
tudi s strani skupnosti. Glede na to, da je bila za nas ena izmed pomembnih lastnosti
enostavnost – tako namestitev kot konfiguracija in implementacija novih knjižic oziroma
paketov, je izstopalo ogrodje Laravel, saj je pri CodeIgniter-ju je ta del bolj težaven.
Ena od prednosti Codeigniter ogrodja je, da deluje tudi na starejših strežnikih, ki imajo
ohlapnejšo podporo. Za Laravel ogrodje po drugi strani še dodatno potrebujemo tudi vtičnik
za kriptiranje oziroma dekriptiranje posredovanih podatkov, ki ga je potrebno posebej naložiti
na strežnik.
28
Odločali smo se tudi, če bi uporabili odprtokodni sistem ali bi se lotili izdelave lastnega CMS
sistema. Sicer je odprtokodni sistem že izdelan z vsemi funkcionalnostmi, vendar smo se
kljub temu odločili, da izdelamo sistem v lastni izvedbi, in sicer predvsem zaradi varnostnega
vidika in zaradi tega, ker v osnovi nima že v naprej izdelanih funkcionalnosti, ki jih
potrebujemo.
Na podlagi celotne analize prednosti in slabosti ter s pomočjo podanih hipotez smo se
odločili, da bomo spletno aplikacijo izdelali v lastni izvedbi na Codeigniter ogrodju.
29
3. PREDSTAVITEV CMS SISTEMA
3.1
Predstavitev sistema
CMS sistem za urejanje vsebine je eno najenostavnejših orodij za spreminjanje vsebine kjer
koli na spletu. S pomočjo orodja lahko ne glede na čas in kraj dostopamo do celotnih vsebin
spletne strani ter jih urejamo. Glede na dolgoletno prakso, znanje in želje naročnika smo se
izdelave CMS sistema lotili na takšnem nivoju, da lahko tudi uporabnik začetnik dostopa do
urejevalnika in ima celotno kontrolo nad urejanjem vsebine.
Sistem je sestavljen iz nekaj glavnih sekcij, ki so med sabo ločene. Vsaka sekcija ima
popolnoma ločen vsebinski urejevalnik ter ločene funkcije znotraj njega.
Pri takšnem sistemu je zelo pomembno, da poskrbimo za enostavno urejanje, saj zna večina
naročnikov uporabljati le osnovne funkcionalnosti, na primer stilske predloge, menjavanje
velikosti pisave, vnos poljubnih slik ipd.
Sistem za integracijo posameznega modula uporablja tako imenovan »templating system«, pri
katerem navedemo določeno značko v določen del kode in potem na tem delu kode značko
zamenjamo z želeno funkcijo, ki izpiše rezultate. Najpogosteje uporabljen »templating
system« je sicer Smarty, vendar ima drugačno shematiko, zato je izdelava lastnega sistema
veliko bolj enostavna in lažja za implementacijo.
Sistem, ki smo ga razvili, je izdelan na Codeigniter ogrodju, ki omogoča bistveno lažjo
izvedbo, hkrati pa tudi zadostno varnost sistema, ki preprečuje vdore. V osnovi se v
podatkovno bazo shranjujejo vsi podatki razen podatkov modula »Template editor«. Pri tem
modulu je posebnost ta, da sistem fizično na serverju izdela celotno direktorijsko sturkturo in
znotraj nje shranjuje posamezne datoteke v .tpl in .css oziroma .less formatu. Cilj takšnega
načina shranjevanja je predvsem ta, da sistem ne bere celotne stilske predloge, HTML
predloge ali posameznega bloka direktno iz podatkovne baze, ampak le iz datoteke, kar
pripomore k hitrejšemu nalaganju spletne strani. Tudi manipulacija z datotekami je lažja, saj
lahko do njih dostopamo tudi preko FTP strežnika in jih tako urejamo. Trenutno je v sistemu
30
razvitih kar nekaj modulov, ki so uporabni tako pri enostavnih kot tudi pri kompleksnih
spletnih straneh. Razviti moduli so naslednji:

Template editor – modul, s katerim urejamo stilsko (CSS) in shematsko (HTML)
spletno predlogo;

Page editor – urejevalnik, kamor vnašamo spletno vsebino, določamo splošne meta
podatke, ki so pomembni tako za optimizacijo kot za samega uporabnika;

Menu editor – menijski urejevalnik, v katerem gradimo celotno menijsko strukturo
spletne strani;

News – urejevalnik objav, kamor pišemo aktualne objave, ki bodo prikazane na spletni
strani;

Gallery – urejevalnik slik, v katerem izdelamo spletne albume, ki bodo prikazani na
spletni strani;

Slider – nalagalnik slik, ki bodo prikazane na vstopnih oziroma naslovnih straneh;

Contact form – urejevalnik kontaktnih obrazcev, kjer definiramo polja in izdelamo
obrazec za oddajo povpraševanja;

Language – urejevalnik večjezičnosti;

User – urejevalnik uporabnikov, kjer dodajamo nove uporabnike, ki jim omogočimo
dostop do spletne aplikacije.
Ključna funkcionalnost sistema je, da imajo uporabniki celoten nadzor nad urejanjem spletne
strani in lahko na postavljeni spletni predlogi samostojno urejajo vsebino. Dodajajo lahko
nove spletne strani, nove menijske postavke, objavljajo novosti, dodajajo nove albume s
slikami in še mnogo več. Glede na zahteve strank je mogoče tudi prilagoditi in dodati nove
module, ki olajšajo delo.
3.2
Predstavitev modulov
Cilj modulov je predvsem ta, da na uporabniku na enostaven način in z najmanj dodatnega
dela omogočimo različne po meri prilagojene funkcionalnosti. Glede na to, da je sistem
izdelan s pomočjo ogrodja, nam to še olajša delo v primeru izdelave celotnega sistema
oziroma pri dodelavi obstoječih ali novih modulov. Našteti so trenutno razviti moduli, ki so
privzeto integrirani v vsakem nameščenem sistemu in omogočajo samostojno delo. Vsak
posamezni modul vsebuje svojo tabelo v bazi, svoj »controller« in svoj »view«, da so moduli
med sabo res ločeni. Prav tako ima vsak modul svojo jezikovno datoteko, kar pomeni, da ga v
31
primeru potrebe po spletni strani v tujem jeziki zelo enostavno prevedemo. Integracija novih
modulov je trenutno še malo težji korak, saj uporabnik nima nadzora nad namestitvijo
oziroma ne more sam dodajati dodatnih modulov, tako da je ta del še vedno odvisen od nas, ki
mu storitev ponujamo.
3.2.1
Template editor
Urejevalnik spletne predloge oziroma tako imenovan »Template editor« je modul, ki nam
omogoča urejanje spletne predloge. Modul zajema »CSS editor« oziroma stilski urejevalec
spletne strani, »Html editor« oziroma označevalni jezik za opisovanje spletnih dokumentov in
»Block editor«, ki omogoča izdelavo posameznih delov spletne strani, katere kasneje
integriramo vanjo.
3.2.1.1 CSS editor
»CSS editor« omogoča neomejeno število dodajanja stilskih predlog, ki so definirane v CSS
jeziku. Novo stilsko predlogo kasneje definiramo pri izdelavi nove spletne strani in tako
spletna stran pridobi določen stil. Urejevalnik je prilagojen lažjemu in bolj enostavnemu
vnašanju novih stilov. Ta urejevalnik je v osnovi namenjen administratorju, od katerega se
pričakuje osnovno poznavanje CSS oz. LESS, ki je neke vrste naprednejši CSS. Posamezen
stil shranjuje v dveh ločenih datotekah. Najprej stil shrani kot .less datoteko, za tem pa sistem
s pomočjo skripta prevede celotno stilsko predlogo v tako imenovano »minify css«, ki je neke
vrste okleščena CSS datoteka, ki ne vsebuje presledkov ter drugih neuporabnih komentarjev.
Ta način je še posebej učinkovit, saj tako povečamo hitrost nalaganja spletne strani. Spodnja
slika prikazuje videz CSS kode znotraj urejevalnika.
32
Slika 3.1: CSS/Less stilski urejevalec
Vir: Zupančič, lastni prikaz (2015)
3.2.1.2 HTML editor
»Html editor« ravno tako kot »CSS editor« omogoča neomejeno število spletnih predlog. Pri
tem urejevalniku je zelo pomembno, da najprej definiramo postavitve posameznih blokov
znotraj HTML kode, kjer se potem bloki zamenjajo z namensko določeno kodo. Nekatere
izmed osnovnih značk za tako imenovan »templating system« so: Header, Left, Content,
Right in Footer. Te značke je potrebno definirati za kasnejšo integracijo blokov. Ta način
definiranja značk omogoča enostavnejše manipuliranje s spletnimi predlogami, saj za
posamezno značko poznamo točno določeno pozicijo, kjer bo ta definirana. HTML
urejevalnik je viden na spodnji sliki.
33
Slika 3.2: Html urejevalnik
Vir: Zupančič, lastni prikaz (2015)
3.2.1.3 Block Editor
»Block editor« je urejevalec posameznega bloka, katerega kasneje postavimo v spletno stran.
V tem urejevalniku je definirana določena koda – bodisi HTML ali JS, ki jo lahko neprestano
prilagajamo in dodeljujemo. Prednost takšnega sistema je predvsem ta, da lahko posamezen
del kode spremenimo le v eni datoteki, ta pa nato vpliva na spremembo vseh ostalih vsebin
oziroma delov kode na določeni spletni strani.
3.2.2
Page editor
Urejevalnik strani je namenjen vsebinskem urejanju novo dodanih, podvojenih ali že prej
obstoječih strani. Ko sta vneseni celotna HTML struktura in stilska CSS oziroma LESS
predloga, je naslednji korak vzpostavljanje spletne strani. Sekcija omogoča dodajanje,
urejanje, brisanje ter podvajanje spletnih strani, pa tudi ostale možnosti, kot je na primer
nastavitev za primarno stran, kar pomeni, da se posamezna stran naloži kot naslovna. Za
dodajanje spletne strani je potrebno v prvem delu definirati naslov strani v administraciji,
34
naslov dejanske strani ter izbrati HTML in CSS stilsko predlogo. Pomembno je, da v primeru
dveh različnih tipov izpisov strani ločimo videz posamezne predloge. Prav tako je potrebno
izpolniti dejansko ime strani, ki bo vidno na spletu, ter vnesti »Meta« podatke, ki lahko
pripomorejo k boljši optimizaciji in posledično boljši najdenosti spletne strani. Osnovni
princip je zmeraj takšen, da je HTML predloga naslovne spletne strani ločena od HTML
predloge podstrani, saj tako kasneje najlažje urejamo popravke.
Drugi del urejevalnika vsebuje »Page Content Title«, torej naslov vsebine v sekciji, in »Page
Content«, torej vsebino posamezne strani. Urejevalnik za vsebino je napredni WYSIWYG
editor, ki je identičen Word urejevalniku.
Tretji del urejevalnika vsebuje blokovsko postavitev, pri kateri določimo pet različnih pozicij,
že v naprej dodanim blokom. Osnovno določeni bloki so: Header, Left, Content, Right,
Footer. Možnosti dodajanja blokov, brisanja in sortiranja so neomejene. Ta sekcija dejansko
omogoča tako imenovano graditev spletne strani s pomočjo blokov. Spodnja slika prikazuje
izdelavo spletne strani z naprednim urejevalnikom vsebin.
Slika 3.3: Vsebinski urejevalnik
Vir: Zupančič, lastni prikaz (2015)
3.2.3 Menu editor
Menijska struktura posamezne spletne strani je zelo pomemben oziroma celo ključen del pri
izdelavi spletne strani. S pomočjo menijske strukture uporabnik dostopa do vseh ostalih strani
in podstrani spletne strani. Sistem omogoča popolno svobodo pri izdelavi menijske strukture,
pri čemer je pomembno upoštevati nekaj pravil, in sicer:
35
1. Spletna stran mora biti najprej dodana v modulu »Page editor« in mora imeti status
prikazana oziroma aktivirana.
2. Vsak meni se dodaja posebej glede na predhodno določen jezik. Če smo dodali novo
spletno stran v slovenskem jeziku, bo ta vidna le pri dodajanju menijske postavke na
slovenskem jeziku.
3. Da je stran dosegljiva, je potrebno stran dodati v meniju, kar pomeni, da pri dodajanju
izberemo določeno spletno stran, določimo naslov menija, url strani, njegovega starša (v
katerem glavnem meniju je stran umeščena) in status strani.
Ko so vsi te pogoji izpolnjeni, je podstran vidna na spletni strani. Na videz je sistem
kompleksen, ker je potrebno prvotno dodati stran in potem še menijsko postavko, vendar
dolgoletne izkušnje potrjujejo, da se ta pristop zelo dobro obnese, še posebej pri velikem
številu spletnih strani, zato ga uporabljamo še naprej.
Urejevalnik menijev med drugim omogoča tudi urejanje menijske postavke, skrivanje
oziroma prikaz postavke ter sortiranje postavke znotraj določenega menija/podmenija, kar
pomeni, da lahko meniju določimo tudi pozicijo oziroma spremenimo vrstni red. Globina
menijske strukture je neomejena, kar pomeni, da ima lahko menijska postavka nad sabo še
veliko število menijev.
Spodnja slika prikazuje menijsko strukturo dodanih strani v urejevalniku.
Slika 3.4: Menijska struktura
Vir: Zupančič, lastni prikaz (2015)
36
3.2.4 News
Novice na spletni strani omogočajo nenehno posodabljanje in osvežitev vsebin, kar zagotavlja
boljšo SEO optimizacijo spletne strani, ki pripomore k boljši najdenosti. Urejevalnik novic
omogoča objavljanje zadnjih obvestil, ki bodo prikazana na določenih straneh. Obvestila
vsebujejo naslov, splošen opis, logotip za posamezno novico, možnost izbire kategorij, če so
le te predhodno dodane, ter vsebino obvestila oziroma novice. Izpis novice je prilagojen
željam naročnika. Običajna praksa je, da določeno število novic z naslovom in kratkim
opisom predstavimo na naslovnici, ostale novice pa na podstrani, kjer so na voljo vse novice.
Ob kliku na novico se odpre podstran s podrobnejšo vsebino novice.
Slika 3.5: Izpis objavljenih novic v sistemu
Vir: Zupančič, lastni prikaz (2015)
3.2.5 Gallery
Foto galerija je del, kjer lahko stranke nalagajo poljubne fotografije. Modul omogoča
dodajanje novih kategorij oziroma albumov. Ko je dodan nov album, se vanj naložijo
fotografije. Sistem pri nalaganju slike izdela tudi tako imenovano sličico (angl. Thumbnail),
ki je namenjena optimizaciji spletne strani in boljši pregledanosti. Galerije, ki so vidne na
spletni strani, imajo vgrajen tudi pregledovalnik slik, s pomočjo katerega se sličice ob kliku
37
odprejo v »pop-up« oknu in jih lahko s pritiskom na smerne tipke ali z miško enostavno
pregledujemo.
Slika 3.6 prikazuje izgled foto galerije v administraciji.
Slika 3.6: Prikaz foto galerije
Vir: Zupančič, lastni prikaz (2015)
3.2.6
Slider
Slider je modul, ki omogoča nalaganje slik, ki bodo prikazane na naslovni oziroma uvodni
strani. Modul omogoča neomejeno nalaganje slik, spreminjanje vrstnega reda slik, vstavljanje
napisa na sliko, pripenjanje datotek oziroma URL naslova do določene spletne strani ter
spreminjanje statusa, torej če želimo naloženo sliko na spletni strani prikazati oziroma skriti.
Slika 3.7: Prikaz slider modula
Vir: Zupančič, lastni prikaz (2015)
38
3.2.7 Contact form
Kontaktni obrazec je modul, ki omogoča pošiljanje povpraševanj s spletne strani na enega ali
več e-mail naslovov. Kontaktni obrazec se izdela po želji naročnika, v osnovi pa vsebuje
nekaj osnovnih polj, kot so: Ime in priimek, Naslov, Email, Telefon ter polje Vaše sporočilo.
V administraciji definiramo vsa polja, ki jih bo kontaktni obrazec vseboval, ter določimo,
katera polja so obvezna za izpolniti. Obrazec vsebuje tudi »anti-spam« zaščito, ki v prvem
koraku preveri, če je izpolnjeno tudi skrito polje, v drugem koraku pa preveri verodostojnost
vnesenega e-mail naslova, kar pomeni, da preveri, če vneseni e-mail naslov resnično obstaja.
Slika 3.8: Kontaktni obrazec za povpraševanje
Vir: Zupančič, lastni prikaz (2015)
3.2.8 Language
Večjezične spletne strani so zelo pomembne za številne naročnike, saj omogočajo prikaz
izhodiščne spletne strani v različnih jezikih. Jezikovni modul omogoča neomejeno dodajanje
jezikov za posamezno spletno stran. Praksa pri omenjenem modulu je, da pred lansiranjem
projekta dodamo jezike ter razdelimo strani in vsebine na način, da stranka kasneje pregledno
dostopa do posameznih jezikov in ureja popravke oziroma spremembe.
39
3.2.9
User
Uporabniški modul omogoča dodajanje novih uporabnikov ter določanje njihovih pravic.
Uporabniški dostop je potrebno omejiti zaradi svobode pri določanju pravic posameznemu
uporabniku, pri čemer je na voljo več možnosti. Uporabnik, ki ima status »Super admin«, ima
nadzor nad celotnim sistemom. Uporabnik s statusom »Admin« ima podobne pravice, le da ne
more odstraniti »Super admin« uporabnika in ne vidi posameznih segmentov. Navadni
uporabnik, ki ima status »User«, ima na voljo le določene opcije. Nima vpogleda v
uporabniško sekcijo, nima vpogleda v sekcijo, kjer se ureja spletno predlogo, ter dostopa do
nekaterih drugih modulov, ki so načeloma zanj neuporabni.
Slika 3.9: Prijava v sistem
Vir: Zupančič, lastni prikaz (2015)
40
4. PREDSTAVITEV IZDELAVE SISTEMA
4.1
Uporabljena orodja za izdelavo spletne aplikacije
Sistem je zasnovan na Codeigniter MVC ogrodju, ki omogoča bistveno lažjo izvedbo
aplikacije. Za izdelavo smo uporabili skriptni jezik PHP, podatkovno bazo MySQL,
JavaScript knjižico jQuery z AJAX asihronim posredovanjem podatkov ter osnovni HTML5
in CSS3. Prednost tega sistema je tudi mobilna dostopnost do spletne aplikacije, saj temelji na
Bootstrap ogrodju, ki omogoča prilagajanje spletne strani glede na dimenzije našega ekrana.
Codeigniter ogrodje je znano že kar nekaj časa. Glede na obsežno podporo in dobro
dokumentacijo lahko rečemo, da je eno boljših ogrodij, ki jih najdemo na trgu. Sicer se je
nadgradnja sistema za določen čas ustavila zaradi problemov v podjetju avtorjev, vendar je
naslednik tega ogrodja nadaljeval z delom in poskrbel za nove verzije. Izdelave s pomočjo
ogrodja smo se lotili predvsem zato, ker nam je bistveno olajšalo izdelavo želene spletne
aplikacije, poskrbelo za boljšo varnost ter omogočilo bolj pregleden in sistematski način
programiranja. Dodatna prednost je tudi ta, da smo imeli dostop do nabora že vnaprej
izdelanih knjižic, ki jih je mogoče zelo enostavno implementirati in kasneje uporabiti pri sami
izvedbi.
4.2
Podatkovna struktura spletne aplikacije
Ob pričetku izdelave sistema smo se najprej lotili priprave podatkovne strukture aplikacije, ki
je naše vodilo skozi celoten projekt. Podatkovna struktura MySQL, ki se uporablja pri
omenjenem sistemu, je smiselno strukturirana na način, da so poizvedbe v podatkovno bazo
čim manj zahtevne in čim hitrejše, saj je to ključno predvsem takrat, ko do spletne strani
dostopa uporabnik z manj znanja.
Nekatere tabele vsebujejo kar nekaj tujih ključev, ki se navezujejo na druge tabele. Tuj ključ
je v tem primeru Primarni ključ druge tabele. Kar nekaj tujih ključev se ponavlja skoraj pri
vsaki tabeli, in sicer LanguageID – primarni ključ v tabeli Language, ki se navezuje na izbran
jezik, ter AuthorID – primarni ključ tabele User, kjer so shranjeni vsi uporabniki in s pomočjo
tega ključa dostopamo do podatkov uporabnika, ki je shranil vnos v podatkovno bazo.
Določenih je tudi nekaj atributov, ki so v več tabelah, na primer Status, kjer je shranjeno
stanje objave z 1 oziroma 0, kar pomeni, da je posamezni element viden oziroma skrit pri
41
prikazu v administraciji ali na strani, ter atribut TimeStamp oziroma TimeStampAdded, v
katerega se beleži čas, ko je bilo izvedeno shranjevanje v administraciji. CMS Sistem vsebuje
petnajst tabel. V spodnjem delu sta prikazana struktura posamezne tabele ter opis
posameznega atributa v tabeli. V posamezni tabeli je podan vsak atribut posebej in njegov tip.
Pri večini tabel smo uporabljali naslednje tipe atributov:

Int – celo število (angl. Integer), dovoljuje največ štiri bite;

Text – tekstovni format, ki ima največji dovoljen prostor 64 kilo bitov;

LongText – tekstovni format, ki ima na voljo do 4 giga bite prostora;

Varchar – tekstovni format, ki je omejen glede na število podanih znakov;

BigInt – celo število, ki dovoljuje največ osem bitov.
4.2.1
ContactForm
V tabelo ContactForm shranimo podatke o kontaktnem obrazcu. Podatkovna struktura
ContactForm vsebuje atribute ContactFormID – primarni ključ te tabele, LanguageID – tuji
ključ tabele Language, Form – atribut, kamor so shranjeni podatki kontaktnega obrazca, ter
Message – kamor so shranjeni podatki o izpisu obvestil, ko je kontaktni obrazec posredovan.
Tabela 4.1: Tabela ContactForm
ContactForm
Atribut
ContactFormID
LanguageID
Tip
int(255)
int(255)
Form
Message
text
text
Vir: Zupančič, lastna raziskava (2015)
4.2.2
ContactFormLog
V tabelo ContactFormLog so shranjeni podatki povpraševanj, ki jih uporabnik izpolni ter
pošlje na določen e-mail naslov. Struktura tabele je sledeča: ContactFormLogID – primarni
ključ te tabele, LanguageID – tuj ključ, ki se navezuje na tabelo Language, Message –
sporočilo, ki ga izpolni pošiljatelj, Tip – vrsta povpraševanja za lažjo filtracijo posredovanih
sporočil, TimteStamp – čas, ko je bilo povpraševanje posredovano.
42
Tabela 4.2: Tabela ContactFormLog
ContactFormLog
Atribut
ContactFormLogID
LanguageID
Message
Tip
TimeStamp
Tip
int(255)
int(255)
text
varchar(255)
bigint(255)
Vir: Zupančič, lastna raziskava (2015)
4.2.3 Gallery
Tabela Gallery se uporablja za shranjevanje slik za želeno fotogalerijo. Struktura tabele je
zgrajena iz atributov: GalleryID – primarni ključ te tabele, Title – naslov slike oziroma kratek
opis slike, Image – ime naložene slike na strežniku, GalleryCategoryID – tuji ključ, ki se
navezuje na tabelo GalleryCategory, AuthorID – tuji kjuč, ki se navezuje na tabelo User,
TimeStampAdded – čas naložene slike na strežnik in Status – kamor se beleži status
prikazane oziroma skrite slike.
Tabela 4.3: Tabela Gallery
Gallery
Atribut
GalleryID
Title
Image
GalleryCategoryID
AuthorID
Tip
int(255)
varchar(255)
varchar(255)
int(255)
int(10)
TimeStampAdded
Status
bigint(20)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.4 GalleryCategory
V tabeli GalleryCategory so shranjeni tako imenovani albumi galerij oziroma kategorije
galerij. Vsebuje sledeče atribute: CategoryID – primarni ključ te tabele, Title – naslov
kategorije, Content – kratek opis kategorije, CategoryUrl – url kategorije glede na podani
Title, AuthorID – tuj ključ, ki se navezuje na tabelo User, TimeStampAdded – shranjen čas
43
dodane kategorije, LanguageID – tuj ključ tabele Language ter Status – status prikazane
oziroma skrite kategorije.
Tabela 4.4: Tabela GalleryCategory
GalleryCategory
Atribut
CategoryID
Title
Content
Tip
int(255)
varchar(255)
longtext
CategoryUrl
AuthorID
TimeStampAdded
LanguageID
Status
varchar(255)
int(10)
bigint(20)
int(255)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.5
Slider
Tabela Slider se uporablja za shranjevanje slik za prikaz naslovnih slik. Struktura tabele je
zgrajena iz sledečih atributov: SliderID – primarni ključ te tabele, Title – naslov slike oziroma
kratek opis slike, Image – ime naložene slike na strežniku, Order – atribut, kjer je shranjena
pozicija slike, ki se uporablja za sortiranje po določenem vrstnem redu, AuthorID – primarni
ključ tabele User, TimeStampAdded – shranjen čas dodanega »slida« in Status – kjer lahko
prikažemo oziroma skrijemo določeno sliko.
Tabela 4.5: Tabela Slider
Slider
Atribut
SliderID
Title
Image
Order
AuthorID
Tip
int(255)
varchar(255)
varchar(255)
int(255)
int(10)
TimeStampAdded
Status
bigint(20)
int(1)
Vir: Zupančič, lastna raziskava (2015)
44
4.2.6 Language
Tabela vsebuje shranjene jezike, ki bodo uporabljeni na spletnih straneh. Atribut LanguageID
– primarni ključ te tabele, Title – ime jezika, TitleShort – kratica jezika, ki je uporabljena kot
url jezika, AuthorID – tuj ključ, ki se navezuje na tabelo User, TimeStampAdded – čas
shranjenega jezika, DefaultLanguage – definira, kateri jezik je nastavljen kot privzet jezik ter
Status – kjer lahko jezik začasno skrijemo oziroma prikažemo.
Tabela 4.6: Tabela Language
Language
Atribut
LanguageID
Title
TitleShort
Tip
int(255)
varchar(255)
longtext
AuthorID
TimeStampAdded
DefaultLanguage
Status
int(10)
bigint(20)
int(1)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.7 Menu
V tej tabeli je shranjena celotna menijska struktura spletne strani. Atribut MenuID – primarni
ključ omenjene tabele, Title – ime menijske postavke, PageID – tuj ključ, ki se nanaša na
tabelo Page, AuthorID – tuj ključ, ki se nanaša na tabelo User, TimeStampAdded – čas, ko je
bila menijska postavka shranjena, MenuUrl – url spletne strani, ki jo generira na podlagi
imena spletne strani, MenuCategoryID – tuj ključ, ki se nanaša na MenuCategory,
ParentMenuID – tuj ključ, ki se nanaša na tabelo Menu, kamor se shrani MenuID menijske
postavke, ki bo v tem primeru nad nivojem novo dodanega menija, Path – shranjeni MenuID
ključi vključno z vsemi ParentMenuID ključi, LanguageID – tuj ključ tabele Language, Status
– status, ali bo menijska postavka skrita ali prikazana.
45
Tabela 4.7: Tabela Menu
Menu
Atribut
MenuID
Title
PageID
AuthorID
TimeStampAdded
MenuUrl
Tip
int(255)
varchar(255)
int(255)
int(10)
bigint(20)
varchar(255)
MenuCategoryID
ParentMenuID
Path
Position
LanguageID
Status
int(255)
int(255)
varchar(255)
int(255)
int(255)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.8
MenuCategory
MenuCategory je tabela, kamor se shranjujejo kategorije za menijske postavke. CategoryID –
primarni ključ tabele, Title – naslov kategorije, Content – kratek opis kategorije, AuthorID –
tuj ključ tabele User, TimeStampAdded – čas dodane kategorije, LanguageID – tuj ključ
tabele Language in Status – stanje kategorije skrito oziroma prikazano.
Tabela 4.8: Tabela MenuCategory
MenuCategory
Atribut
CategoryID
Title
Content
AuthorID
Tip
int(255)
varchar(255)
longtext
int(10)
TimeStampAdded
LanguageID
Status
bigint(20)
int(255)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.9
News
News podatkovna struktura se uporablja za shranjevanje novic. NewsID – primarni ključ
tabele, Title – naslov novice, Description – kratek opis novice, ki obsega 250 znakov, Content
46
– vsebina novice, Logo – shranjeno ime slike za novico, NewsUrl – povezava, s katero
dostopamo do novice, ki je generirana na podlagi Title novice, NewsCategoryID – tuj ključ
tabele NewsCategory, AuthorID – tuj ključ tabele User, TimeStampAdded – čas dodane
novice, LanguageID – tuj ključ tabele Language in Status – kjer je shranjeno stanje objave
novice.
Tabela 4.9: Tabela News
News
Atribut
NewsID
Title
Description
Tip
int(255)
varchar(255)
text
Content
Logo
NewsUrl
NewsCategoryID
AuthorID
TimeStampAdded
LanguageID
text
varchar(255)
varchar(255)
int(255)
int(10)
bigint(20)
int(255)
Status
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.10 NewsCategory
Tabela NewsCategory vsebuje shranjene kategorije, ki jih lahko uporabljamo pri novicah.
Struktura tabele je naslednja: CategoryID – primarni ključ tabele, Title – naslov kategorije,
Content – kratek opis kategorije, AuthorID – tuj ključ tabele, ki se navezuje na tabelo User,
TimeStampAdded – čas dodane kategorije, LanguageID – tuj ključ, ki se navezuje na tabelo
Language in Status – kjer je shranjeno stanje skrite oziroma prikazane kategorije.
47
Tabela 4.10: Tabela NewsCategory
NewsCategory
Atribut
CategoryID
Title
Content
AuthorID
TimeStampAdded
LanguageID
Tip
int(255)
varchar(255)
longtext
int(10)
bigint(20)
int(255)
Status
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.11 Page
Tabela Page je namenjena shranjevanju spletnih strani, ki so prikazane, ko so le-te hkrati
dodane tudi v tabelo Menu. Tabela vsebuje sledeče atribute: PageID – primarni ključ tabele,
Name – ime strani, vidne v administraciji za lažje filtriranje in iskanje, Title – naslov spletne
strani, ki je izpisan na spletni strani, PageContentTitle – naslov vsebine spletne strani,
PageContent – vsebina spletne strani, AuthorID – tuj ključ, ki se navezuje na tabelo User,
CssID – tuj ključ, ki se navezuje na tabelo TemplateCss, HtmlID – tuj ključ, ki se navezuje na
tabelo TemplateHtml, Block – pozicije ter ključi vseh dodanih blokov iz tabele
TemplateBlock, PageCategoryID – tuj ključ za tabelo PageCategory, MetaKeywords – tagi, ki
se uporabljajo za optimizacijo spletne strani, MetaDescription – opis, ki se uporablja za
optimizacijo spletne strani, ContactForm – možnost, če želimo na določeni spletni strani
prikazati kontaktni obrazec, TimeStampAdded – čas dodane spletne strani, DefaultPage –
določitev privzete spletne strani, LanguageID – tuj ključ, ki se nanaša na tabelo Language in
Status – shrani stanje, če bo spletna stran prikazana oziroma skrita pred objavo.
48
Tabela 4.11: Tabela Page
Page
Atribut
PageID
Name
Title
Tip
int(255)
varchar(255)
varchar(255)
PageContentTitle
PageContent
AuthorID
CssID
HtmlID
Block
varchar(255)
longtext
int(10)
int(255)
int(255)
text
PageCategoryID
MetaKeywords
MetaDescription
ContactForm
TimeStampAdded
DefaultPage
int(255)
text
text
int(11)
bigint(20)
int(1)
LanguageID
Status
int(255)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.12 PageCategory
Tabela PageCategory vsebuje shranjene kategorije, ki jih lahko uporabljamo pri dodajanju
novih spletnih strani. Struktura tabele je naslednja: CategoryID – primarni ključ tabele, Title –
naslov kategorije, Content – kratek opis kategorije, AuthorID – tuj ključ tabele, ki se navezuje
na tabelo User, TimeStampAdded – čas dodane kategorije, LanguageID – tuj ključ, ki se
navezuje na tabelo Language in Status – ki prikazuje stanje prikazane oziroma skrite
kategorije.
Tabela 4.12: Tabela PageCategory
PageCategory
Atribut
CategoryID
Title
Content
AuthorID
TimeStampAdded
LanguageID
Tip
int(255)
varchar(255)
longtext
int(10)
bigint(20)
int(255)
Status
int(1)
Vir: Zupančič, lastna raziskava (2015)
49
4.2.13 TemplateBlock
TemplateBlock tabela je namenjena shranjevanju vseh blokov, katere uporabimo pri
dodajanju oziroma urejanju spletne strani. Sestavljena je iz sledečih atributov: BlockID –
primarni ključ tabele, Title – naslov bloka, BlockFile – pot do datoteke, kjer je shranjena
koda, AuthorID – tuj ključ, ki se navezuje na tabelo User, TimeStampAdded – čas
shranjevanja bloka v podatkovno bazo, LanguageID – tuj ključ, ki se navezuje na tabelo
Language in Status – ki shrani stanje prikaza oziroma skritosti bloka.
Tabela 4.13: Tabela TemplateBlock
TemplateBlock
Atribut
BlockID
Tip
int(255)
Title
BlockFile
AuthorID
TimeStampAdded
LanguageID
Status
varchar(255)
varchar(255)
int(10)
bigint(20)
int(255)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.14 TemplateCss
TemplateCss tabela je namenjena shranjevanju vseh stilskih predlog, ki jih uporabimo pri
dodajanju oziroma urejanju spletne strani. Sestavljena je iz sledečih atributov: CssID –
primarni ključ tabele, Title – naslov stilske predloge, CssFile – pot do datoteke, kjer je
shranjena stilska predloga formata .css, CssFileLess – pot do datoteke, kjer je shranjena
stilska predloga formata .less, AuthorID – tuj ključ, ki se navezuje na tabelo User,
TimeStampAdded – čas shranjevanja bloka v podatkovno bazo, LanguageID – tuj ključ in
Status – ki shrani stanje prikaza oziroma skritosti stilske predloge.
50
Tabela 4.14: Tabela TemplateCss
TemplateCss
Atribut
CssID
Title
CssFile
CssFileLess
AuthorID
TimeStampAdded
Tip
int(255)
varchar(255)
varchar(255)
varchar(255)
int(10)
bigint(20)
Status
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.15 TemplateHtml
TemplateHtml tabela je namenjena shranjevanju vseh spletnih predlog, ki jih uporabimo pri
dodajanju oziroma urejanju spletne strani. Sestavljena je iz sledečih atributov: HtmlID –
primarni ključ tabele, Title – naslov spletne predloge, HtmlFile – pot do datoteke, kjer je
shranjena spletna predloga v formatu .tpl, AuthorID – tuj ključ, ki se navezuje na tabelo User,
TimeStampAdded – čas shranjevanja bloka v podatkovno bazo, LanguageID – tuj ključ in
Status – ki shrani stanje prikaza oziroma skritosti spletne predloge.
Tabela 4.15: Tabela TemplateHtml
TemplateHtml
Atribut
HtmlID
Title
HtmlFile
Tip
int(255)
varchar(255)
varbinary(255)
AuthorID
TimeStampAdded
Status
int(10)
bigint(20)
int(1)
Vir: Zupančič, lastna raziskava (2015)
4.2.16 User
V tabeli User so shranjeni vsi uporabniki, ki lahko dostopajo do administracije za urejanje
vsebine. Tabela vsebuje atribute UserID – primarni ključ, UserName – uporabniško ime za
prijavo v sistem, Password – shranjeno kriptirano geslo za prijavo v sistem, TimeStampAdded
– čas dodanega uporabnika, TimeStampLoged – čas zadnje prijave v sistem, IP – naslov
51
uporabnika, ki se je prijavil v sistem, Type – tip uporabnika (uporabnik, administrator), Status
– status uporabnika, ki posledično definira, ali je možna prijava v sistem.
Tabela 4.16: Tabela User
User
Atribut
UserID
UserName
Password
Tip
int(255)
varchar(255)
varchar(255)
TimeStampAdded
TimeStampLogged
IP
Type
Status
bigint(20)
bigint(20)
varchar(255)
int(11)
int(11)
Vir: Zupančič, lastna raziskava (2015)
4.3
Integracija ogrodja
Za izdelavo spletne aplikacije smo uporabili Codeigniter ogrodje, ki uporablja MVC
arhitekturni vzorec programiranja, da loči poslovno logiko od uporabniškega vmesnika. Tako
smo se odločili razdeliti poslovno logiko na najbolj logičen način, da lahko poskrbimo za
optimalno predelavo obstoječega modula brez večjih posegov v celotnem sistemu.
»Controllerje« smo ločili glede na posamezni modul in »View«, ki je znotraj »Controllerja«
deljen še na tri različne dele, in sicer view, edit ter add.
4.3.1
Model
Model je del, ki se nanaša na podatkovno strukturo in delo z njo. Razdeljen je na home_model
in admin_model. Home_model je razred, v katerem so definirane vse metode, ki jih
uporabljamo v home »Controllerju«, in sicer:

recordCount – metoda iz določene tabele vrne število zadetkov glede na določen
kriterij;

fetchDbPage – metoda glede na določen URI vrne vsebino spletne strani;

fetchDbTemplate – metoda glede na določen parameter PageID pridobi iz baze
podatke o spletni predlogi (CssID, HtmlID, BlockID);

fetchDbLanguage – metoda glede na vhodni parameter PageID vrne TitleShort in
LanguageID iz podatkovne baze;
52

fetchDbNews – metoda glede na vhodne parametre LanguageID, CategoryID vrne
izpis novic;

fetchDbGallery – metoda glede na vhodne parametre CategoryID vrne izpis galerije;

fetchDbGalleryCategory – metoda vrne izpis vseh dodanih kategorij oziroma albumov
za galerijo;

fetchDbMenu
–
metoda vrne
izpis
menijev
glede
na vhodni
parameter
PageID,LanguageID in ParentID v primeru, da gre za podmenije;

getFieldValue – metoda glede na vhodne parametre vrne izpis določenega atributa.
Admin model se uporablja v »Controllerjih«, ki jih uporabljamo v administratorskem
dostopu. Poskrbi za izpis določenih podatkov iz baze in vsebujejo naslednje metode:

checkLogin – metoda v podatkovni bazi glede na podana parametra Username in
Password preveri, ali uporabnik dejansko obstaja in glede na pravilnost podatkov vrne
informacijo kot true oziroma false;

recordCount – metoda iz določene tabele vrne število zadetkov glede na določen
kriterij;

getFieldValue – metoda glede na vhodne parametre vrne izpis določenega atributa;

getMaxFieldValue – metoda glede na vhodni parameter vrne največje število, ki je
shranjeno v tabeli;

fetchDb – metoda vrne izpis posameznega tabele iz podatkovne baze glede na
zahtevane parametre;

fetchDbEdit – metoda vrne podatke za urejanje glede na vhodni parameter ID iz
posamezne tabele;

fetchDbLimit – metoda vrne podatke glede na določene omejitve, ki se uporabljajo za
paginacijo elementov pri izpisu iz baze. Kot vhodne parametre definiramo Limit –
število elementov na stran, Table – tabelo iz katere izpisujemo, OrderType – vrstni red
izpisa ter LanguageID – parameter, ki ga pridobimo glede na izbran jezik;

fetchDbSearch – metoda vrne izpis zadetkov iz podatkovne baze glede na vnos
iskanega niza.
53
4.3.2
View
Vsak modul v administraciji uporablja svoj »Controller« oziroma del, ki se nanaša na
poslovno logiko, ter skrbi za logiko celotnega modula. Prav tako ima vsak posamezni modul
ločene »View« oziroma predstavitvene sloje, in sicer:

X_view.php – predstavitveni sloj, ki skrbi za izpis vseh dodanih elementov v
podatkovni bazi določenega modula;

X_add_view.php – predstavitveni sloj, ki vsebuje formular za vnos podatkov v
podatkovno bazo;

X_edit_view.php – predstavitveni sloj, ki vsebuje formular za urejanje vnosa iz
podatkovne baze.
V zgornjem primeru je X – ime posameznega modula, na katerega se nanaša.
4.3.3
Controller
Posamezni »Controller« v administraciji vsebuje metode, kot so index, add, edit, delete, post
in status. Opis posameznih metod so sledeči:

Index – metoda skrbi za izpis podatkov iz podatkovne baze in uporablja »View«
X_view.php za izpis podatkov;

Add – izpiše formular za dodajanje podatkov v podatkovno bazo in uporablja »View«
X_add_view.php;

Edit – metoda dobi kot vhodni parameter ID elementa, katerega želimo urejati. V
primeru, da ID v podatkovni bazi ne obstaja, se izvede preusmeritev na Index()
metodo. Kot predstavitveni sloj uporablja X_edit_view.php za prikaz formularja za
urejanje elementa z vnesenimi podatki;

Delete – metoda se uporablja za brisanje vnosa. Kot vhodni parameter pridobi ID,
katerega preveri v podatkovni bazi in v primeru, da zapis obstaja, poskrbi za
odstranitev;

Post – metoda skrbi za shranjevanje podatkov v bazo. Glede na to, da se uporablja
AJAX za asihrono pošiljanje podatkov formularja, imamo v vsakem »Controllerju«
posledično post metodo, ki se sproži ob pošiljanju formularja. Ta poskrbi za validacijo
vseh vnosnih polj, za izpis napak v primeru nepravilnosti ter za shranjevanje podatkov
v podatkovno bazo.
54
V home »Controllerju« imamo le index metodo, ki skrbi za izpis glede na vhodni parameter
URI. URI je lahko sestavljen največ iz dveh nizov. V primeru, da uporabljamo več jezikov, je
URI sestavljen iz dveh nizov. Prvi niz je ime jezika oziroma TitleShort atribut iz podatkovne
tabele Language, drugi niz pa je MenuUrl, ki je shranjen v tabeli Menu. Če imamo več
jezikov in je jezik nastavljen kot privzet, se nivo zmanjša v URI-ju na izpis MenuUrl - ja. URI
z dvema nivojema je zapisan v obliki »si/ime-zelene-spletne-strani.html«, kadar imamo le en
nivo, torej samo en jezik, pa je URI-ja zapisan v obliki »ime-zeljene-spletne-strani.html«.
Slika 4.1: Primer Controllerja za Gallery modul
Vir: Zupančič, lastni prikaz (2015)
Glavno delo »home controller«- ja je, da glede na vhodni parameter izpiše spletno stran, ki je
definirana z določenim URL naslovom. Tako glede na vhodni parameter preveri, če menijska
postavka s tem URL naslovom obstaja in hkrati če obstaja spletna stran, ki je bila dodana na
ta URL naslov. V primeru, da je URL naslov enak tistemu v podatkovni bazi, izpiše spletno
stran z vsemi dodanimi elementi in blokovsko ureditvijo, kakor smo jo definirali v
administraciji. V nasprotnem primeru nas preusmeri na privzeto nastavljeno spletno stran
določenega jezika.
55
5. ZAKLJUČEK
Izdelava spletne aplikacije je v današnjem času relativno enostavna, saj je na spletu na voljo
kar nekaj tako imenovanih spletnih ogrodij, s pomočjo katerih lahko spletne aplikacije
izdelamo v zelo kratkem času in na višjem nivoju. Medtem ko samostojne PHP skripte
uporabljajo proceduralni način programiranja, je izdelava spletnih aplikacij s pomočjo
spletnih ogrodij objektno orientirana. Ogrodja uporabljajo MVC vzorec, ki ima predstavitveni
sloj ločen od poslovne logike delovanja celotne aplikacije, kar je še posebej pri večjih
kompleksnih aplikacijah velika prednost.
V diplomski nalogi smo opravili analizo izbire optimalnega spletnega ogrodja za izdelavo
spletne aplikacije. Podrobneje smo obravnavali pet najpogosteje uporabljenih ogrodij in na
podlagi analize izbrali tisto, ki bi bilo najbolj smiselno za našo aplikacijo. V ožjem izboru sta
bili ogrodji Laravel in Codeigniter, ki sta kvalitetno dokumentirani in dokaj enostavni za
uporabo. Codeigniter je primeren predvsem za manj kompleksne aplikacije, medtem ko je
Laravel bistveno boljši za izdelavo kompleksnih aplikacij. Prednost Laravel-a je predvsem v
uporabi Composerja, s pomočjo katerega zelo enostavno implementiramo dodatne knjižnice
in druge pakete, ki jih potrebujemo v projektu.
Ugotavljali smo tudi, ali je bolj smiselno izdelati spletno aplikacijo povsem v lastni izvedbi
oziroma uporabiti že v naprej izdelane odprtokodne sisteme. Na podlagi celotne analize in
presoje smo se odločili, da izdelamo sistem v lastni izvedbi, saj se tako najbolj približamo
realizaciji naših želja in potreb. Za izdelavo splošno namenskega CMS sistema v lastni
izvedbi smo kot optimalno ogrodje izbrali Codeigniter, predvsem zato, ker smo že imeli kar
nekaj predhodnih izkušenj z uporabo omenjenega ogrodja.
V uvodu naloge smo določili tri hipoteze, ki so nam bile v pomoč pri izbiri spletnega ogrodja
za izdelavo spletne aplikacije. Prvo hipotezo, ki se glasi: »Odprtokodni CMS sistemi imajo
bistveno več prednosti kot CMS sistemi, izdelani v lastni izvedbi«, smo po opravljeni analizi
potrdili. Drugo hipotezo, ki se glasi: »Ogrodja se med seboj močno razlikujejo po
razpoložljivih virih, ki so za programerja nujno potrebni pri razvoju produkta (navodila,
skupnost, rešitve problemov …)«, smo po analizi prav tako potrdili. Tretja hipoteza se glasi:
»Ogrodja se med seboj razlikujejo po podprtih funkcionalnostih, zato verjetno nekatera ne
podpirajo vseh komponent in funkcionalnosti, ki jih bomo potrebovali pri izdelavi želenega
56
sistema«. Na podlagi hipotez smo se lažje odločili za izvedbo splošno namenskega CMS
sistema s pomočjo spletnega ogrodja Codeigniter.
V praktičnem delu diplomske naloge smo v celoti opisali postopek izdelave spletne aplikacije,
funkcionalnost posameznih modulov, njihovo podatkovno strukturo in opisali vse funkcije, ki
so uporabljene v sistemu ter opredelili njihov namen.
Če bi se danes ponovno odločali za izdelavo spletnega sistema s pomočjo katerega koli
ogrodja, bi se najverjetneje odločili za Laravel, saj se je v praksi izkazalo, da je kljub
kompleksnosti eno izmed najboljših spletnih ogrodij, ki trenutno obstajajo na trgu.
57
58
6. LITERATURA IN VIRI
1. 1A INTERNET (2014) Izdelava mobilnih spletnih strani - responsive design.
Dostopno prek: http://www.1ainternet.net/izdelava-mobilne-strani.html (23.4.2015).
2. ADERMANN, NILS in BOGGIANO, JORDI (2015) Composer: Introduction.
Dostopno prek: https://getcomposer.org/doc/00-intro.md (22.5.2015).
3. BREŠČAK, BORUT (2010a) Kaj je HTML? Dostopno prek: http://www.ssers.mb.edus.si/gradiva/rac/moduli/spletne_aplikacije/20_html/02_datoteka.html
(7.2.2015).
4. BREŠČAK, BORUT (2010b) Uvod v JavaScript. Dostopno prek: http://www.ssers.mb.edus.si/gradiva/rac/drugo/javascript/01_mapa/01_datoteka.html (14.5.2015).
5. COGNEAU, ALEXANDER (2013) Yet Another PHP Framework? Dostopno prek:
http://www.sitepoint.com/phalconphp-yet-another-php-framework/ (3.5.2015).
6. DITEA (2015) Model–View–Controller – MVC. Dostopno prek:
http://www.ditea.si/sl/tehnologije/ (22.4.2015).
7. KOVAČIČ, MATJAŽ (2010) Analiza in primerjava PHP ogrodij na primeru izdelave
spletnega dnevnika. Diplomsko delo. Maribor: Univerza v Mariboru, Fakulteta za
elektrotehniko, računalništvo in informatiko. Dostopno prek:
https://dk.um.si/Dokument.php?id=18449&lang=eng (7.2.2015).
8. LARAVEL (2014) Laravel: Introduction – Laravel. Dostopno prek:
http://laravel.com/docs/4.2/introduction (3.5.2015)
9. LEMAJIČ, JANI (2010) JavaScript ogrodje jQuery. Diplomsko delo. Maribor:
Univerza v Mariboru, Fakulteta za elektrotehniko, računalništvo in informatiko.
Dostopno prek: https://dk.um.si/Dokument.php?id=20870 (12.5.2015)
10. LLC (2015) About Yii. Dostopno prek: http://www.yiiframework.com/about/
(3.5.2015).
11. LOCKHART, JOSH (2015) PHP: The right way. Dostopno prek:
http://sl.phptherightway.com/ (14.5.2015).
12. MARINŠEK, BOŠTJAN (2010) Razvoj predstavitvene logike spletnih aplikacij z
uporabo sodobnih ogrodij. Diplomsko delo. Maribor: Univerza v Mariboru, Fakulteta
za elektrotehniko, računalništvo in informatiko. Dostopno prek:
https://dk.um.si/Dokument.php?id=13892 (12.5.2015).
59
60
13. OHRT, MONTE (2015) All about Smarty. Dostopno prek:
http://www.smarty.net/about_smarty (22.5.2015).
14. POLC, ŽIGA (2012) Kaj so SASS, LESS in Stylus? Dostopno prek:
http://www.pomagalnik.com/slovar/kaj-so-sass-less-in-stylus/ (12.5.2015).
15. PRESENTIA (2008) Kaj je javascript? Dostopno prek: http://www.presentia.si/bazaznanja-helpdesk/2008/kaj-je-javascript/ (7.2.2015).
16. REYES, JOEL (2009) Discussing PHP Frameworks: What, When, Why and Which?
Dostopno prek: http://www.noupe.com/development/discussing-php-frameworks.html
(24.12.2014).
17. SENSIOLABS (2014) What is Symfony. Dostopno prek: http://symfony.com/what-issymfony (03.05.2015).
18. SKVORC, BRUNO (2013) Best PHP Frameworks for 2014. Dostopno prek:
http://www.sitepoint.com/best-php-frameworks-2014/ (22.12.2014).
19. STROSAR, EDI (2008) Vrivanje SQL od A do Ž. Dostopno prek:
http://www.monitor.si/clanek/vrivanje-sql-od-a-do-z/123404/ (12.5.2015).
20. ŠUNTA, BLAŽ (2012) Kaj pomeni oznaka CSS? Dostopno prek: http://www.spletninasveti.si/kaj-je-css/ (7.2.2015).
21. TECHNOLOGY, BRITISH COLUMBIA INSTITUTE (2015) Welcome to
CodeIgniter. Dostopno prek:
http://www.codeigniter.com/userguide3/general/welcome.html (3.5.2015).
22. TWIG (2012) TWIG: Introduction. Dostopno prek:
http://twig.sensiolabs.org/doc/intro.html (22.5.2015).
23. UNDERWOOD, PAUL (2014) Pauland - PHP Template Engines. Dostopno prek:
http://www.paulund.co.uk/php-template-system (23.4.2015).
24. VINING, ROBERT (2008) Static HTML Web Pages vs. Content Management
Systems. Dostopno prek: http://www.robertswebdesign.com/blog/website-design/12static-html-web-pages-vs-content-management-systems (24.12.2014).
25. ZANDSTRA, MATT (2004) Naučite se PHP v 24 urah. Ljubljana: Pasadena.
26. ŽUPEC, NEJC (2012) Twitter Bootstrap in razvoj spletnega repozitorija za Cacti.
Diplomsko delo. Ljubljana: Univerza v Ljubljani, Fakulteta za računalništvo in
informatiko, Fakulteta za matematiko in fiziko. Dostopno prek: http://eprints.fri.unilj.si/1862/1/%C5%BDupec-1.pdf (14.5.2015).
61
62
PRILOGA
Uporabljene kratice
Priloga: Uporabljene kratice
Kratica
Angleški pomen
PHP
Hypertext Preprocessor
HTML
Hyper Text Markup Language
Hipertekstovni označevalni jezik
CSS
Cascading Style Sheets
Stilska predloga za videz spletne strani
LESS
Less
Predprocesorski CSS
CI
Codeigniter Framework
Codeigniter ogrodje
AJAX
Asynchronous
Slovenski pomen
JavaScript
XML
Skriptni jezik za razvoj dinamičnih
spletnih strani
and
Asihroni Javascript in Xml
URI
Uniform Resource Identifier
Enolični identifikator vira
URL
Uniform Resource Locator
Enolični krajevnik vira
SQL
Structured Query Language
Strukturni povpraševalni jezik
CMS
Content Managment System
Sistem za upravljanje s vsebinami
MVC
Model View Controller
Model, pogled, kontrolnik