d i p l o m s k a naloga

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. UVOD ................................................................................................................................. 1

1.1 Opis problema .............................................................................................................. 1

1.2 Hipoteze ....................................................................................................................... 2

1.3 Cilj raziskave ............................................................................................................... 2

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. 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

4. 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 Integracija ogrodja .................................................................................................... 52

4.3.1 Model .................................................................................................................. 52

4.3.2 View .................................................................................................................... 54

4.3.3 Controller ........................................................................................................... 54

5. 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

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

2

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.

3

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)

4

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 ...,

5

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)

6

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


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.

7

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)

8

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


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,

9

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.

10

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)

11

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


12

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)

13

Slika 2.6: Primer SQL poizvedbe


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


14

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


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)

15

Slika 2.9: Primer uporabe Twig


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


16

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

17

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

18

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.

19

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,

20

ž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.

21

Tabela 2.1: Primerjava ogrodij

Laravel Phalcon Symfony2 Codeigniter Yii

Licenca MIT BSD MIT BSD BSD

Zadnja posodobitev Maj 2015 Maj 2015 Maj 2015 Marec 2015 Marec 2015

Verzija 5.1 2.0.1 2.6.7 3.0 2.0.3

Minimalne zahteve PHP 5.3.7 PHP 5.3 PHP 5.3.2 PHP 5.1.6 PHP 5.4

Generacija kode CLI / CLI / Yii CLI, Gii

ORM ELOQUENT

ORM

/ Doctrine2,

Propel

AR AR, DAO

Servisi / / / XML-RPC Soap / Web

Service

Templating sistem Blade, PHP / PHP, Twig PHP PHP, Prado

Avtentikacija Da Ne Da Ne Ne

XSS Da Da Da Da Da

CSRF Da Da Da Da Da

SQL vrivanje Da Da Da Da Da

Enostavnost 5 3 3 5 4

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

22

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

23

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

http://laravel.com/

https://laracasts.com/

24

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.

25

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:

26

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 Sistemi izdelani v lastni izvedbi

- Konstantne posodobitve

- Večji nabor uporabnikov

- Enostavnost implementacije

- Večja podpora uporabnikom ob

dodatnih spremembah

- Večja ranljivost

- Možno lastno poseganje in

popravljanje kode

- 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


27

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.

28

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 Laravel

- Odlična dokumentacija

- Enostavna uporaba za začetnika

- Majhna velikost

- Podpora na starejših strežnikih

- Dobra podpora s strani skupnosti

- Zelo dobro razdelan arhitekturni vzorec

ogrodja

- Težji za uporabo za začetnike

- Primernejši za izdelavo kompleksnejših

aplikacij

- Enostavna implementacija dodatnih paketov


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.

29

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.

30

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

31

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

32

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.

33

Slika 3.1: CSS/Less stilski urejevalec


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.

34

Slika 3.2: Html urejevalnik


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,

35

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


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:

36

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


37

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


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

38

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


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


39

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


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.

40

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


41

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

42

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 Tip

ContactFormID int(255)

LanguageID int(255)

Form text

Message text


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.

43

Tabela 4.2: Tabela ContactFormLog

ContactFormLog

Atribut Tip

ContactFormLogID int(255)

LanguageID int(255)

Message text

Tip varchar(255)

TimeStamp bigint(255)


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 Tip

GalleryID int(255)

Title varchar(255)

Image varchar(255)

GalleryCategoryID int(255)

AuthorID int(10)

TimeStampAdded bigint(20)

Status int(1)


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

44

dodane kategorije, LanguageID – tuj ključ tabele Language ter Status – status prikazane

oziroma skrite kategorije.

Tabela 4.4: Tabela GalleryCategory

GalleryCategory

Atribut Tip

CategoryID int(255)

Title varchar(255)

Content longtext

CategoryUrl varchar(255)

AuthorID int(10)


LanguageID int(255)

Status int(1)


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 Tip

SliderID int(255)

Title varchar(255)

Image varchar(255)

Order int(255)

AuthorID int(10)


Status int(1)


45

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 Tip

LanguageID int(255)

Title varchar(255)

TitleShort longtext

AuthorID int(10)


DefaultLanguage int(1)

Status int(1)


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.

46

Tabela 4.7: Tabela Menu

Menu

Atribut Tip

MenuID int(255)

Title varchar(255)

PageID int(255)

AuthorID int(10)


MenuUrl varchar(255)

MenuCategoryID int(255)

ParentMenuID int(255)

Path varchar(255)

Position int(255)

LanguageID int(255)

Status int(1)


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 Tip

CategoryID int(255)

Title varchar(255)

Content longtext

AuthorID int(10)


LanguageID int(255)

Status int(1)


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

47

– 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 Tip

NewsID int(255)

Title varchar(255)

Description text

Content text

Logo varchar(255)

NewsUrl varchar(255)

NewsCategoryID int(255)

AuthorID int(10)


LanguageID int(255)

Status int(1)


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.

48

Tabela 4.10: Tabela NewsCategory

NewsCategory

Atribut Tip

CategoryID int(255)

Title varchar(255)

Content longtext

AuthorID int(10)


LanguageID int(255)

Status int(1)


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.

49

Tabela 4.11: Tabela Page

Page

Atribut Tip

PageID int(255)

Name varchar(255)

Title varchar(255)

PageContentTitle varchar(255)

PageContent longtext

AuthorID int(10)

CssID int(255)

HtmlID int(255)

Block text

PageCategoryID int(255)

MetaKeywords text

MetaDescription text

ContactForm int(11)


DefaultPage int(1)

LanguageID int(255)

Status int(1)


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 Tip

CategoryID int(255)

Title varchar(255)

Content longtext

AuthorID int(10)


LanguageID int(255)

Status int(1)


50

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 Tip

BlockID int(255)

Title varchar(255)

BlockFile varchar(255)

AuthorID int(10)


LanguageID int(255)

Status int(1)


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.

51

Tabela 4.14: Tabela TemplateCss

TemplateCss

Atribut Tip

CssID int(255)

Title varchar(255)

CssFile varchar(255)

CssFileLess varchar(255)

AuthorID int(10)


Status int(1)


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 Tip

HtmlID int(255)

Title varchar(255)

HtmlFile varbinary(255)

AuthorID int(10)


Status int(1)


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

52

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 Tip

UserID int(255)

UserName varchar(255)

Password varchar(255)


TimeStampLogged bigint(20)

IP varchar(255)

Type int(11)

Status int(11)


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;

53

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.

54

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.

55

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


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.

56

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

57

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.

59

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.s-

sers.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.s-

sers.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).

http://www.1ainternet.net/izdelava-mobilne-strani.html

https://getcomposer.org/doc/00-intro.md

http://www.s-sers.mb.edus.si/gradiva/rac/moduli/spletne_aplikacije/20_html/02_datoteka.html

http://www.s-sers.mb.edus.si/gradiva/rac/moduli/spletne_aplikacije/20_html/02_datoteka.html

http://www.s-sers.mb.edus.si/gradiva/rac/drugo/javascript/01_mapa/01_datoteka.html

http://www.s-sers.mb.edus.si/gradiva/rac/drugo/javascript/01_mapa/01_datoteka.html

http://www.sitepoint.com/phalconphp-yet-another-php-framework/

http://www.ditea.si/sl/tehnologije/

https://dk.um.si/Dokument.php?id=18449&lang=eng

http://laravel.com/docs/4.2/introduction

https://dk.um.si/Dokument.php?id=20870

http://www.yiiframework.com/about/

http://sl.phptherightway.com/

https://dk.um.si/Dokument.php?id=13892

61

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/baza-

znanja-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-is-

symfony (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.spletni-

nasveti.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/12-

static-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.uni-

lj.si/1862/1/%C5%BDupec-1.pdf (14.5.2015).

http://www.smarty.net/about_smarty

http://www.pomagalnik.com/slovar/kaj-so-sass-less-in-stylus/

http://www.presentia.si/baza-znanja-helpdesk/2008/kaj-je-javascript/

http://www.presentia.si/baza-znanja-helpdesk/2008/kaj-je-javascript/

http://www.noupe.com/development/discussing-php-frameworks.html

http://symfony.com/what-is-symfony

http://symfony.com/what-is-symfony

http://www.sitepoint.com/best-php-frameworks-2014/

http://www.monitor.si/clanek/vrivanje-sql-od-a-do-z/123404/

http://www.spletni-nasveti.si/kaj-je-css/

http://www.spletni-nasveti.si/kaj-je-css/

http://www.codeigniter.com/userguide3/general/welcome.html

http://twig.sensiolabs.org/doc/intro.html

http://www.paulund.co.uk/php-template-system

http://www.robertswebdesign.com/blog/website-design/12-static-html-web-pages-vs-content-management-systems

http://www.robertswebdesign.com/blog/website-design/12-static-html-web-pages-vs-content-management-systems

http://eprints.fri.uni-lj.si/1862/1/%C5%BDupec-1.pdf

http://eprints.fri.uni-lj.si/1862/1/%C5%BDupec-1.pdf

PRILOGA

Uporabljene kratice

Priloga: Uporabljene kratice

Kratica Angleški pomen Slovenski pomen

PHP Hypertext Preprocessor Skriptni jezik za razvoj dinamičnih

spletnih strani

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 JavaScript and

XML 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

d i p l o m s k a naloga

Documents