E
LEKTROTEHNIČKI FAKULTET
U
NIVERZITETA U
B
EOGRADU
V
V
E
E
B
B
P
P
O
O
S
S
L
L
A
A
S
S
T
T
I
I
Č
Č
A
A
R
R
N
N
I
I
C
C
A
A
–Diplomski rad–
Kandidat:
Mentor:
Borivoje Pavlović 2011/230
doc. dr Zoran Čiča
Beograd, Avgust 2016.
4
2
2
.
.
O
O
S
S
N
N
O
O
V
V
N
N
I
I
A
A
L
L
A
A
T
T
I
I
I
I
J
J
E
E
Z
Z
I
I
C
C
I
I
Za potrebe kreiranja veb sajta korišćeni su jezici HTML, CSS, PHP, MySQL, JavaScript,
jQuery i AJAX dok je od alata korišćen Notepad++.
2.1.
HTML
HTML (HyperText Markup Language) predstavlja programski jezik koji služi za
obeležavanje teksta koji se prikazuje korisniku i programiranje jednostavnih objekata na Internetu.
Ujedno je i standard za Internet dokumente.
To je relativno jednostavan jezik za opis dokumenata i njihovih međusobnih veza a koji se
prikazuju u brauzerima. HTML nije zaista programski jezik u onom smislu u kom su to C++ ili
Visual Basic, on je više sintaksni jezik za formatiranje dokumenata. Nastao je od SGML-a
(Standard Generalized Markup Language), koji je daleko kompleksniji „meta jezik” i služi za
specifiranje elemenata koji se koriste u dokumentima i značenje tih elemenata.
Osnovu HTML predstavljaju atributi i tagovi. Tagovima se određeni deo dokumenta odvaja
od ostatka i na njega se primenjuju pravila definisanja samim tagom. Atributi se nalaze unutar
tagova i omogućavaju da se pored samog imena taga i unapred definisanog ponašanja još bliže
odredi način prikaza i ponašanja označenog dela dokumenta.
2.2.
CSS
CSS (Cascading Style Sheets) je jezik koji služi za definisanje stilova koji određuju izgled
HTML elemenata (font, boje, pozadine, razmake...).
Ti stilovi se nadovezuju u „Style Sheets”, ekstarne fajlove sa .css ekstenzijom, ili se
jednostavno pišu u zaglavlju HTML dokumenta ili čak inline, tj. u samim elementima.
CSS je izmislio i specifirao W3C, a pojavili su se sa HTML-om 4.0 kao rešenje koje je
proizašlo iz sve veće potrebe za odvajanjem sadržaja stranice od dizajna.
Dolazak CSS-a mnogi smatraju prekretnicom u veb dizajnu jer je omogućio programerima
da kontrolišu stilove i izgled više HTML stranica odjednom. Tako da danas programer može
definisati jedan stil za neki element i iskoristiti ga na onoliko stranica koliko želi.
2.3.
PHP
PHP (Hypertext Preprocessor) je specijalizovan skriptni jezik prvenstveno namenjen za
izradu dinamičkog veb sadržaja i izvodi se na strani servera.
Omogućava dinamički veb sadržaj, vrši obrade na serveru, npr. prikuplja statistike o
posećenosti, obrađuje podatke iz formulara, povezuje korisnike sa bazama podataka na serveru,
implementira autentifikaciju i zaštitu komunikacije.
5
2.4.
JavaScript
JavaScript je skriptni jezik koji pomaže klijentima u interakciji sa veb stranicama čije su
funkcionalnosti prethodno definisane u Javascript jeziku. Dakle, izvršava se na korisničkoj strani.
JavaScript može menjati sadržaj prikazane veb stranice i kontrolisati brauzer. Omogućava
dinamički HTML sadržaj, može da menja vrednosti HTML elemenata i atributa. Koristi se za
proveru ispravnosti popunjenih formulara i ostvaruje razne vremenske funkcije.
2.4.1.
jQUERY
jQuery je JavaSript biblioteka koja pojednostavljuje korišćenje JavaSripta kod
komplikovanih stvari kao što su AJAX pozivi (Asynchronous JavaSript and XML) ili manupulacija
DOM-om (Document Object Model).
2.5.
MySQL
MySQL je najpopularniji sistem otvorenog koda (Open Source) za upravljanje bazama
podataka. Baza podataka je struktuirana kolekcija podataka. Može biti sve od najjednostavnije liste
za kupovinu do kolekcije ogromne količine podataka neke korporacije. Za dodavanje, pristup i
obradu podataka koji su smešteni u bazi podataka, potreban je sistem za upravljanje bazama
podataka kao što je MySQL server.
U relacionoj bazi podataka podaci se smeštaju u više međusobno povezanih tabela. Ovim se
dobija na brzini i fleksibilnosti. SQL deo naziva „MySQL” potiče od „Structured Query Language”
(strukturirani jezik za upite).
2.6.
AJAX
Ajax je grupa međusobno povezanih tehnika za razvoj veba korišćenih na klijentskoj strani
za pravljenje sinhronih i asinhronih veb aplikacija. Korišćenjem Ajax-a, veb aplikacije mogu da
šalju i primaju podatke sa servera asinhrono bez menjanja trenutnog prikaza i ponašanja stranice.
Ajax nije jedna, već grupa tehnologija. HTML i CSS se mogu koristiti za obeležavanje i
stilizovanje informacija. DOM-u se pristupa preko JavaScripta za dinamički prikaz i omogućavanje
interakcije korisnika sa informacijom. JavaScript i XMLHttpRequest objekat omogućuju metod za
asinhronu razmenu podataka između pregledača i servera da bi se izbeglo ponovno učitavanje cele
stranice.
2.7.
Notepad++
Notepad ++ je tekst editor predviđen prvenstveno kao editor izvornog koda programa, ali se
može koristiti za otvaranje i obradu bilo kojih tekstualnih podataka. Što se tiče pisanja i čitanja
izvornog koda ovaj program ovaj program je veoma dobar prvenstveno zato što ima „Code
Highlighter” koji podržava dosta programskih jezika. Predviđen je da radi na Windows operativnom
sistemu. Program je napisan u programskom jeziku C++.
7
3.2.
Naslovna strana
Na naslovnoj strani nalaze se izlistani najnoviji proivodi, proizvodi na akciji i sa desne strane
top proizvodi odnosno proizvodi sa najviše lajkova. Sekcija sa top proizvodima se nalazi na svakoj
stranici. U glavnom meniju pored linkova koji vode na naslovnu stranu, stranu za kontakt i stranu za
logovanje, nalaze se i padajući meniji koji korisniku pružaju mogućnost da izabere iz koje
kategorije će proizvodi biti prikazani. Klikom na neku od kategorija proizvodi koji pripadaju toj
kategoriji će biti filtrirani i prikazani na stranici.
Slika 3.2.1. Naslovna strana.
3.3.
Logovanje
Na stranicu za logovanje korisnik dolazi klikom na dugme „Uloguj se“ koje se nalazi u
navigacionom meniju, gde unosi svoj email i lozinku. Ako nema nalog korisnik može da klikne na
link „Ovde“ i biće preusmeren na stranu gde će kreirati svoj nalog. Nakon uspešnog unosa korisnik
biva preusmeren na početnu stranu i u glavnom meniju će se pojaviti padajući meni koji će nositi
naziv ulogovanog korisnika i sastojaće se od linkova „Korpa“ i „Izloguj se“. U slučaju da se uloguje
administrator koji ima email „[email protected]“, on će videti tri linka u padajućem meniju i to:
„Kupovine“, „Izloguj se“ i „Unesi proizvod“.
