Sveučilište J.J. Strossmayera u OsijekuOdjel za matematiku

Sveučilišni preddiplomski studij matematike

Mirna MarkovićIzrada web aplikacije u Django razvojnom okruženju

Završni rad

Osijek, 2014.

Sveučilište J.J. Strossmayera u OsijekuOdjel za matematiku

Sveučilišni preddiplomski studij matematike

Mirna MarkovićIzrada web aplikacije u Django razvojnom okruženju

Završni rad

Voditelj : izv. prof. dr. sc. Domagoj Matijević

Osijek, 2014.

Sažetak:Predmet ovog završnog rada jest izrada web aplikacije u Django razvojnom okruženju, od-nosno uz pomoć frameworka Django. U prvom, teoretskom, dijelu ukratko je objašnjenutjecaj i doprinos programskog jezika Python razvojnom okruženju Django. Nakon togaopisano je čemu framework Django služi i povijest njegova nastanka. U kratkim crtama opi-sana je arhitektura Django aplikacije i proces instalacije tog softverskog okruženja. Drugi,praktični, dio donosi opis i tijek izrade web aplikacije u Djangu. Okosnica tog praktičnogdijela je izrada web aplikacije mathos_Instrukcije namijenjene studentima osječkog Odjelaza matematiku. Objašnjena je temeljna Django struktura uz primjere koda i slike aplikacije.Prikazan je način stvaranja jedinstvenog dizajna i na kraju je dan pregled nekih sigurnosnihznačajki Django razvojnog okruženja. Zadnje poglavlje ukratko opisuje uvezene aplikacijeiz baze gotovih, licenciranih, Django aplikacija.

Ključne riječi:Django, Python, framework, web aplikacija, modeli, pogledi, predlošci, forme, URL

Abstract:The subject of this final work is development of web application in Django developmentenvironment, or with Django framework. The first, theoretical, part briefly explains the im-pact of Python programming language on development of Django framework. The purposeof Django framework is described in the next section as well as history of its origin. Thearchitecture of Django application and installation process is shortly described. Second andpractical part of this work describes a process of building a web application using Django.Development of web application mathos_Instrukcije, intended for students of Departmentof Mathematics in Osijek is the backbone of that practical part. Furthermore, the basicDjango architecture is described and explained with practical examples. It is also shownhow to create a unique design for whole application and at the end Django security featuresare listed. The final chapter describes reusable applications installed within this project.

Key words:Django, Python, framework, web application, models, views, templates, forms, URL

1

Sadržaj1 UVOD 3

2 PYTHON 42.1 Što je Python . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42.2 Načini izvođenja Python programa . . . . . . . . . . . . . . . . . . . . . . . 4

3 DJANGO 53.1 Općenito o frameworku Django . . . . . . . . . . . . . . . . . . . . . . . . . 53.2 Povijesni razvoj Djanga . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53.3 Gotovi alati za standardni postupak web razvoja koje Django sadrži . . . . . 53.4 MVC arhitektura . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63.5 Instalacija Djanga . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

4 STVARANJE PROJEKTA I WEB APLIKACIJE POMOĆU DJANGA 104.1 Opis projekta . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104.2 Django projekt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104.3 Django aplikacije . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 114.4 Baza podataka . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134.5 Administratorska stranica . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164.6 Forme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174.7 Pogledi i URL-ovi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

4.7.1 Stvaranje pogledi (engl. views) . . . . . . . . . . . . . . . . . . . . . 184.7.2 Mapiranje URL-a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

4.8 Predlošci i dizajn . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 214.8.1 Dizajn . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224.8.2 Stvaranje predložaka i krajnji izgled aplikacije . . . . . . . . . . . . . 23

4.9 Sigurnost Django razvojnog okruženja . . . . . . . . . . . . . . . . . . . . . . 25

5 DJANGO PACKAGES I UVEZENE DJANGO APLIKACIJE 265.1 django-allauth . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265.2 Haystack . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 275.3 django-secretballot i django-likes . . . . . . . . . . . . . . . . . . . . . . . . 27

6 ZAKLJUČAK 28

7 LITERATURA 29

2

1 UVODGoogle, Twitter, Facebook i YouTube čine svakodnevicu pretraživanja i korištenja inter-

netskih usluga. Pri posjetu neke od navedenih ili njima sličnim stranicama korisnik zapravopristupa web aplikacijama. Web aplikacije su programska rješenja kojima se pristupa pu-tem internet preglednika, one povezuju korisnika sa internetskom uslugom koja omogućujeizvršavanje različitih zadataka. To su pristupačni i sigurni programi koje nije potrebno insta-lirati na računalo nego se pokreću u pregledniku, te je tako korisnikovo računalo zaštićeno odvirusa i zlonamjernih i špijunskih softvera. Popularnost web aplikacija vrtoglavo raste zbogčinjenice da su dostupne u bilo koje vrijeme, na bilo kojem mjesta i sa bilo kojeg uređajakoji je povezan sa internetom. Također, velika je prednost web aplikacije nad računalnimsoftverom jer se održavanje svodi na održavanje same web aplikacije a ne pojedinih instali-ranih softvera.

Zbog naglog rasta popularnosti web aplikacija i njihove široke primjene, javila se potrebaza automatiziranim programskim rješenjima koji će olakšati i ubrzati njihovu izradu. Danaspostoje različita programska riješenja za izradu dinamičkih web aplikacija, a u ovom raduopisano je jedno od njih, izrada web aplikacije u Django razvojnom okruženju.

Django je Pythonow web framework, programerski alat pisan u programskom jezik Pyt-hon koji služi za izradu web stranica i aplikacija. Django je relativno novi web frameworkkreiran za brzu i jednostavnu izradu, ali ne nužno jednostavnih web aplikacija. Glavni prin-cip razvoja aplikacije u Django okruženju jest DRY (engl. Don’t repeat yourself ) što značida je cilj izbjeći nepotrebno ponavljanje koda.Ovaj rad pruža kratak uvid u Django razvojno okruženje i objašnjava izradu same webaplikacije u istome. Prvo je u poglavlju Python ukratko opisan programski jezik Pythoni njegove karakteristike. Zatim je u poglavlju Django iznesen općeniti pregled Django ra-zvojnog okruženja, povijest, neki alati te način instalacije i konfiguracije. Praktični radi,odnosno izrada web aplikacije mathos_Instrukcije opisana je u poglavlju Stvaranje projektai web aplikacije pomoću Djanga. mathos_Instrukcije je web aplikacija namijenjna studen-tima osječkog Odjela za matematiku, a čini bazu instrukcija za predmete na Odjelu. Zadnjepoglavlje donosi kratak pregled uvezenih aplikacija iz Django Pckagesa.

3

2 PYTHON

2.1 Što je PythonPython je razvijen 1990. godine što ga čini relativno mladim programskim jezikom, zbog

svog čitljivog, jasnog, jednostavnog i lako usvojivog koda brzo je postao popularan. Prijesvega Python je interpreterski, interaktivni, objektno orijentirani programski jezik. Karakte-ristika interpreterskog jezika pripala mu je jer se naredbe izvornog koda analiziraju i prevodeu trenutku izvođenja. Jezik je visoke razine jer posjeduje ugrađene tipove podataka kao štosu liste, n-terci i rječnici. Za razvoj programa u Pythonu svojstven je interaktivan načinrada, odnosno pisanje naredbe za naredbom što nazivamo razvojni okoliš. Postoji i tzv.izvedbeni (engl. runtime) okoliš u kojem se odjednom izvodi cijela skripta. Jednostavnostjezika krije se u čistoj sintaksi, a pravilno uvlačenje blokova je nužno što dodatno pridonosičitljivosti i preglednosti koda. Kao moderan programski jezik, Python nudi objektno orijenti-rano programiranje s višestrukim nasljeđivanjem, dohvaćanjem iznimaka (engl. exception),redefiniranje standardnih operatora, pretpostavljene argumente, module i pakete. Bitnaznačajka jest i Pythonova biblioteka (engl. library) koja uključuje preko 200 modula odnajjednostavnijih do onih za izradu web-servera. Bitna je i činjenica da se zajednica Pythonkorisnika kao i zajednica Django korisnika iz godine u godinu udvostručuje. (vidi [2])

2.2 Načini izvođenja Python programaPython je široko dostupan i besplatan programski jezik. Instalacija je jednostavna, a sve

potrebno može se pronaći na službenoj stranici www.python.org. Framework Django pisanje u programskom jeziku Python, što znači da je i svaka web aplikacija koja se razvija u tomframeworku napisana u Pythonu. Iz tog razloga je za izradu web aplikacije u frameworkuDjango potrebno osnovno poznavanje programiranja u Pythonu.

Python kod može se izvoditi na više načina. Prvi je interaktivan način rada, a drugiskriptni način rada.

1. Interaktivan rad: Nakon instalacije, sljedeći korak je otvaranje naredbene linije naračunalu i pokretanje Pythonovog interaktivnog interpretera ukucavanjem naredbepython. Ovaj način rada dopušta korisniku ukucavanje jedne po jedne linije Pythonkoda i provjeravanje rezultata u stvarnom vremenu. Interpreter ispisuje svoj prompt>>>, iza kojeg korisnik unosi naredbu, a završava ju pritiskom tipke ENTER. Nakontoga Python izvodi danu naredbu, ispisuje rezultat i ponovno ispisuje prompt za novunaredbu. Takav interaktivan način rada pruža korisniku veću slobodu pri kreiranjukoda. U Windows okruženju postoji više grafičkih rješenja za interaktivan način rada,a u instalacijskom paketu sa Pythonom dolazi IDLE koji je razvio Pythonov autor ikoji se koristi i u ovom radu za uređivanje Python skripti.

2. Skriptni rad: Kod ovoga načina rada Python programi se spremaju u skripte sa eks-tenzijom py. koristeći Python grafičko okruženje ili običan alat za uređivanje teksta.Nakon spremanja koda u skripte, one se pozivaju iz naredbene linije računala nared-bom: python moja_skripta.py, Python program se izvodi i na zaslonu naredbenelinije se ispisuje traženi rezultat.

4

3 DJANGO

3.1 Općenito o frameworku DjangoKao svaki framework, tako je i Django zapravo skup standardiziranih alata i biblioteka

koje programeru web aplikacije olakšavaju izradu i brigu o povezivanju svih njezinih dijelova.Django pripada novoj generaciju web frameworka koji su pisani pristupačnim programskimjezicima kao što Python i Ruby. Svaki od tih frameworka je poseban na svoj način u odnosuna organizaciju koda i mogućnosti koje pruža korisniku, ali svi imaju isti cilj; pružiti inte-griran skup komponenti, koji je jednostavan i pregledan za rukovanje, a zamjenjuje napornezadatke web razvoja i ponavljanje koda (vidi [1]). Django je web framework otvorenog koda,pisan u Pythonu, dinamičkom i objektno orijentiranom programskom jeziku koji se odlikujevrlo čistom i čitljivom sintaksom. Django je prvenstveno dizajniran kako bi se nosio sa dvaglavna zadatka:

• reduciranje vremena potrebnoga za izradu web aplikacije

• poštivanje strogih zahtjeva iskusnih web programera koji su ga stvorili

Zahvaljujući navedenim kriterijima Django omogućuje brzu izradu elegantnih i korisnih webaplikacija, pa mu se pridaje obilježje frameworka za perfekcioniste sa rokom (vidi [5]).

3.2 Povijesni razvoj DjangaDjango je razvijen 2003. godine iz jednostavnog skupa alata koji je koristio tim web

novinara, Adrian Holovaty i Simon Willison, u malenom gradiću u Kanzasu. Kako su seučestalo utrkivali sa vremenom, neprestano ponavljanje istoga koda, istih upita u bazu, teistih predložaka navelo ih je da u nekoliko godina razviju skup biblioteka koje su zajednoodlično funkcionirale. Automatiziranjem svakodnevnih zadataka svojstvenih za razvoj inte-raktivne web stranice ubrzali su posao i učinili ga efektivnijim. Skup tih biblioteka puštenje u javnost 2005. godine, kao otvoren kod (engl. open source) tako da ga svatko može una-prijediti i doraditi. U čast jazz gitaristu Django Reinhrdtu navedeni skup biblioteka danasse naziva "Django".

Od 2008. godine za razvoj Django frameworka skrbi DSF (engl. Django Software Foun-dation). Django je kontinuirano razvijan 2 godine i to bez korištenja do tada već postojećihDjango modula (engl. from scratch). Zadnja stabilna verzija, Django 1.7, puštena je ujavnost 2.9.2014. godine. Današnja egzistencija i dostupnost Django razvojnog okruženjazasnovana je na besplatnim i dostupnim projektima kao što su Python, PostgreSQl, Apachei drugi.

3.3 Gotovi alati za standardni postupak web razvoja koje Djangosadrži

Najjednostavnijim jezikom, Django je skup dobro testiranih i integriranih alata koji za-mjenjuju sve dijelove web razvoja koji podrazumijevaju ponavljanje istog koda. Djangosadrži sljedeće alate: (vidi [1])

5

• biblioteke koje povezuju objekte iz baze podataka uz pomoć relacija među njima i kodaaplikacije, te ih spaja bez pisanja SQL naredbi (engl. objectrelation mapper)

• skup HTTP biblioteka koje znaju kako se nositi sa zahtjevima korisnika, odnosno kakoih prikazati u prikladnom formatu te na kraju kako prikazati korisniku rezultate togazahtjeva dobivene iz koda aplikacije (engl. HTTP libraries)

• biblioteka za definiranje URL-a, dopušta definiranje elegantnoga i preglednog URL-ai dodjeljuje ga odgovarajućem dijelu koda (engl. URL routing library)

• biblioteka za prikaz formi i potvrdu unosa od strane korisnika

• sustav predložaka koji dopušta kombiniranje HTML koda i podataka iz koda aplikacijeza prezentiranje podataka korisniku

U Django okruženju su pojednostavljeni zadatci koji u mnogim programskim jezicimapredstavljaju mukotrpan posao, te je njihovo učestalo ponavljanje svedeno na minimum,kao na primjer:

• autentifikacija i autorizacija korisnika,

• korisnička prava,

• komunikacija s bazom podataka,

• konfiguriranje URL-ova,

• izrada sučelja za administratora i

• validacija unesenih podataka.

3.4 MVC arhitekturaDjango koristi MVC (engl. Model-View-Controller) arhitekturu za razdvajanje logike

same aplikacije od prikazanog dijela aplikacije. MVC arhitektura se u osnovi sastoji od tridijela:

• Model (engl. Model) je model podataka u bazi podataka

• Pogled (engl. View) je prikaz modeliranih podataka (ono što vidi krajnji korisnik) i

• Upravitelj (engl. Controller) je upravitelj korisničkim zahtjevima, zadužen za logikuaplikacije

Za navedene dijelove MVC arhitekture utvrđena je interakcija među njima. Upravitelj možeslati naredbe modelu kako bi ažurirao njegovo stanje, no može slati naredbe i u poglede ko-jima mijenja prikaz modela. Nadalje, model dojavljuje sebi i pridruženim pogledima kadadođe do promjene od strane upravitelja kako bi se prikazalo obnovljeno stanje. Također,kako bi se prikazao model korisniku, pogled zahtijeva od modela informacije potrebne zastvaranje prikaza.

6

Slika 3.1:Interakcija modela, pogleda i upravitelja u MVC arhitekturi

Slika 3.1 prikazuje interakciju modela, pogleda i upravitelja u MVC arhitekturi. Punelinije označavaju izravnu vezu između navedenih elemenata za razmjenu podataka, dok is-prekidane linije označavaju vezu kod koje neki drugi objekt vrši tu funkciju.

Django koristi drugačije nazive elemenata MVC-a. Kako pogled predstavlja podatke vid-ljive korisniku u Django arhitekturi to zamjenjuje predložak (engl. template), a upraviteljazamjenjuje pogled (engl. view). Django koristi takav način jer u Djangu pogled predstavljapodatke koji se prezentiraju, a predložak način na koji se podatci prezentiraju. Stoga bise u slučaju Djanga zapravo trebalo reći da se radi o MTV (engl. Model-Template-View)arhitekturi.

Slika 3.2:Dijagram toka u Django aplikaciji

Na slici 3.2. prikazan je tijek podataka i informacija u Django aplikaciji. Prvo korisniku svom internet pregledniku (engl. Web Browser) upiše adresu Django aplikacije, zatim tuadresu dohvaća modul za prosljeđivanje URL-ova (engl. URL Dispatcher). Taj se modulsastoji od regularnih izraza prema kojima se odabire pogled koji će biti aktiviran. Pogledkomunicira s modelima koji su zaduženi za komunikaciju s bazom podataka. Model vraćapogledu podatke iz baze koji se zatim šalju predlošku (najčešće HTML). Predložak generiraHTML kod prema dobivenim podacima te se oni šalju natrag korisniku. Ako se koristi pri-

7

ručna memorija ili nije potrebno dohvaćati podatke iz baze, neki od navedenih koraka moguse zaobići. U poglavlju 4 se detaljno, kroz praktične primjere, objašnjavaju ove funkcije ialati koje Django nudi.

3.5 Instalacija DjangaDjango je potpuno izgrađen u programskom jeziku Python. Iz tog razloga instalaciju i

konfiguriranje Django okruženja nužno prethodi instalacija Pythona. Moguće je preuzeti 32-bitnu ili 64-bitnu verziju Pythona sa Pythonove službene stranice (vidi [4]) te slijediti uputeza instalaciju. Nakon što je Python uspješno instaliran moguće je krenuti sa instalacijomDjanga.

U ovom radu koristi se Python 2.x, točnije Python 2.7.5. Verzija 3.x nije korištenazbog nekompatibilnosti sa svim Django bibliotekama, funkcijama i aplikacijama. KorištenaDjango verzija jest Django 1.5.4.

Za instalaciju Djanga, kao i za izradu aplikacije u njemu potrebno je poznavati osnovnerukovanja naredbenom linijom računala. Ovisno o operacijskom sustavu računala naredbenelinije su nešto drugačije, stoga je bitno naglasiti da se u ovom radu koristi računalo s opera-cijskim sustavom Windows, te pripadna naredbena linija (engl. cmd - Command Prompt).U naredbenoj liniji dobro je provjeriti je li Python uspješno instaliran. Ukucavanjem na-redbe python, trebao bi se otvoriti Pythonov interpreter kao što je prikazano na slici 3.3.

Slika 3.3:Windows naredbena linija nakon pokretanja naredbe python

Prije same instalacije Djanga vrlo je važno pravilno postaviti razvojno okruženje. Takvimpristupom postiže se stabilnost projekta, olakšana je razmjena podataka s drugim korisni-cima, postavljanje istog okruženja na drugom računalu te nadograđivanje na novije pakete(engl. package). Nadalje, to osigurava da su instalirani paketi usklađeni sa instaliranomverzijom Pythona.

U ovom radu korišten je Pip. Pip je korisniku pristupačan omotač (engl. wrapper) odSetuptools-a, Pythonova upravitelja paketa. Kako Pip ovisi o Setuptools-u potrebno je obojeinstalirati na računalo.Prvo je potrebno preuzeti datoteku Setuptools-a sa službene Pythonove stranice za dijeljenjepaketa (vidi [3]) u .tar.gz obliku. Putem naredbene linije pozivanjem naredbe:

8

cd setuptools-x.x.x

pristupa se datoteci setuptools-x.x.x, a nakon toga pozivanjem naredbe:

python ez_setup.py

pokreće se instalacija Setuptools-a na računalo. Ime datoteke setuptools-x.x.x ovisi o verzijipaketa preuzetoga sa službene stranice.

Nakon uspješne instalacije Setuptools-a potrebno je instalirati Pip. Instalacija Pip-apokreće se iz naredbene linije računala naredbom:

easy_install pip

Sada je sve spremno za instalaciju Djanga, koja se vrši pozivanjem naredbe:

pip install -U django==1.5.4

Upravitelj paketima, tj. Setuptools preuzima Django i instalira ga na računalo. Svi dodatnipaketi potrebni za razvoj željene aplikacije mogu se preuzeti na analogan način pozivanjemnaredbe:

pip install IMEA_PAKETA

U svrhu praktičnog primjera razvoja web aplikacije pomoći Djanga u poglavlju 5 se pozivajoš nekoliko paketa pomoću navedene naredbe.

9

4 STVARANJE PROJEKTA I WEB APLIKACIJEPOMOĆU DJANGA

4.1 Opis projektaPraktični dio ovoga rada temelji se na izradi web aplikacije. Uz opisivanje načina izrade

web aplikacije opisuju se i mogućnosti Django razvojnog okruženja te jedan od načina ruko-vanja istim.Web aplikacija, mathos_Instrukcije, čija se izrada u nastavku opisuje zamišljena je kao bazainstrukcija za studente Odjela za matematiku u Osijeku. Studenti koji žele pružati usluguinstrukcija moraju se registrirati, tako stvaraju svoj profil na kojem objavljuju predmete izkojih žele držati instrukcije. S druge strane, studenti koji samo žele pronaći instruktora nemoraju biti registrirani korisnici, oni mogu slobodno pretraživati bazu predmeta i vidjetipostoji li instruktor za željeni predmet.

4.2 Django projektU poglavlju 3.5 objašnjen je postupak instalacije razvojnog okruženja Django. Nakon us-

pješne instalacije sve je spremno za stvaranje Django projekta. Django projekt sadrži jednuili više Django aplikacija i skup postavki koje one koriste. Pri stvaranju Django projektadobra je praksa prethodno kreirati posebnu mapu na računalu, te u njoj razvijati Djangoprojekt. Navedeni način rada olakšava Pythonu pronalaženje i korištenje koda iz Djangoprojekta.U ovom radu za razvoj Django projekta stvorena je mapa Django_projekt u kojoj se tijekomizgradnje web aplikacije spremaju svi njezini dijelovi. Kreiranje projekta vrši se pozivanjemugrađene Django skripte i django-admin.py i naredbe startproject iz naredbene linijeračunala uz navođenje imena projekta (vidi slika 4.1).

Slika 4.1:Stvaranje Django projekta i prikaz njegovih datoteka

Skripta django-admin.py pokreće alat za administriranje koji omogućuje stvaranje no-voga projekta, održavanje projekta, stvaranje potrebnih relacija u bazi podataka, sinkroniza-ciju projekta s bazom podataka i pokretanje ugrađenog servera. Bitno je navedene naredbepokretati iz mape koja je prethodo kreirana za Django projekt, u ovom slučaju iz mapeDjango_projekt.Slika 4.1 prikazuje kreiranje projekta baza_mathos_instrukcija pozivom naredbe:

10

django-admin.py startproject baza_mathos_instrukcija.

Novonastali Django projekt sadrži istoimenu podmapu baza_mathos_instrukcija i Pythonskriptu manage.py, što se vidi na slici 4.1.Skripta manage.py kao i skripta django-admin.py služi za održavanje projekta u kojem jenastala, te za obavljanje upravljačkih zadataka. Ona može pokrenuti jednostavni ugrađeniweb server koji će pokretati pripadni projekt u svrhu testiranja, a poziva se naredbom:

python manage.py runserver

Podmapa baza_mathos_instrukcija sadrži četiri Python skripte: (vidi slika 4.2.)

• __init__.py

• settings.py

• urls.py

• wsgi.py

Slika 4.2:Građa podmape baza_mathos_instrukcija

Skripta __init__.py je prazna Python skripta, ona služi kako bi označila da je ta mapaPython paket. settings.py je konfiguracijska skripta sa postavkama stvorenoga Djangoprojekta, urls.py je skripta koja spaja URL-ove i pogleda u projektu, a wsgi.py skriptapomaže u pokretanju ugrađenog web servera i razvijanja projekta. U ovom stadiju razvojaprojekta, moguće je pozvati već spomenuti ugrađeni server iz naredbene linije računala na-redbom:

python manage.py runserver

Otvaranjem web preglednika i ukucavanjem URL-a: http://127.0.0.1:8000 dobije se pri-kaz kao na slici 4.3. Za zaustavljanje web servera koristi se naredba CTRL + c.

4.3 Django aplikacijeBitna razlika između Django projekta i Django aplikacije jest što je Django projekt skup

postavki i Django aplikacija koji zajedno tvore web aplikaciju ili stranicu. Razdvajanjaprojekta na više aplikacija dopušta korištenje jedne aplikacije u različitim projektima uz

11

Slika 4.3:Početna Django stranica nakon pokretanja ugrađenog servera prvi puta

minimalne preinake. Ovisno o potrebama korisnika i željama programera, projekt se možesastojati od više Django aplikacija kao što su aplikacija za registraciju, aplikacija za pretraži-vanje i slično. Takve aplikacije mogu se iskoristiti u tematski potpuno različitim projektima iuštedjeti programeru mnogo vremena. U skladu s tim, postoji baza koja trenutno broji 2476gotovih Django aplikacija koje se mogu slobodno preuzeti i koristiti u raznim projektima(vidi [7]).U ovom radu koristi se nekoliko gotovih Django aplikacija preuzetih sa službene DjangoPackages stranice:

• django-allauth - aplikacija za lokalnu autentikaciju

• Haystack - aplikacija za pretraživanje po zadanim modelima i cijeloj web aplikaciji

• django-secretballot - aplikacija koja dopušta tajno glasanje neregistriranim korisnicima

• django-likes - upotpunjuje poglede i predloške aplikacije django-secretballot

Sve navedene aplikacije instalirane su pomoću naredbe pip install, a opisane su u poglav-lju 5. Gotove aplikacije su uključene u projekt zbog unapređenja funkcionalnosti, te prikazamogućnosti Django razvojnog okruženja. Uz veliku bazu gotovih Django aplikacija mogućeje stvoriti jedinstvenu web aplikaciju uz samo par linija Python koda koje bi povezivale sveuvezene aplikacije. Kako je svrha ovoga rada prikazati način izrade web aplikacije, aplikacijakoja je okosnica ovog projekta samostalno je izrađena, dok su uvezene aplikacije prilagođenepotrebama samog projekta. Projekt se temelji na razvoju aplikacije mathos_instrukcije, au nastavku je prikazana njezina izrada.

Prvi korak pri stvaranju nove aplikacije u Django razvojnom okruženju obavlja se pozi-vanjem sljedeće narede unutar Django_projekt mape:

python manage.py startapp mathos_instrukcije

Naredba startapp stvara novu mapu po imenu mathos_instrukcije te u njoj još četiri novePython skripte:

• __init__.py

• models.py

• views.py

• tests.py

12

Skripta __init__.py jest prazna Python skripta i služi za prepoznavanje Python okruže-nja. models.py je Python skripta u koju se kreiraju objekti, njihov entitet i veze. U skriptuviews.py spremaju se funkcije zadužene za zaprimanje korisnikovih zahtijeva i vraćanje od-govora. Posljednja skripta tests.py služi za testiranje, tu se mogu spremati razne funkcijekojim se testira kod aplikacije. Najčešće korištene skripte su models.py i views.py, onese koriste u svakoj aplikaciji i okosnica su arhitekture Django okruženja koja je opisana upoglavlju 3.4.

Slika 4.4:Rječnik INSTALLED_APPS nakon što su dodane sve aplikacije koje projekt

baza_mathos_instrukcija koristi

Sljedeći korak u izradi aplikacije jest povezivanje aplikacije i projekta. Potrebno je u rječ-nik INSTALLED_APPS u skripti settings.py koja se nalazi u mapi baza_mathos_instrukcijadodati kreiranu aplikaciju.

Na slici 4.4 prikazan je rječnik INSTALLED_APPS projekta baza_mathos_instrukcija na-kon što su njega uvrštene sve aplikacije koje taj projekt sadrži, tako je projekt povezan sasvim aplikacijama i one međusobno.

4.4 Baza podatakaNakon stvaranja aplikacije u Djangu prvi sljedeći korak jest stvaranje modela. Umjesto

komuniciranja sa bazom podataka putem SQL-a Django obavlja sav posao putem ORMfunkcija (engl. object relational mapping) te stvara tablice u bazi podataka kroz jednostavnodefiniranje modela u skripti models.py. Skripta models.py je generirana posebno za svakuaplikaciju u projektu. Jedan model definira klasa, a unutar njega se definiraju varijable irelacije sa ostalim klasama. Stvorene klase odgovaraju tablicama u bazi podataka dok su va-rijable stupci u tablicama. Inicijalno su u skripti models.py uključeni modeli iz django.dbmodula, te ih je sve moguće koristiti za opis objekata korištenih u aplikaciji.

Prije stvaranja modela potrebno je postaviti bazu podataka u skripti settings.py jerje Django prilagođen različitim sustavima za upravljanje bazama podataka. U ovom radukoristi se jednostavan SQLite 3 sustav.

13

Web aplikacija mathos_Instrukcije je, kako je rečeno u poglavlju 4.1, zamišljena kaobaza instrukcija. Predmeti i instruktori su stoga osnovni objekti koje baza aplikacije mat-hos_instrukcije mora sadržavati.

Slika 4.5:Relacijski dijagram modela za aplikaciju mathos_instrukcije

Na slici 4.5 je prikazan relacijski dijagram za aplikaciju mathos_instrukcije. Osnovnimodeli su Predmet, Instruktor i User (korisnik).

Model User je preuzet iz ugrađenog django.contrib.auth modula te je osnova ugra-đenog Django autentikacijskog sustava. User predstavlja svakog korisnika koji interaktivnokoristi aplikaciju, taj model nije potrebno implementirati te on dolazi u paketu sa pet pri-marnih varijabli, tj. atributa:

• korisničko ime za korisnički računa (engl. username)

• lozinka za korisnički račun (engl. password)

• email adresa korisnika (engl. email)

• ime korisnika (engl. first_name)

• prezime korisnika (engl. last_name)

Ako postoji potreba za dodatnim atributima osim navedenih ugrađenih atributa, po-trebno je stvoriti dodatni model UserProfile u kojem će se oni nalaziti. Atributi iz modelaUserProfile su zapravo atributi dodjeljeni modelu User putem jedan naprama jedan (engl.OneToOne) veze između modela UserProfile i User.

Na slici 4.6 prikazana je klasa koja tvori model UserProfile sa pripadnim varijablama,tj. atributima i funkcijama. Varijabla user jest strani ključ iz modela User, što je naznačenoimenovanjem polja kao OneToOneFiled, te prosljeđivanjem modela User. Dodana su dvaatributa:

• godina_studija je znakovnog tipa, tj. CharField te je dopušten izbor godina samoiz rječnika pod nazivom GODINA_STUDIJA_CHOICES koji je prethodno definiran

• picture je slikovnog tipa, tj ImageField, naredbom blank=True dopušteno je da koris-nik sam odluči želi li priložiti svoju sliku ili ne. Učitane slike spremati će se u mapu pro-file_images koja se nalazi u mapimedia unutar projektne mape baza_mathos_instrukcija.

14

Slika 4.6:Klasa za model UserProfile

Mapu media potrebno je prethodno kreirati i obavijestiti sam projekt i aplikaciju o nje-zinom postojanju u skripti settings.py

Preostalo je još objasniti tri funkcije koje su stvorene unutar klase UserProfile:

• encode_url() je funkcija koja pomaže u konfiguriranju URL-a za korisnički profil,dohvaća korisničko ime i zamjenjuje svaki razmak sa donjom crticom.

• Funkcija __unicode__() je zadužena za vraćanje jedinstvene vrijednosti nakon pozi-vanja instance modela UserProfile

• account_verified() je funkcija koja brine ima li trenutno prijavljeni korisnik potvr-đenu email adresu. Ona povezuje korisnički profil sa uvezenom aplikacijom za regis-traciju i sigurnost, django-allauth, koristeći model EmailAddress iz aplikacije django-allauth

Meta klasa definirana unutar klase UserProfile daje upute Djangu kojoj tablici u bazi trebapridružiti definirani model. Na sličan način kako je opisan model UserProfile kreirani su iostali modeli u aplikaciji.

Model Instruktor iz relacijskog dijagrama možemo se sada u potpunosti zamijenitis uvedenim modelom UserProfile. Potrebno je još poraditi na relaciji između modelaUserProfile i modela Predmet zbog veze više naprama više (engl. Many To Many) međunjima. Problem je riješen uvođenjem novog modela Instrukcije koji sadrži dva stranaključa, po jedan od svakog roditeljskog modela, te sve atribute koji su bitni za vezu održavanjeinstrukcija.

Na slici 4.7. pokazano je kako se u modelu Predmet naglašava da je u vezi više napramaviše sa modelom UserProfile, te da je poveznica model Instrukcije. Nakon kreiranjamodela, potrebno je sinkronizirati bazu podataka koristeću skriptu manage.py pozivanjemnaredbe python manage.py syncdb. Za izlistavanje svih modela aplikacije poziva se na-redba python manage.py sql mathos_instrukcije.

15

Slika 4.7:Model Predmet, prikaz veze više naprama više

4.5 Administratorska stranicaJedna od istaknutih značajki Django razvojnog okruženja jest ugrađeno administratorsko

sučelje koje omogućuje administratoru aplikacije jednostavno pregledavanje i uređivanje po-dataka unesenih u bazu. Administratorsku stranicu potrebno je, kao i sve ostalo u Djangu,aktivirati unutar settings.py skripte.

Prvi korak aktivacije je dodavanje django.contrib.admin u INSTALLED_APPS struk-turu, te sinkronizacija s bazom podataka radi stvaranja potrebnih tablica. Drugi korakje uređivanje skripte urls.py, koja će biti objašnjena u poglavlja 4.7.2, dodavanjem linije(r’\^admin/’, include(’django.contrib.admin.urls’)). Navedena linija omogućavada se administratorska stranica nalazi na adresi 127.0.0.1:8000/admin/. Posljednji korakje stvaranje Python skripte admin.py unutar aplikacije mathos_instrukcije u kojoj se navodemodeli koji će biti prikazani na administratorskoj stranici.

Slika 4.8:Dio administratorske stranica web aplikacije mathos_Instrukcije

Slika 4.8 prikazuje administratorsku stranicu web aplikacije mathos_Instrukcije. Unoše-nje novih podataka u bazu vrši se odabirom opcije Novi_unos, nakon toga se otvara forma

16

za unos podataka, dok se odabirom opcije Promijeni otvara forma za uređivanje već posto-jećih podataka. Administrator web aplikacije koristeći administratorsku stranicu može, najednostavan način, dodavati i brisati korisnike kao i sve ostale podatke. Korištenje adminis-tratorske stranice uvelike olakšava upravljanje bazom podataka same web aplikacije.

4.6 FormeSvaka interaktivna web aplikacija posjeduje forme u koje korisnik unosi tražene podatke

i oni se spremaju u bazu podataka. U ovom poglavlju opisan je način stvaranja formi uDjango razvojnom okruženju. Django pruža vrlo elegantan način rada s formama, odnosnoprikupljanja podataka od korisnika i slanja aplikaciji koristeći ugrađeni Django modul kojibrine o formama, django.forms (engl. form handling library). Prema Django dokumentaciji(vidi [8]) taj modul omogućuje olakšano upravljanje mnogim zadatcima vezanim uz forme,moguće je:

• automatsko generiranje kućica za forme pomoću HTML-a,

• provjera točnosti unsenih podataka,

• ponovno prikazivanje forme u slučaju pogrešaka pri unosu i

• pretvaranje unesenih podataka u Pythonu prepoznatljive tipove podataka.

Najveća prednosti korištenja Django formi jest ušteda vremena od pisanju dugog HTMLkoda.

Prije same izrade formi potrebno je stvoriti novu Python skriptu forms.py unutar aplika-cije mathos_instrukcije, u njoj će biti smještene forme za one objekte čije tablice u bazi trebapopunjavati korisnik. U skriptu forms.py najprije treba uključiti django.forms i modele zakoje želimo stvoriti forme. U slučaju aplikacije mathos_instrukcije nužne su dvije osnovneforme, forma za registraciju korisnika - SignupForm i forma za unos instrukcija iz pojedinogpredmeta - InstrukcijeForm. Kako je u poglavlju 4.3 opisan UserProfile model, u ovompoglavlju će biti opisana SignupForm kao forma za registraciju korisnika.

Stvaranjem forme, zapravo kreiramo jednu ModelForm ili Form klasu, odnosno pomoćnuklasu koja dopušta stvaranje Django forme za već postojeći model. U SignupForm formimoraju biti sva polja za podatke koje želimo da korisnik unese u bazu pri registraciji, to suzapravo atributi modela UserProfile i modela User. Model UserProfile stvoren je kaodopuna modelu User, koji Django generira iz django.contrib.auth paketa, te radi u sin-kronizaciji sa uvezenom django-allauth aplikacijom. Zbog tih svojstava modela UserProfilenije potrebno kreirati formu za unos korisničkog imena i lozinke, taj posao odraditi će apli-kacija django-allauth (vidi poglavlje 5) pa je preostalo kreirati samo forme za unos imena,prezimena, email adrese, godine studija i slike profila.

Na slici 4.9 prikazan je cijeli kod stvaranja forme za registraciju korisnika. Iako Djangoodrađuje veliki dio posla pri kreiranju formi, dopušta preoblikovanje formi na različite na-čine. Bitno je da se naziv (npr. godina_studija), tip podatka (npr. CharField) i maksi-malna veličina unosa (npr. max_length=50) podudaraju sa onima podatcima iz modela. Pri

17

Slika 4.9:Kod za stvaranje SignupForm forme za registraciju korisnika

stvaranju polja za unos godine studija, koristi se dodatak (engl. widget) u kojem je nave-deno da će se taj unos birati, npr. pomoću padajućeg izbornika, iz već definiranog rječnikaGODINA_STUDIJA_CHOICES. Nije nužno kreirati polja za sve atribute modela, moguće je pos-taviti konstantne vrijednosti za željene atribute ili sakriti unos za pojedini atribut. (vidi [9] )

Implementirana funkcija signup() unutar forme SignupForm povezuje i sinkroniziratu formu sa formama i modelima iz aplikacije django-allauth. Također, unutar funkcijesignup() vrši se provjera unesene email adrese. Zahtjeva se da je domena unesene emailadrese mathos, a ako nije tako podiže se pogreška potvrde (engl. validation error). Djangoopćenito sam provjerava podudaraju li se uneseni podatci sa tipom polja koji se navodi udefiniranju atributa pozivima funkcije cleaned_data. Ako su svi uneseni podatci valjani,spremaju se u varijable odgovarajućih modela u bazi podataka. Tako recimo, pri unosuemail adrese Django provjerava je li uneseni tekst oblika: adresa@example.com te ako nijetako Django javlja pogrešku unosa. Definirana Meta klasa povezuje formu sa modelom kojita forma koristi.

4.7 Pogledi i URL-oviSvaka web aplikacija trebala bi biti jednostavna za rukovanje i dobro organizirana. Kako

bi se ostvarila te dvije, korisniku vrlo bitne, stavke u Django aplikaciji definiraju se poglede,URL-ovi i predlošci.

4.7.1 Stvaranje pogledi (engl. views)

U Django razvojnom okruženju pogledi su zaduženi za funkcionalnost web aplikacije.Pogledi se stvaraju kao funkcije unutar aplikacije u Python skripti views.py. Za svaki defi-nirani pogled definira se URL (engl. Uniform Resources Locator) te u suradnji sa predloškomoni omogućuju korisniku pogled na jednu stranicu web aplikacije.

Prvi korak u dohvaćanju podataka iz baze i prikazivanju istih korisniku jest stvaranju

18

pogleda. Potrebno je najprije navesti u skripti views.py koji modeli se žele koristiti, jerpogledi zapravo rukuju sa podacima iz baze i prikazuju ih korisniku putem predložaka. Po-gledi se stvaraju ovisno o tome koji model se koristiti i u koju svrhu na nekoj od stranicaweb aplikacije. U daljnjem tekstu ovog podpoglavlja biti će objašnjen pogled za naslovnustranicu aplikacije mathos_Instrukcije te mapiranje URL-a za tu stranicu.

Naslovnu stranicu trebala bi biti pregledna i čista, no svakako mora sadržavati neke po-datke o osnovnim modelima. Kako svaki korisnik treba lako i brzo pronaći željene podatkena naslovnoj stranici će se nalaziti popis svih predmeta koji su spremljeni u bazu te popiszadnjih 5 registriranih instruktora.

Slika 4.10:Pogled za početnu stranicu web aplikacije

Slika 4.10 prikazuje pogled za početnu stranicu web aplikacije. Pogled je funkcija, kakoje prethodno već spomenuto, koja prima zahtjev korisnika, obrađuje ga i vraća HTTP odgo-vor. Priložena funkcija home() prima zahtjev korisnika, zatim koristi klasu RequestContextkako bi pristupila svim podacima korisnikova zahtjeva i sprema ih u varijablu context. Usljedećem koraku radi se upit u bazu te se u rječnik user_list upisuje posljednjih pet re-gistriranih korisnika. Slično se u rječnik pr_list sprema popis svih predmeta, no to se činipozivanjem funkcije get_predmet_list() koja je prethodno implementirana. Svi podatcikoji se žele proslijediti kroz predložak spremaju se u rječnik context_dict. Na kraju se po-ziva pomoćna funkcija render_to response() kojoj se kao parametri prosljeđuje predložakkoji se želi koristiti, rječnik context_dict sa varijablama za predložak i varijabla contextu koju je pohranjen korisnikov zahtjev. Funkcija render_to_response() će prosljeđene po-datke zajedno sa predloškom iskoristit kako bi se generirala potpuna HTML stranica kojaće biti prikazana u korisnikovu pregledniku.

Dakako postoji i jednostavniji način stvaranja pogleda u kojem Django odrađuje sav po-sao, to su takozvani generički i pogledi temeljeni na klasama, tj. CBVs (engl. Class BasedViews). CBVs su se prvi puta pojavili u Django 1.3 verziji, a tek sa Django 1.5 su pokrivenidobrom i jasnom dokumentacijom. Takav način stvaranja pogleda posebno je pogodan zapoglede uređivanja ili brisanja jer nude visoki nivo apstrakcije i skrivaju mnogo kompleksnihoperacija.

Slika 4.11 prikazuje kreiranje pogleda temeljenog na klasama koji se koristi za stvara-nje novih instrukcija. Prikazani pogled CreateInstrukcijeView koristi Djangov generičkiugrađeni pogled CreateView. Prvo je potrebno u naglasiti s kojim modelom taj pogled radi,a zatim ime predloška koji ga koristi. Naredbom form_class=forms.InstrukcijeFormnaglašeno je koju formu ovaj pogled treba koristit. Ako nije naglašena forma koju CBVtreba koristiti Django koristi generički stvorenu formu prikladnu tom modelu i pogledu.Funkcija get_success_url() dodana je kako bi preusmjerila korisnika na početnu stra-

19

Slika 4.11:CBV za prijavu novih instrukcija

nicu nakon uspješnog popunjavanja forme za dodavanje novih instrukcija, dok funkcijaget_context_data() prosljeđuje dodatne podatke predlošku.

4.7.2 Mapiranje URL-a

Već je prethodno spomenuto da se za svaki pogled definira URL i oni zajedno sa pred-loškom omogućuju korisniku pogled na jednu stranicu web aplikacije. U aplikaciji mat-hos_instrukcije potrebno je stvoriti novu Python skriptu urls.py unutar koje će se definiratisvi URL-ovi aplikacije mathos_instrukcije. U projektnoj mapi, u skripti urls.py potrebnoje uključiti URL-ove svih aplikacija koje se koriste u projektu.

Slika 4.12:Krajnji izgled projektne skripte urls.py

Slika 4.12 prikazuje kako na kraju ta skripta treba izgledati. Uokvireni dio koda na sliciprikazuje kako uključiti URL-ove aplikacije mathos_instrukcije.

Za mapiranje URL-a koristi se rječnik (engl. tuple), a da bi Django znao prepoznati da jeto baš rječnik za mapiranje URL-a, on mora biti nazvan urlpatterns. urlpatterns rječniksadrži cijelu seriju poziva prema django.conf.urls.url() funkciji koja svakim pozivomstvara jedinstveno mapiranje url-a.U primjerima na slikama 4.12 i 4.13 samo jednom se koristi url() poziv, stoga se obavljasamo jedno mapiranje. Prvi parametar koji se prosljeđuje funkciji django.conf.urls.url()je regularni izraz (engl. regular expression), zatim se Djangu daje uputa uz koji pogled da

20

Slika 4.13:Skripta urls.py aplikacije mathos_instrukcije

mapira taj URL i zadnje se definira ime URL-a kao opcionalni parametar. Sa ovako def-niranim URL-ovima korisnik će moći lako pristupati svim stranicama web aplikacije. Zapristupanje početnoj stranici aplikacije pomoću ugrađenog Django web servera potrebno jeu web preglednik upisati: http://127.0.0.1:8000/mathos_instrukcije.

Slika 4.14:Ilustracija URL-a, prikazuje kako različite urls.py skripte utječu na kreirenje URL-a

Na slici 4.14 prikazano je kako pojedini dijelovi u konfiguraciji URL-a utječu na stvaranjeURL adrese.

4.8 Predlošci i dizajnPristupanje pojedinim stranicama web aplikacije nije moguće bez zadnjeg koraka, stva-

ranje predložaka.

Prvo je potrebno kreirati novu mapu u projektnoj mapi po imenu templates. U tojmapi se stvaraju posebne mape za svaku aplikaciju, u kojima se čuvaju HTML kodovi teaplikacije. U skripti settings.py projektne mape potrebno je navesti put do nove mapetemplates. Postoje dva načina kako to napraviti, ovisno o tome hoće li se aplikaciju dijeliti sdrugim programerima i koristiti za druge projekte ili je stvorena izričito za projekt u kojemse trenutno nalazi (vidi [10]). Nakon što je put do mape templates odgovarajuće postavljen,sve je spremno za kreiranje predložaka.

Svaka stranica web aplikacije ima svoj predložak, stoga će u mapi mathos_instrukcijebiti onoliko predložaka koliko web aplikacija mathos_Instrukcije ima stranica. Za cjelokupnivizualni dojam web aplikacije poželjno je da sve stranice imaju isti bazni dizajn te se u tusvrhu stvara posebni predložak base.html. Predložak base.html uvelike olakšava generira-nje HTML koda za sve ostale predloške, te smanjuje količinu koda na svakom od predložaka.

21

Zapravo, svaki predložak koji je zadužen za neku od stranica web aplikacije na jedinstvennačin iznova će biti smješten unutar base.html-a.

4.8.1 Dizajn

Za uređivanje dizajna web aplikacije u ovom radu koriste se:

• HTML (engl. HyperText Markup Language) - prezentacijski jezik za izradu web stra-nica,

• CSS (engl. Cascading Style Sheets) - jezik za oblikovanje stila koji određuje izgledHTML dokumenta i

• Bootstrap 3.2.0 - front-end framework za izradu web stranica i web aplikacija.

Prvo je potrebno u projekt uključiti mapu static, u njoj će biti pohranjene sve statičke medij-ske datoteke. Da bi to funkcioniralo neophodno je u Python skripti settings.py obavijestitiprojekt o postojanju mape static (vidi [11]). Nakon toga potrebno je preuzeti Bootstrap 3.2.0sa službene stranice (vidi [12]) i smjestiti preuzete mape: fonts, js i css u mapu static. Po-tom je potrebno preuzeti JQuery 2.2 sa službene stranice i preuzetu mapu js smjestiti u jspodmapu mape static.

Kao bazni dizajn ovoj aplikaciji poslužiti će Bootstrapov Narrow jumbotron stil koji ćebiti podosta izmijenjen. U podmapu css sprema se CSS skripta style.css u kojoj je po-hranjen kod baznog dizajna, odnosno izmijenjeni kod Narrow jumbotron stila. Sada je svespremno za uključivanje CSS-a i JQuery-ja u base.html predložak u kojem će do kraja bitidefiniran dizajn cijele web aplikacije.

Slika 4.15:Zaglavlje base.html predloška

U mapi templates\mathos_instrukcije stvara se već navedeni base.html predložak.To je HTML dokument u kojem će se generirati kod za dizajn svih stranica web aplikacije.U zaglavlju (engl. head) base.html predloška nužno je uključiti CSS i JQuery kako bi sve

22

pravilno funkcioniralo. Svaka stranica web aplikacije trebala bi imati u zaglavlju ime webaplikacije i navigacijski izbornik te u podnožju (engl. footer) ime i godinu nastanka te webaplikacije. Tijelo svake stranice trebalo bi biti prilagođeno ovisno o njenom sadržaju i na-mjeni, te smješteno unutar blokova base.html-a što je prikazano na slici 4.15.

Slika 4.16:Tijelo base.html predloška i okosnica dizajna aplikacije

4.8.2 Stvaranje predložaka i krajnji izgled aplikacije

U poglavlju 4.7.1 opisan je pogled za početnu stranicu web aplikacije, pa se sukladnotome u ovom poglavlju opisuje stvaranje predloška za naslovnu stranicu, tj. home.htmlpredloška. U prethodnom podpoglavlju 4.8.1 opisan je način izrade base.html predloška, teje izradom takvog standardiziranog predloška uvelike olakšana izrada svih ostalih predložaka.

Slika 4.17:Blok body-block u home.html predlošku

Slika 4.17 prikazuje popunu body_block-a bloka, a slika 4.18 popunu content bloka.

23

U body-block bloku na naslovnoj stranici aplikacije ispisuje se naslov i pozdravna porukakorisniku. Pozdravna poruka je drugačija ovisno o tome je li korisnik prijavljen ili anonimnikorisnik što se postiže upitom: {% if user.is_authenticated %}. Sintaksne strukturepredloška su: blok tagovi, varijable i HTML tagovi. Blok tagovi se označavaju sa {% i %},oni u predlošku obavljaju neku funkciju, kao što je npr. definiranje kontrole toka sa if i for.Varijable suže za ipis vrijednosti u predlošku koje su prosljeđene iz pogleda, oznaka je {{ i }}.

Slika 4.18:Blok content u home.html predlošku

Na slici 4.18 prikazuje se kako se u prvom div bloku content bloka ispisuju svi predmetikoji se nalaze u bazi, a u drugom div bloku ispisuje se popis pet posljednje prijavljenihinstruktora.

Slika 4.19:Početna stranica web aplikacije mathos_instrukcije

Slika 4.19. prikazuje interakciju base.html i home.html predloška te krajnji izgled nas-

24

lovne stranice nakon pokretanja web aplikacije pomoću ugrađenog Django servera.

4.9 Sigurnost Django razvojnog okruženjaU ovo podpoglavlju opisuju se sigurnosne značajke frameworka Django. Nabrojane su

neki od mogućih sigurnosnih problema, ukratko su opisani i dani su prijedlozi rješavanjaistih. (vidi [13])

1. XSS zaštita (engl. Cross-site scripting protection): XSS je vrsta napada na web aplika-ciju koja prisiljava web aplikaciju da proslijedi napadački izvršni kod korisniku, koji sezatim učitava u korisnikovu web pregledniku i izvršava. Najčešće se takav napad postižespremanjem zlonamjernih skripti u bazu podataka web aplikacije odakle će biti proslje-đene korisnicima web aplikacije. Korištenje Django predložaka na pravilan način stvarazaštitu od većine XSS napada. Bitno je u predlošku izbjegavati direktno prikazivanjesadržaja koji su unjeli korisnici. Izbjegavanje takvoga sadržaja moguće je unošenjemnaredbe escape unutar varijable koja se prosljeđuje (npr. {{first_name|escape}}).escape filter onemogućuje unošenje programskog koda u predložak i na taj način one-mogućuje XSS napad.

2. CSRF zaštita (engl.Cross site request forgery protection): CSRF napadi je napadačkatehnika kojom zlonamjerni korisnik prevari autenticiranog korisnika učitavajući URLstranice na koju se taj korisnik unaprijed autenticirao i tako koristi pogodnosti korisni-kova autentifikacijskog statusa. Django ima ugrađeni sustav zaštite od takvih napadakoji se nalazi u biblioteci django.contrib u paketu .csrf, taj sustav je korišten i uovom projektu.

3. Zaštita od SQL ubacivanja (engl. SQL injection protection): SQL ubacivanje je napa-dačka tehnika kojom se pokušava ugroziti sigurnost web aplikacije koja sastavlja SQLizjave iz korisničkih unesenih podataka. Takvi napadi najčešće uzrokuju curenje po-dataka i brisanje podataka iz baze. Korištenjem pravilnih django upita i izbjegavanjeunošenja koda u SQL upite Django osigurava web aplikaciju od navedenih napada.

Osim prethodno navedenih, Django pokriva još neke tipove zaštita kao što su Clickjackingprotection i SSl/HTTPS. (vidi [13])

25

5 DJANGO PACKAGES I UVEZENE DJANGO APLI-KACIJE

U poglavlju 4.3 spomenuta je baza gotovih Django aplikacija koje se mogu slobodnopreuzeti, nadopunjavati i koristiti u različitim projektima. Django Packages (vidi [7]) jeslužbena stranica te baze sa koje je moguće pristupiti svim slobodnim Django projektima,aplikacijama i alatima. Instalacija i integracija svakog dostupnog paketa jednostavna je iobjašnjena za svaki paket posebno.

U izradi ovoga projekta korištene su četiri gotove Django aplikacije. Sve korištene apli-kacije imaju BSD licencu (engl.Berkeley Software Distribution license) kao i sam Django, anjihovom upotrebom funkcionalnost web aplikacije podignuta je na višu razinu. Sve uve-zene aplikacije su instalirane pomoću naredbe pip install ime_paketa te su prilagođenepotrebama web aplikacije mathos_Instrukcije.

5.1 django-allauthdjango-allauth je skup Django aplikacija za autentikaciju, registraciju, uređivanje računa

i komuniciranje sa računima društvenih mreža (vidi [14]).U ovom projektu django-allauth integriran je zbog svoje mogućnosti verificiranja email adresenovog registriranog korisnika pomoću slanja email potvrde na korisnikovu adresu. Korište-njem ove alikacije znatno je smanjena količina koda i vremena utrošenoga za izradu aplika-cije, a performanse aplikacije su poboljšane. Mogućnost sinkronizacije korisničkog računa saračunom na društvenim mrežama nije iskorištena u ovom projektu, no moguće je naknadnododati tu funkciju. Rezultat sinkronizacije ove aplikacije sa pogledima, modelima i predloš-cima aplikacije mathos_instrukcije prikazan je na slici 5.1.

Slika 5.1:Forma za registraciju korisnika na mathos_Instrukcije

26

5.2 HaystackSvakako je dobro da web aplikacija posjeduje svoj interni pretraživač u svrhu bržeg i jed-

nostavnijeg pronalaženja određenih sadržaja na njoj. Upravo tome služi aplikacija Haystackkoja je uključena u ovaj projekt. Haystack omogućuje jednostavno pretraživanje željenihmodela iz baze pomoću indeksiranja. Dovoljno je jednom kreirati kod i odabrati neki odkompatibilnih pretraživača (Solar, Elasticsearch, Whoosh ili Xapian) pomoću kojega će sepretraživat indeksirani modeli. U ovom radu korišten je Whoosh pretraživač, te su iskori-štene samo neke mogućnosti pretraživanja sa Haystackom. Bitno svojstvo Haystacka je dase u svakom trenutku mogu indeksirati novi modeli i pretraživati po njima.

Slika 5.2:Pretraga po predmetima

Slika 5.2 prikazuje pretraživanje po predmetima u aplikaciji mathos_Instrukcije. Nakonukucavanja pojma "teorija" u formu, pretraživač ispisuje sve predmete koji u svom imenusadrže riječ teorija.

5.3 django-secretballot i django-likesAplikacija django-secretballot (vidi [16]) omogućuje neregistriranim i registriranim ko-

risnicima tajno glasanje. Kombinacija aplikacija django-secretballot i django-likes(vidi [17])dopušta svakom korisniku web aplikacije mathos_Instrukcije da označi one instrukcije kojesu mu se svidjele ili pomogle u svladavanju gradiva iz tog predmeta.

27

6 ZAKLJUČAKGlavni cilj ovoga rada jest objasniti Django razvojno okruženje i ukratko demonstrirati

izradu web aplikacije u istome. Izrada web aplikacije u razvojnom okuženju Django uvelikeje sigurniji, jednostavniji i brži način izrade od samostalnog pisanja cijelog koda što je du-gotrajan postupak podložan čestim pogreškama.Django je u potpunosti pisan u programskom jeziku Python što dozvoljava korištenje gotovihPython modula u izradi i razvoju funkcionalnosti web aplikacije. Django kod je slobodan idostupan svima pa ga je moguće mijenjati i razvijati za osobne ali i za jave potrebe. MCV,odnosno MTV arhitektura svakako pridonosi sigurnosti aplikacije zbog odvajanja modelaod logičkih struktura i dizajna. Django dolazi sa jednostavnim ugrađenim serverom kojiomogućuje testiranje aplikacije u svakom koraku razvoja, a administratorska stranica dajepotpuni osjećaj kontrole nad podatcima. Ugrađeni sigurnosni mehanizmi, kao što je CSRFpotiču stvaranje sigurnih i zaštićenih web aplikacija, a najveća prednost svakako je postoja-nje razvijene Django zajednice i velike baze gotovih aplikacija.Uz sve navedene prednosti čini se kao da Django razvojno okruženje nema mana, no oneipak postoje. Najveća zamjerka jest svakako nekompatibilnost svih Django verzija i alatasa Python 3.x verzijom. Django se, kao i Python, još uvijek razvija te postoje pogreškekoje ponekada otežavaju izgradnju samih web aplikacija, no sve veća zajednica Python iDjango korisnika uspijeva nadvladati te probleme. Može se zamjeriti i potreba za učenjemprogramskog jezika Python prije samog rada sa Djangom, ali Python je vrlo jednostavanjezik čistoga koda koji može savladati svatko.Na kraju bi se moglo reći da prednosti razvoja web aplikacije u Django razvojnom okruže-nju pobijaju svaku njegovu manu, te ga to čini odličnim alatom za početnike ali i iskusneprogramere.

28

7 LITERATURA

Literatura[1] James Bennet, Practical Django Projects, Second Edition, Apress, New York, 2009.

[2] M.Essert, Python, Digitalni udžbenik, Odjel za matematiku, Sveučilište J.J. Stros-smayera, Osijek, 2007.

[3] PyPI, setuptools 1.1.6, https://pypi.python.org/pypi/setuptools/1.1.6 , 15.09.2014.

[4] Python, Download Python, https://www.python.org/download , 15.09.2014.

[5] django, https://www.djangoproject.com/ , 14.09.2014.

[6] Django documentation, https://docs.djangoproject.com/en/1.5/ , 14.09.2014.

[7] Django Packages, https://www.djangopackages.com/ , 14.09.2014.

[8] Django documentation, Working with forms, ht-tps://docs.djangoproject.com/en/1.5/topics/forms/ , 16.09.2014.

[9] Django documentation, Form fields, https://docs.djangoproject.com/en/1.5/ref/forms/fields/, 16.09.2014.

[10] Django documentation, Advanced tutorial: How to write reusable apps,https://docs.djangoproject.com/en/1.5/intro/reusable-apps/ , 16.09.2014.

[11] Django documentation, Managing static files (CSS, images),https://docs.djangoproject.com/en/1.5/howto/static-files/ , 16.09.2014.

[12] Bootstrap, http://getbootstrap.com/ , 16.09.2014.

[13] Django documentation, Security in Django, ht-tps://docs.djangoproject.com/en/1.5/topics/security/ , 17.09.2014.

[14] Django Packages, django-allauth, https://www.djangopackages.com/packages/p/django-allauth/ , 17.09.2014.

[15] Django Packages, Haystack, https://www.djangopackages.com/packages/p/django-haystack/ , 17.09.2014.

[16] Django Packages, django-secretballot, https://www.djangopackages.com/packages/p/django-secretballot/ , 17.09.2014.

[17] Django Packages, django-likes, https://www.djangopackages.com/packages/p/django-likes/ , 17.09.2014.

29