Internet Prodavnica Dokumentacija

UNIVERZITET U BEOGRADU

FAKULTET ORGANIZACIONIH NAUKA

Seminarski rad iz predmeta

INTERNET TEHNOLOGIJE

Naziv teme:

Internet prodavnica

Profesor: Studenti:

dr Božidar Radenković Danko Krstić 593/06

Vladimir Simić 301/06

Miloš Ljubić 347/06

Novembar 2010.

1

SADRŽAJ

1. Specifikacija zahteva.............................................................................................................................3

1.1. Opis problema 3

1.2. Specifikacija zahteva pomoću modela slčajeva korišćenja 3

2. Dijagram slučajeva korišćenja za korisnike...........................................................................................4

3. Dijagram slučajeva korišćenja za Administratore..................................................................................8

4. Sistemski dijagram sekvenci – korisnici...............................................................................................12

6. Sistemski dijagram sekvenci – Administratori.....................................................................................19

7. Prošireni model objekti-veze..............................................................................................................28

8. Prevođenje pmov u relacioni model...................................................................................................28

9. Dijagram komponenti.........................................................................................................................29

10. Opis tehnologija korišćenih u aplikaciji...............................................................................................29

HTML 29

CSS 29

JAVASCRIPT 30

PHP 31

AJAX 32

SQL 34

Arhitektura softverskog sistema 35

11. Korisničko uputstvo za neregistrovane korisnike................................................................................35

12. Korisničko uputstvo za registrovane korisnike....................................................................................37

13. Korisničko uputstvo za administratore...............................................................................................44

14. Reprezentativni delovi koda...............................................................................................................50

15. Uputstvo za instalaciju........................................................................................................................58

15. Literatura............................................................................................................................................59

2

1. SPECIFIKACIJA ZAHTEVA

1.1. OPIS PROBLEMA

Potrebno je napraviti web aplikaciju koja će omogućiti registrovanim korisnicima online naručivanje knjiga. Aplikacija će obuhvatati administratorski i korisnički deo. Administrator će imati mogućnosti izmene sadržaja internet prodavnice, kao i mogućnost promene svoje lozinke. Korisnik se prvo registruje, može da pregleda sadržaj na sajtu, koristi pretragu i da naruči knjigu.

Korisnik: Ova web aplikacija je namenjena svim osobama koje koriste internet i koje posete pomenutu aplikaciju.

Cilj: Cilj je da se na što efikasniji i lakši način korisnik dođe do željene knjige.

1.2. SPECIFIKACIJA ZAHTEVA POMOĆU MODELA SLUČAJEVA KORIŠĆENJA

U konkretnoj web aplikaciji definisani su sledeći slučajevi korišćenja za korisnike:

1. Prijava korisnika2. Odjava korisnika3. Registracija4. Pretraga po naslovima knjiga5. Naručivanje

3

U konkretnoj web aplikaciji definisani su sledeći slučajevi korišćenja za administratore:

1. Prijava administratora2. Odjava administratora3. Promena lozinke4. Dodavanje kategorije5. Izmena i brisanje naziva kategorije6. Dodavanje nove knjige7. Izmena knjiga

2. DIJAGRAM SLUČAJEVA KORIŠĆENJA ZA KORISNIKE

SK1: SLUČAJ KORIŠĆENJA – PRIJAVA KORISNIKA

Naziv: Prijava korisnika

Svrha: Prijava registrovanih korisnika na sajt

Akteri: Korisnik

Učesnici: Korisnik i sistem

Preduslov: Korisnik se registrovao na sajtu

4

Osnovni scenario:

1. Korisnik unosi korisničko ime i lozinku i potvrđuje unos.

2. Sistem prikazuje sadržaj prodavnice koji mogu videti samo registrovani i prijavljeni korisnici.

Alternativni scenario:

2.1. Ukoliko je korisnik uneo pogrešno korisničko ime i lozinku sistem ispisuje poruku o grešci.

SK2: SLUČAJ KORIŠĆENJA – ODJAVA KORISNIKA

Naziv: Odjava korisnika

Svrha: Odjavljivanje korisnika sa sajta

Akteri: Korisnik


Preduslov: Korisnik je ulogovan na sajtu

Osnovni scenario:

1. Korisnik bira opciju „Logout”.

2. Sistem odjavljuje korisnika i vraća povratnu informaciju da je korisnik izlogovan.


2.1 Ukoliko sistem ne može da se poveže na bazu prikazuje se poruka o datom problemu.

SK3: SLUČAJ KORIŠĆENJA – REGISTRACIJA

Naziv: Registracija

Svrha: Omogućava registraciju novih korisnika

Akteri: Korisnik

5


Preduslov:

Osnovni scenario:

1. Korisnik bira opciju „Registrujte se“.

2. Sistem otvara odgovarajuću formu.

3. Korisnik popunjava formu za registraciju.

4. Korisnik šalje podatke za registraciju sistemu.

5. Sistem upisuje podatke u bazu i čuva promene u bazi.


4.1 Ukoliko neki parametar polja neispunjava uslov, sistem izbacuje poruku da podaci nisu dobro uneti.

4.2 Ukoliko korisnik nije uneo sve podatke ispisuje se poruka o grešci.

5.1 Ako sistem ne može da se poveže na bazu prikazuje poruku o datom problemu.

SK4: SLUČAJ KORIŠĆENJA – PRETRAGA PO NASLOVIMA KNJIGA

Naziv: Pretraga po naslovima knjiga

Svrha: Omogućava korisniku pretragu sajta

Akteri: Korisnik


Preduslov: Prijavljen korisnik

Osnovni scenario:

1. Korisnik unosi željeni pojam u formu za pretragu.2. Korisnik bira opciju „Pretraga“.3. Sistem vrši pretragu i vraća traženi naslov.


3.1. Ukoliko sistem nije pronašao ni jedan rezultat, vraća poruku o datom problemu.

6

SK5: SLUČAJ KORIŠĆENJA – NARUČIVANJE

Naziv: Naručivanje

Svrha: Omogućava korisniku da naruči odabranu knjigu.

Akteri: Korisnik


Preduslov: Korisnik je prijavljen na sajtu.

Osnovni scenario:

1. Korisnik bira kategoriju.2. Korisnik bira knjigu iz izabrane kategorije.3. Korisnik bira opciju „Dodaj u korpu“.4. Kada korisnik završi sa naručivanjem „ide u korpu“ pritiskom na sliku korpe.5. Korisnik zatim bira opciju „Plaćanje“.6. Sistem izbacuje formu za unos podataka korisnika.7. Korisnik bira opciju „Plati“.8. Sistem vraća formu za unos podataka o kreditnoj kartici.9. Korisnik bira opciju „Plati“.10. Sistem ispisuje poruku o uspešnosti.


5.1 Ukoliko se korisnik predomislio o izboru određene knjige, vrši izmenu na dugme „Sačuvaj izmene“.

5.2 Ukoliko je korisnik odustao od kupovine, prazni korpu pritiskom na dugme „Isprazni“.

5.3 Ukoliko korisnik želi da doda još neki proizvod, pritiska dugme „Nastavi kupovinu“.




7

3. DIJAGRAM SLUČAJEVA KORIŠĆENJA ZA ADMINISTRATORE

SK1: SLUČAJ KORIŠĆENJA – PRIJAVA ADMINISTRATORA

Naziv: Prijava administratora

Svrha: Omogućava prijavu administratora na sajt

Akteri: Administrator

Učesnici: Administrator i sistem

Preduslov: Korisnik je registrovan kao administrator

Osnovni scenario:

1. Administrator unosi korisničko ime i lozinku i potvrđuje unos.

2. Sistem prikazuje poruku o uspešnom logovanju i otvara meni dostupan samo administratorima.


2.1 Ukoliko sistem ne može da se poveže na bazu prikazuje poruku o datom problemu.

SK2: SLUČAJ KORIŠĆENJA – ODJAVA ADMINISTRATORA

Naziv: Odjava administratora

Svrha: Omogućava odjavu administratora sa sajta



Preduslov: Administrator je prijavljen na sistem

Osnovni scenario:

1. Administrator bira opciju „Logout”.

2. Sistem odjavljuje administratora i vraća povratnu informaciju da je administrator izlogovan.

8



SK3: SLUČAJ KORIŠĆENJA – PROMENA LOZINKE

Naziv: Promena lozinke

Svrha: Omogućava promenu lozinke postojećih administratora



Preduslov: Administrator je registrovan i prijavljen

Osnovni scenario:

1. Administrator bira opciju „Izmeni administratorsku šifru“.


3. Administrator popunjava formu za promenu lozinke.

4. Administrator šalje podatke za promenu lozinke sistemu.


6. Sistem vraća informaciju o uspešnoj promeni lozinke.



5.2 Ukoliko administrator nije uneo sve podatke ispisuje se poruka o grešci.

SK4: SLUČAJ KORIŠĆENJA – DODAVANJE KATEGORIJE

Naziv: Dodavanje kategorije

Svrha: Omogućava administratoru da doda novu kategoriju


9


Preduslov: Administrator je ulogovan na sajtu

Osnovni scenario:

1. Administrator bira opciju „Dodaj novu kategoriju“.2. Sistem prikazuje formu na kojoj administrator unosi naziv nove kategorije koju želi

da doda. 3. Administrator pritiska dugme „Dodaj kategoriju“.4. Sistem izbacuje poruku da je nova kategorija dodata u bazi.



SK5: SLUČAJ KORIŠĆENJA – IZMENA I BRISANJE NAZIVA KATEGORIJE

Naziv: Izmena i brisanje naziva kategorije

Svrha: Omogućava administratoru da izmeni i obriše naziv kategorije iz baze




Osnovni scenario:

1. Administrator u delu za administraciju bira opciju „Idi na glavni sajt“.2. Sistem prikazuje sajt internet prodavnice.3. Administrator bira kategoriju koju želi da izmeni/obriše.4. Administrator pritiska dugme „Izmeni kategoriju“.5. Sistem izbacuje formu za izmenu/brisanje kategorije.6. Administrator popunjava formu.7. Administrator pritiska dugme „Izmeni kategoriju/Obriši kategoriju“.8. Sistem izbacuje poruku o uspešno izvršenoj radnji.



10

SK6: SLUČAJ KORIŠĆENJA – DODAVANJE NOVE KNJIGE

Naziv: Dodavanje nove knjige

Svrha: Omogućava administratoru da dodaje nove knjige u određene kategorije




Osnovni scenario:

1. Administrator bira opciju „Dodaj novu knjigu“.2. Sistem vraća formu za unos podataka o knjizi.3. Korisnik unosi podatke o knjizi i dodaje knjigu pritiskom na dugme „Dodaj Knjigu“.4. Sistem vraća informaciju o uspešnosti.



4.2 Ako korisnik nije uneo sve podatke sistem prikazuje poruku o tome.

SK7: SLUČAJ KORIŠĆENJA – IZMENA KNJIGA

Naziv: Izmena knjiga

Svrha: Omogućava administratoru da menja podatke o određenoj knjizi




Osnovni scenario:

1. Administrator bira opciju „Idi na glavni sajt“.2. Sistem prikazuje sajt internet prodavnice.3. Administrator bira kategoriju u kojoj se nalazi knjiga koju želi da promeni.4. Sistem vraća određene knjige koje se nalaze u toj kategoriji.5. Administrator bira knjigu koju želi da izmeni klikom na sliku knjige.

11

6. Sistem prikazuje sve podatke o knjizi.7. Administrator bira dugme „Izmeni Proizvod“.8. Sistem vraća popunjenu formu tog proizvoda.9. Administrator unosi izmene i pritiska dugne „Izmeni Knjigu“.10. Sistem vraća informaciju o uspešnosti.


9.1 Administrator bira opciju obriši knjigu pritiskom na dugme „Obriši knigu“.


4. SISTEMSKI DIJAGRAM SEKVENCI – KORISNICI

SK1: SLUČAJ KORIŠĆENJA – PRIJAVA KORISNIKA

Naziv: Prijava korisnika

Svrha: Prijava registrovanih korisnika na sajt

Akteri: Korisnik


Preduslov: Korisnik se registrovao na sajtu

Osnovni scenario:

1. Korisnik unosi korisničko ime i lozinku i potvrđuje unos.

2. Sistem prikazuje sadržaj prodavnice koji mogu videti samo registrovani i prijavljeni korisnici.

12


2.1. Ukoliko je korisnik uneo pogrešno korisničko ime i lozinku sistem ispisuje poruku o grešci.

SK2: SLUČAJ KORIŠĆENJA – ODJAVA KORISNIKA

Naziv: Odjava korisnika

Svrha: Odjavljivanje korisnika sa sajta

Akteri: Korisnik


Preduslov: Korisnik je ulogovan na sajtu

Osnovni scenario:

1. Korisnik bira opciju „Logout”.

2. Sistem odjavljuje korisnika i vraća povratnu informaciju da je korisnik izlogovan.

13



SK3: SLUČAJ KORIŠĆENJA – REGISTRACIJA

Naziv: Registracija

Svrha: Omogućava registraciju novih korisnika

Akteri: Korisnik


Preduslov:

Osnovni scenario:

1. Korisnik bira opciju „Registrujte se“.


3. Korisnik popunjava formu za registraciju.

4. Korisnik šalje podatke za registraciju sistemu.


14


4.1 Ukoliko neki parametar polja neispunjava uslov, sistem izbacuje poruku da podaci nisu dobro uneti.

4.2 Ukoliko korisnik nije uneo sve podatke ispisuje se poruka o grešci.

15


SK4: SLUČAJ KORIŠĆENJA – PRETRAGA PO NASLOVIMA KNJIGA

Naziv: Pretraga po naslovima knjiga

Svrha: Omogućava korisniku pretragu sajta

Akteri: Korisnik


Preduslov: Prijavljen korisnik

Osnovni scenario:

4. Korisnik unosi željeni pojam u formu za pretragu.5. Korisnik bira opciju „Pretraga“.6. Sistem vrši pretragu i vraća traženi naslov.

16


3.1 Ukoliko sistem nije pronašao ni jedan rezultat, vraća poruku o datom problemu.

SK5: SLUČAJ KORIŠĆENJA – NARUČIVANJE

Naziv: Naručivanje

Svrha: Omogućava korisniku da naruči odabranu knjigu.

Akteri: Korisnik


Preduslov: Korisnik je prijavljen na sajtu.

Osnovni scenario:

1. Korisnik bira kategoriju.2. Korisnik bira knjigu iz izabrane kategorije.3. Korisnik bira opciju „Dodaj u korpu“.4. Kada korisnik završi sa naručivanjem „ide u korpu“ pritiskom na sliku korpe.5. Korisnik zatim bira opciju „Plaćanje“.6. Sistem izbacuje formu za unos podataka korisnika.7. Korisnik bira opciju „Plati“.8. Sistem vraća formu za unos podataka o kreditnoj kartici.9. Korisnik bira opciju „Plati“.10. Sistem ispisuje poruku o uspešnosti.

17


5.1 Ukoliko se korisnik predomislio o izboru određene knjige, vrši izmenu na dugme „Sačuvaj izmene“.

5.2 Ukoliko je korisnik odustao od kupovine, prazni korpu pritiskom na dugme „Isprazni“.

18

5.3 Ukoliko korisnik želi da doda još neki proizvod, pritiska dugme „Nastavi kupovinu“.7.1 Ukoliko korisnik želi da doda još neki proizvod, pritiska dugme „Nastavi kupovinu“.9.1 Ukoliko korisnik želi da doda još neki proizvod, pritiska dugme „Nastavi kupovinu“.


5. SISTEMSKI DIJAGRAM SEKVENCI – ADMINISTRATORI

SK1: SLUČAJ KORIŠĆENJA – PRIJAVA ADMINISTRATORA

Naziv: Prijava administratora

Svrha: Omogućava prijavu administratora na sajt



19

Preduslov: Korisnik je registrovan kao administrator

Osnovni scenario:

1. Administrator unosi korisničko ime i lozinku i potvrđuje unos.

2. Sistem prikazuje poruku o uspešnom logovanju i otvara meni dostupan samo administratorima.


2.1 Ukoliko sistem ne može da se poveže na bazu prikazuje poruku o datom problemu.

SK2: SLUČAJ KORIŠĆENJA – ODJAVA ADMINISTRATORA

Naziv: Odjava administratora

Svrha: Omogućava odjavu administratora sa sajta



20

Preduslov: Administrator je prijavljen na sistem

Osnovni scenario:

1. Administrator bira opciju „Logout”.

2. Sistem odjavljuje administratora i vraća povratnu informaciju da je administrator izlogovan.



SK3: SLUČAJ KORIŠĆENJA – PROMENA LOZINKE

Naziv: Promena lozinke

Svrha: Omogućava promenu lozinke postojećih administratora


21


Preduslov: Administrator je registrovan i prijavljen

Osnovni scenario:

1. Administrator bira opciju „Izmeni administratorsku šifru“.


3. Administrator popunjava formu za promenu lozinke.

4. Administrator šalje podatke za promenu lozinke sistemu.


6. Sistem vraća informaciju o uspešnoj promeni lozinke.



5.2 Ukoliko administrator nije uneo sve podatke ispisuje se poruka o grešci.22

SK4: SLUČAJ KORIŠĆENJA – DODAVANJE KATEGORIJE

Naziv: Dodavanje kategorije

Svrha: Omogućava administratoru da doda novu kategoriju




Osnovni scenario:

1. Administrator bira opciju „Dodaj novu kategoriju“.2. Sistem prikazuje formu na kojoj administrator unosi naziv nove kategorije koju želi

da doda. 3. Administrator pritiska dugme „Dodaj kategoriju“.4. Sistem izbacuje poruku da je nova kategorija dodata u bazi.

23



SK5: Slučaj korišćenja – izmena i

brisanje naziva kategorijeNaziv: Izmena i brisanje naziva kategorijeSvrha: Omogućava administratoru da izmeni i obriše naziv kategorije iz bazeAkteri: AdministratorUčesnici: Administrator i sistemPreduslov: Administrator je ulogovan na sajtuOsnovni scenario:Administrator u delu za administraciju bira opciju „Idi na glavni sajt“.

1. Sistem prikazuje sajt internet prodavnice.2. Administrator bira kategoriju koju želi da izmeni/obriše.3. Administrator pritiska dugme „Izmeni kategoriju“.4. Sistem izbacuje formu za izmenu/brisanje kategorije.5. Administrator popunjava formu.6. Administrator pritiska dugme „Izmeni kategoriju/Obriši kategoriju“.7. Sistem izbacuje poruku o uspešno izvršenoj radnji.


24


SK6: Slučaj korišćenja – Dodavanje

nove knjigeNaziv: Dodavanje nove knjigeSvrha: Omogućava administratoru da dodaje nove knjige u određene kategorijeAkteri: AdministratorUčesnici: Administrator i sistemPreduslov: Administrator je ulogovan na sajtuOsnovni scenario:1. Administrator bira opciju „Dodaj novu knjigu“.2. Sistem vraća formu za unos podataka o knjizi.3. Korisnik unosi podatke o knjizi i dodaje knjigu pritiskom na dugme „Dodaj Knjigu“.4. Sistem vraća informaciju o uspešnosti.

Alternativni scenario:4.1 Ako sistem ne može da se poveže na bazu prikazuje poruku o datom problemu.

4.2 Ako korisnik nije uneo sve podatke sistem prikazuje poruku o tome.

25

SK7: Slučaj korišćenja – Izmena

KnjigaNaziv: Izmena knjigaSvrha: Omogućava administratoru da menja podatke o određenoj knjiziAkteri: AdministratorUčesnici: Administrator i sistemPreduslov: Administrator je ulogovan na sajtuOsnovni scenario:1. Administrator bira opciju „Idi na glavni sajt“.2. Sistem prikazuje sajt internet prodavnice.3. Administrator bira kategoriju u kojoj se nalazi knjiga koju želi da promeni.4. Sistem vraća određene knjige koje se nalaze u toj kategoriji.5. Administrator bira knjigu koju želi da izmeni klikom na sliku knjige.6. Sistem prikazuje sve podatke o knjizi.7. Administrator bira dugme „Izmeni Proizvod“.8. Sistem vraća popunjenu formu tog proizvoda.9. Administrator unosi izmene i pritiska dugne „Izmeni Knjigu“.10.Sistem vraća informaciju o uspešnosti.

Alternativni scenario:9.1 Administrator bira opciju obriši knjigu pritiskom na dugme „Obriši knigu“.

10.1 Ako sistem ne može da

26

se poveže na bazu prikazuje poruku o datom problemu.

prošireni model objekti-veze

6. PREVOĐENJE PMOV U RELACIONI MODEL

Administrator(#Username, Password)

Kategorije(#Catid, Catname)

Knjige(#ISBN, Autor, Title, Catid, Price, Description)27

Stavke naručivanja(#Orderid, #ISBN)

Naručivanje(#Orderid, Userid)

Korisnici(#Userid, Username, Password, Name, Email, Address)

7. DIJAGRAM KOMPONENTI

8. OPIS TEHNOLOGIJA KORIŠĆENIH U APLIKACIJI

HTML

HTML, HyperText Markup Language, je standarizovani jezik koji se koristi pri strukturiranju tekstova, medija i ugrađenih objekata u web stranice i elektronsku poštu. Kao modifikovanu i pojednostavljenu verziju SGML jezika, HTML standarizuje i održava World Wide Web Consortium (W3C). Originalnu verziju HTML-a kreirao je Tim Berners-Lee, a prva zvanična verzija je izašla juna 1993 godine. HTMl jezik je sačinjen od običnog teksta i tagova. Iako se HTML znakovi (tags) često nazivaju kodom, tehnički HTML nije kod jer kompjuterski kod su instrukcije koje od računara traže da izvrši određenu operaciju. Svrha HTML znakova je da se se struktura dokumenta "označi" tako da bi korisnikov agent (user agent), tj. internet pretraživač mogao da prepozna strukturu dokumenta i ispravno je prikaže u prozoru internet pretraževača kojeg korisnik koristi.

Za dodatno modifikovanje web stranica, do sada su izašli neki dodaci:

28

CSS ili Cascading Style Sheets za izgled i položaj prezentacije Skriptni jezici (Javascript, VBScript) za omogućavanje dinamičnosti i

interaktivnosti na web prezentacijama, DOM ili Document Object Model, koji označava vezu između skripte i elementa

na stranici

Gornji dodaci, u paketu sa HTML jezikom, ponekad se nazivaju DHTML ili Dinamični HTML.

CSS

CSS je u osnovi skup instrukcija koje definišu kako neki HTML dokument treba da se prikaže. Najbolja stvar kod CSS-a je da se on može deflnisati u spoljašnjoj datoteci, ili listu (sheet). Pretraživač onda može da pročita ovaj spoljašnji list i da primeni sadržaj na određeni sadržaj datoteke. Na taj način se stil i formatiranje strane odvajaju od samog sadržaja. Ovo je vrlo bitan koncept kod dizajna web strana. Ovo Vam pruža moćan i detaljan način da ažurirate svoj web sajt. U datoteci sa stilovima možete definisati da se za tekst primenjuje font Arial, da je veličina slova 12 piksela, da su slova crvene boje, da su masna, da je tekst levo poravnat i da je pozadina plava. Ako ovu datoteku pridružite svim stranama na svom sajtu, tekst će se uvek prikazivati na taj način. Ako promenite mišljenje, možete da promenite jednu datoteku i da zadate da font bude Times, da veličina slova bude 28 piksela, da su zelene boje, pisana kurzovim i desno poravnata. Upamtite tu novu datoteku i ceo web sajt se automatski ažurira. CSS takođe omogućava da radite neke stvari koje u HTML-u nisu moguće. Za svoju stranu možete definisati nivo kroz koji ćete se kretati klizačem. Na taj način možete da imate prozor u sredini strane sa sadržajem kroz koji se možete kretati uz pomoć klizača. Za svaku ivicu u okviru tabele možete definisati različitu boju. Možete podesiti da se kod oznaka za nabrajanje koristi korisnički definisana grafika, ili možete obrisati podvlačenje hiperlinkova. Premda se sa svakom novom verzijom pretraživača poboljšava podrška koju oni imaju za CSS, ipak neće svi pretraživači prikazati sve elemente CSS-a, niti će sve elemente prikazati na isti način. Uvek je dobro da svoju stranu testirate u različitim pretraživačima. Jedna od bitnih ideja u vezi CSS-a je da ako pretraživač ne podržava neki stil, informacije su i dalje tu, ali se ne koriste stilovi koji nedostaju. IE 5 i Netscape 6 i novije verzije uglavnom prikazuju većinu CSS elemenata. Izvesna ograničenja postoje u verziji Netscape 4. CSS Vam daje neverovatnu kontrolu nad stranama. W3C sada preporučuje da za formatiranje strana koristite CSS. Trebalo bi da pažljivo razmotrite mogućnosti primene CSS-a kod dizajna.

JAVASCRIPT

Java Script pripada grupi jezika za skriptovanje, pre svega klijentske strane, mada se može izvršavati i na serveru (runat=“server“). Java Script je najpopularniji jezik na Internetu, koji je dizajniran da poveća interaktivnost HTML strana.

29

Razvila ga je kompanija Netscape Communications i uvela u Netscape Navigator, počevši od verzije 2.0, uporedo sa uvođenjem podrške za Javu. JavaScript je uveden radi povećanja interaktivnosti veb strana. Veb čitači koji podržavaju JavaScript interpretiraju kod.

JavaScript dodaje interaktivnost veb prezentaciji na strani klijenta. Na primer, korišćenjem JavaScripta je moguće odgovarati na akcije korisnika u samom veb čitaču. Bitno je naglasiti da JavaScript program može da se izvrašava samo u okviru veb čitača i nigde drugde. Pri kreiranju JavaScript koda može se koristiti bilo koji ASCII editor.

Polazni naziv JavaScript jezika bilo je LiveScript, ali u saradnji Netscape-a i Sun-a, ime je izmenjeno u JavaScript, zbog namere da Java i JavaScript budu jezici Interneta i internet programiranja.

JavaScript programi se koriste da bi detektovali i reagovali na događaje koji su inicirani od strane korisnika, kao npr. prelazak mišem preko linka i grafičkog objekta na strani. JavaScript kod može da poboljša kvalitet sajta navigacionim pomagalima, skrolovanim porukama, dialog prozorima, dinamičnim slikama, koliicima za kupovinu (shopping cart), itd. JavaScript omogućava korisnicima da kontrolišu izled veb strane dok se dokument „tumači“ od strane čitača. Uz pomoć JavaScripta, možemo da proverimo tačnost podataka koje je korisnik ukucao u formu, pre nego što se ti podaci prebace na server. JavaScript testira brauzaer korisnika da vidi da li ima neophodne dodatke (plug inns) za učitavanje tražene strane i ako ih nema, JavaScript usmerava korisnika na drugi sajt da ih nabavi. JavaScript služi kao programski jezik. Njegovo jezgrosadrži osnovne elemente programskih jezika kao što su promenljive, tipovi podataka, kontrolne petlje, if/else izjave, switch izjave, funkcije i objekte. JavaScript se koristi za aritmetičke operacije, manipulacije datumom i vremenom, nizovima, stringovima i objektima. On takođe čita i upisuje vrednosti kuki fajlova i dinamički kreira HTML na osnovu vrednosti kukija.

PHP

Server - side skripting je web server tehnologija koja omogućava da se korisnički zahtevi obrađuju pomoću skripti koje se izvršavaju na serverskoj strani kako bi se generisale dinamičke stranice. Najčešće se koristi da bi se interaktivne web stranice povezale sa bazama podataka, radi identifikacije korisnika, ažuriranja sadržaja, stvaranja raznih diskusionih grupa i još zbog mnogo toga. Razlika između skriptovanja na serverskoj i korisničkoj strani je u tome što se kod korisničke strane skripte izvršavaju u web browser-u korisnika, najčešće pomoću JavaScript-a.

Najzastupljenije tehnike serverske strane :

Common Gateway Interface Active Server Pages Java Servlet i Java Server Pages

30

PHP

PHP je open source jezik koji se koristi za razvoj server-side aplikacija, kao i dinamičkog Web sadržaja. PHP dozvoljava interakciju sa velikim brojem relacionih baza podataka kao što su MySQL, Oracle, IBM D2, Microsoft SQL Server, PostgreSQL i SQLite. PHP radi na većini operativnih sistema današnjice, kao što su UNIX, Linux, Windows i Mac OS i može da interaguje sa većinom Web servera.

Personal Home Page Tools je predstavio PHP 1995. godine, a dve godine kasnije su razvoj nastavila dva Izraelska programera. Od 1999. godine se zasniva na Zend engine-u. PHP je prvo bio akronim za Personal Home Page Tools, da bi kasnije promenio naziv u Hypertext Preprocessor.

PHP je stekao popularnost zbog svoje jednostavnosti i sintakse nasleđene iz programskog jezika C. Tokom vremena jezik se proširivao i sticao mogućnosti za objektno orijentisano programiranje, naročito od verzije 5.0. Nalikuje jeziku C++ u smislu da dozvoljava i čisto-proceduralno programiranje ali omogućava i korišćenje klasa i drugih koncepata objektno orijentisanog programiranja (nasleđivanje, apstraktne metode, interfejsi itd.).

Danas, PHP je instaliran na više od 20 miliona sajtova i preko million web servera. Poslednja realizovana stabilna verzija je 5.2.6 iz maja 2008.god.

Neke od osnovnih odrednica PHP – a su:

PHP je akronim za Hypertext Preprocessor server – side skriptni programski jezik skripte se izvršavaju na serveru podržava rad sa različitim bazama podatama (MySQL, Informix, Oracle, Sybase,

Solid, PostgreSQL, Generic ODBC, itd.) open source softver (OSS) radi na različitim platformama (Windows, Linux, Unix i td.) kompatibilan je sa skoro svim serverima koji se danas koriste (Apache, IIS, itd. ) lak je za učenje i efikasno funkcioniše na strani servera.

Za PHP fajlove, bitne su sledeće činjenice:

mogu da sadrže tekst, HTML tagove i skripte vraćaju se klijentskom browser – u kao HTML tekst (plain HTML) imaju ekstenziju: “.php”, “.php3” ili “.phtml”

AJAX

AJAX predstavlja web razvojnu tehniku za kreiranje interaktivnih web sadržaja. AJAX tehnologija se zasniva na razmeni malih količina podataka sa serverom, kako korisnik ne bi stalno morao da osvežava stranicu. Na taj način se omogućava potpuna

31

interaktivnost, efikasnost i poboljšava funkcionisanje stranice uopšte. AJAX nije tehnologija sam po sebi, već termin koji se odnosi na korišćenje grupe tehnologija.

AJAX obuhvata:

prezentaciju baziranu na standardima koristeći XHTML i CSS; dinamički prikaz i interakciju preko Document Object Model-a;

razmenu i manipulaciju nad podacima koristeći XML i XSLT;

asinhrono prikupljanje podataka uz pomoć XMLHttpRequest-a koji čini jezgro;

i JavaScript koji povezuje sve u celinu.

Ideja koja se krije iza AJAX-a jeste da se stranica na kojoj se odvija web aplikacija učita samo jednom, a da se svaka dalja komunikacija sa serverom sakrije od očiju korisnika i obavlja bez ponovnog učitavanja čitave stranice. Svaki prenos podataka između servera i klijenta (u slučaju AJAX-a to je browser) vrši se u pozadini. Jasno je da je ovo nemoguće izvesti statičkim HTML-om, pa tu na scenu stupa JavaScript. JavaScript je zadužen za komuniciranje sa serverom – slanje HTTP zahteva, prijem podataka sa servera i njihov prikaz na stranici, a i interakcija sa korisnikom postiže se korišćenjem ovog jezika.

Neki od osnovnih principa na kojima bi trebalo da se zasnivaju AJAX aplikacije: Minimalan protok - AJAX aplikacije bi trebalo da šalju i primaju sa servera što je

moguće manje informacija AJAX aplikacije predstavljaju korisniku drugačije modele interakcije od

tradicionalnih web aplikacija. Nasuprot “klik – čekaj“ prirodi standardnih web aplikacija, AJAX predstavlja modele interakcije koji su slični desktop aplikacijama. Bez obzira koji se model interakcije koristi, najbitnije je obezbediti konzistentnost kako bi korisnik znao šta treba sledeće da uradi.

Izbegavaju se nepotrebni elementi na strani kao što su animacije ili delovi koji trepere.

Izbegava se preuzimanje cele strane - celokupna komunikacija sa serverom, nakon učitavanja inicijalne web strane treba da bude zadatak AJAX engine –a.

AJAX omogućava različite funkcionalnosti:

Validacija podatka u realnom vremenu - Podaci na formama kao što su: user IDs, serial numbers, postal codes, i ostali koji zahtevaju validaciju od strane servera, mogu biti provereni pre submit- ovanja forme. Autocompletion i autosuggest - Određeni delovi podataka koji se unose od strane korisnika(posetioca): e-mail adresa, ime, grad i ostali se mogu automatski kompletirati, tj. dovršiti odmah nakon što se unesu samo početni delovi.

Učitavanje na zahtev - U skladu sa iniciranim događajem od strane korisnika, HTML strana može povući veću količinu podataka u pozadini i omogućiti učitavanje kompletne strane mnogo brže.

32

Sofisticiran korisnički interfejs, kontrole i efekti – Kontrole kao što su meniji, tabele podatka, tekst editori, kalendari, status bar-ovi I sl. Omogućavaju korisnicima bolju interakciju, bez potrebe za učitavanjem kompletne stranice.

Osvežavanje podataka - HTML stranice povlače podatke sa servera i omogućavaju najsvežije podatke kao što su rezultati, cene akcija, vreme ili neke druge podatke iz specifičnih aplikacija.

Delimičan submit – bez potrebe za učitavanjem cele forme.

Stranica kao aplikacija – web stranice postaju slične desktop aplikacijama

Iscrtavanje grafika – izveštaja na osnovu asinhronih upita nad bazom

Može se zaključiti da, za razliku od klasičnih web aplikacija, AJAX onemogućava korisničkom interfejsu direktnu komunikaciju sa serverom. Na taj način je moguće ostvariti n-slojnu arhitekturu u punom smislu te reči (u potpunosti je odvojen korisnički interfejs od ostatka sistema). AJAX engine je odgovoran za tu komunikaciju i on na određen način i ima odgovornost kontrolera korisničkog interfejsa, jer poziva server u skladu sa akcijama korisnika. HTTP request prenosi zahteve do servera dok se oni sa servera vraćaju u odgovarajućem obliku. AJAX engine može da ima u potpunosti ulogu kontrolera korisničkog interfejsa ukoliko se, kao što je i preporučlijvo, unutar njega implementiraju i funkcije koje će da obrađuju korisničke akcije (pritisak miša, dugmeta i sl.). Zahtevi prema, kao i odgovori od strane servera, se ne moraju poklapati sa korisničkim zahtevima, već se odvijaju u bilo kom pogodnom trenutku. Browser se “ne zamrzava“ i ne čeka na odgovor servera. Umesto toga, korisnik je neprestano u mogućnosti da skroluje, pritiska miša, kuca na stranici. AJAX aplikacija eliminiše start-stop-start-stop prirodu interakcije sa Webom uvodeći posrednika – AJAX engine – izmedju korisnika i servera. Izgledalo je da će se dodavanjem sloja samo usporiti aplikacija, ali to uopšte nije slučaj. Umesto učitavanja web strane, na startu sesije, browser učitava AJAX engine – napisanu u JavaScriptu i obično sklonjenu u neki skriveni frejm. AJAX engine je odgovoran za prenos podataka u oba smera, prikazivanje interfejsa koji korisnik vidi i komunikaciju sa serverom u ime korisnika. AJAX engine dozvoljava korisniku da se njegova interakcija sa aplikacijom odigrava asinhrono – nezavisno od komunikacije sa serverom. Svaka korisnička akcija koja bi generisala HTTP zahtev, umesto toga dobija formu JavaSript poziva AJAX engine. Svaki odgovor na korisničku akciju koji ne zahteva odgovor od servera, kao što je prosta validacija podataka, izmena podataka u memoriji, čak i neka navigacija – engine vraća sama. Upotrebom AJAX-a mnoge od akcija, koje su karakteristične za desktop aplikacije, postaju dostupne i u web aplikacijama (real-time validacija podatka, drag and drop, i sl.)

SQL

SQL je standardni programski jezik za pristup i manipulaciju podacima iz relacionih baza podataka i podržan je od strane svih servera relacionih baza podataka. U relacionim bazama podaci su skladišteni preko niza tabela. Svaka tabela sadrži kolone koje opsiuju atribute podataka, a svaki red je instanca podataka.

RELATIONAL DATA BASE MANAGEMENT SYSTEMS (RDBMS), ODNOSNO SISTEMI ZA UPRAVLJANJE RELACIONIM BAZAMA PODATAKA SU SE U PRAKSI POKAZALI KAO NAJBOLJI NAČIN UPRAVLJANJA PODACIMA.

33

ARHITEKTURA SOFTVERSKOG SISTEMA

9. KORISNIČKO UPUTSTVO ZA NEREGISTROVANE KORISNIKE

Izgled početne strane sajta dat je na sledećoj slici:

34

Korisnik zatim pritiska dugme “Registrujte se” i otvara mu se sledeća forma:

Nakon unosa podataka korisnik pritiska dugme “Registruj se”.

Zatim mu sistem vraća poruku o uspešnosti:

Nakon registracije se može ulogovati sa unetim podacima kao registrovani korisnik.

35

10. KORISNIČKO UPUTSTVO ZA REGISTROVANE KORISNIKE

Nakon uspešne registracije korisnik vidi početnu stranu a takodje ima i dugme “logout” gde može da se izloguje.

36

Korisnik bira jednu od kategorija (mi smo izabrali “Računari i internet” i otvara mu se sledeća strana)

37

Vidimo da korisnik dalje bira knjigu koju želi da kupi a ima i opis knjige preko AJAX tehnologije:

Dalje moze da bira dugme “Nastavi kupovinu” koja bi ga vratila na pocetnu stranu ,ili da izabere knjigu:

38

Ova strana nam pokazuje informacije o izabranoj knjizi.

Dalje korisnik bira opciju “Dodaj u korpu ” i u korpi se pokazuje količina do sada izabranih knjiga.

39

Klikom na sličicu korpe korisniku se otvara sledeća strana:

Korisnik ovde ima više opcija: može da izabere da sačuva izmene i na taj način čuva izmene u korpi. Može da isprazni stavku iz korpe i sistem mu vraća sledeću poruku:

Zatim može da se vrati na početnu stranu klikom na dugme “Nastavi kupovinu”, ili da izabere opciju “Placanje”:

40

Nakon unosa ličnih podataka kupac bira opciju “Plati ”:

41

Kao i na prethodnoj strani kupac mora da popuni prazna polja i da nastavi kupovinu odabirom dugmeta “Plati”, ili da se vrati na početnu stranu i nastavi kupovinu.

Ako želi da plati sistem vraća sledeću poruku:

Korisniku je takođe dostupna i opcija pretrage knjiga po naslovima:

42

11. KORISNIČKO UPUTSTVO ZA ADMINISTRATORE

Na slici ispod je prikazana forma do koje se dolazi kada se na početnoj strani izabere opcija „Logujte se kao administrator“ . Administrator popunjava svoje login podatke, a zatim pritiska dugme „Log in“.

Kao što se vidi na slici, kada se korisnik uloguje kao administrator, dobija meni koji običnim korisnicima nije dostupan a koji mu omogućuje da upravlja sadržajem internet prodavnice:

43

Klikom na “Idi na glavni sajt”, administrator ima mogućnost surfovanja na sajtu tako što ga sistem vodi na početnu stranu sajta:

Takođe ima opciju odabira dugmeta „Administrator“ koji ga vodi na početni admin panel.

Ukoliko administrator izabere opciju „Dodaj novu kategoriju“, sistem mu vraća formu za unos nove kategorije, koju on popunjava:

Administrator zatim bira opciju „Dodaj kategoriju“, a sistem vraća poruku:44

Ukoliko administrator izabere opciju „Dodaj novu knjigu“, sistem mu vraća formu za unos nove kategorije, koju on popunjava:

Administrator zatim klikće dugme „Dodaj knjigu“ nakon čega sistem vraća poruku da je nova knjiga uspešno dodata u bazu, naravno, pod uslovom da je prethodna forma popunjena na pravi način.

45

Sa druge strane, ukoliko administrator izabere opciju „Izmeni administratorsku sifru“, sistem prikazuje sledeću formu koju administrator popunjava:

Zatim potvrđuje svoj unos klikom na dugme „Promeni sifru“, nakon čega sistem vraća povratnu poruku:

Takođe, administrator može izvršiti pretragu sajta po nazivima knjiga, bilo unosom jedne ključne reči ili celog naziva knjige:

Sistem vraća rezultat pretrage gde ukoliko se mišem stane na naziv knjige, dobija se opis zahvaljujući AJAX tehnologiji:

46

Ako administrator izabere knjigu, dobiće detaljnije informacije o knjizi:

47

Administrator može izabrati dugme „Izmeni proizvod“, a sistem mu u tom slučaju vraća već popunjenu formu sa trenutnim opisom knjige koju želi da izmeni a na administratoru je da prepravi neke od stavki opisa:

Kao što se vidi na slici, administrator može izabrati dugme „Izmeni Knjigu“ ili dugme „Obrisi knjigu“ a u oba slučaja sledi povratna informacija od sistema o uspešnosti izvršene akcije.

Isto važi i u slučaju izmene ili brisanja naziva kategorije knjiga:

Naravno u svakom trenutku administrator ima opcije „Nazad na admin panel“ kao i „Logout“ koje su dostupne na svim stranicama sajta kojima može pristupiti:

48

12. REPREZENTATIVNI DELOVI KODA

Metoda connection.php koja je zadužena za uspostavljanje konekcije sa bazom:

<?php

$db_host = 'localhost';

// Your username for MySQL.

$db_user = "root";

// Your password for MySQL.

$db_pass = "";

// And your given name for the database.

$db_name = 'book_store';

// The database connection.

$con = mysql_connect($db_host, $db_user, $db_pass);

if(!$con) {

die("Cannot connect. " . mysql_error());

}

// The database name selection.

$dbselect = mysql_select_db($db_name);

if(!$dbselect) {

die("Cannot select database " . mysql_error());

}

?>

Izgled početne strane za administratora se realizuje kroz sledeći kod:

<?php

session_start();

include ('funkcije.php');

do_html_header('Dobrodosli u prodavnicu knjiga');

49

display_search();

echo '<h3>Odaberite kategoriju:<h3>';

// uzmi kategorije iz baze

$cat_array = get_categories();

// prikazi kao linkove ka stranama za kategorije

display_categories($cat_array);

if(isset($_SESSION['admin_user']))

{

display_button('admin.php', 'administrator', 'Admin Menu');

}

do_html_footer();

?>

Forma za registraciju novih korisnika izgleda ovako:

<?php

include ('funkcije.php');

do_html_header("Registracija");

$conn =db_connect();

$username = $_POST['username'];

$password = $_POST['password'];

$name = $_POST['name'];

$address = $_POST['address'];

$city = $_POST['city'];

50

$zip= $_POST['zip'];

$country = $_POST['country'];

$email = $_POST['email'];

$query = "INSERT INTO `users` (username, password, name, address, city, zip, country, email) VALUES ('$username', '$password','$name','$address','$city','$zip','$country','$email')";

$result = $conn->query($query);

if(!$result) {

echo "Niste uspesno registrovani. " . mysql_error(); //

} else {

echo "Dobro dosli " . $username . " .Uspesno ste registrovani";

display_button('index.php', 'nastavi', 'Nastavi');

}

do_html_footer();

?>

Login registrovanih korisnika se realizuje metodom user.php:

<?php

// ukljucimo funkcije koje cemo koristiti

require_once('funkcije.php');

session_start();

if (!empty($_POST['username'])&&!empty($_POST['passwd']))

// pokusava se ulogovanje

{

$username = $_POST['username'];

$passwd = $_POST['passwd'];

51

if (login_user($username, $passwd))

{

// ako postoji korisnik u bazi, registrujemo njegovo ime u sesiji

$_SESSION['user'] = $username;

include ("prva.php");

}

else

{

// neuspesan login

do_html_header('Problem:');

echo 'Ne možete se ulogovati.

Da bi ste videli stranicu, morate se ulogovati. ';

do_html_url('index.php', 'Login');

do_html_footer();

exit;

}

} else {

do_html_header('Problem:');

echo 'Niste uneli sve podatke. Pokusajte ponovo. ';

do_html_url('index.php', 'Login');

do_html_footer();

}

?>

52

Opcija search na sajtu je predstavljena kodom:

<?php

session_start();

include ("connection.php");

include ("funkcije.php");

do_html_header('Rezultati pretrage');

display_search();

$text=$_POST['text'];

if ($text==null){

die();

}

$sql="SELECT * FROM books WHERE title LIKE '%$text%'OR description LIKE '%$text%'";

if (!$q=mysql_query($sql))

{

echo "Nastala je greska pri izvodenju upita " . mysql_query();

die();

}

if (mysql_num_rows($q)==0)

{

echo "Nema knjiga koji odgovaraju vasem kriterijumu pretrage,pokusajte ponovo";

}

else {

while ($book=mysql_fetch_array($q))

{

display_book($book);

}

}

if(isset($_SESSION['admin_user']))

53

{

display_button('prva.php', 'nastavi', 'Nastavite sa kupovinom');

display_button('admin.php', 'administrator', 'Admin panel');

display_button("edituj_kategoriju_forma.php?catid=$catid",

'izmeni_kategoriju', 'Izmeni kategoriju');

}

else

display_button('prva.php', 'nastavi_kupovinu', 'Nastavite kupovinu');

do_html_footer();

?>

Osnovni kod koji omogućuje prikaz AJAX tehnologije u zavisnosti od browsera:

function getXMLHTTPRequest()

{

var request = false;

try

{

request = new XMLHttpRequest(); /* e.g. Firefox */

}

catch(err1)

{

try

{

vrequest = new ActiveXObject("Msxml2.XMLHTTP");

/* some versions IE */

}

catch(err2)

{

try

54

{

request = new ActiveXObject("Microsoft.XMLHTTP");

/* some versions IE */

}

catch(err3)

{

request = false;

}

}

}

return request;}

Kada su stvari ubacene u korpu, sledeći AJAX kod generiše povratne informacije:

function responseUbaciUKorpu() {

if(myRequest.readyState == 4) {

// if server HTTP response is "OK"

if(myRequest.status == 200) {

var result = new Array();

result = myRequest.responseText.split(':');

document.getElementById('ukupno_stvari').innerHTML = 'Ukupno stvari = '+result[0];

document.getElementById('ukupna_cena').innerHTML = 'Ukupna cena = '+result[1]+' RSD';

}

else {

// issue an error message for any

// other HTTP response

alert("An error has occurred: " + myRequest.statusText);

}

}

}

55

Deo koda koji omogućuje administratoru da edituje knjige:

<?php

// ukljucimo sve funkcije

require_once('funkcije.php');

session_start();

do_html_header('Izmena knjige');

if (check_admin_user())

{

if (filled_out($_POST))

{

$oldisbn = $_POST['oldisbn'];

$isbn = $_POST['isbn'];

$title = $_POST['title'];

$author = $_POST['author'];

$catid = $_POST['catid'];

$price = $_POST['price'];

$description = $_POST['description'];

if(update_book($oldisbn, $isbn, $title, $author, $catid,

$price, $description))

echo 'Knjiga je izmenjena. ';

else

echo 'Knjiga nije mogla biti izmenjena. ';

}

else

echo 'Niste popunili formu. Pokusajte ponovo.';

56

do_html_url('admin.php', 'Povratak na administratorski panel');

}

else

echo 'Niste autorizovani da vidite sadrzaj.';

do_html_footer();

13. UPUTSTVO ZA INSTALACIJU

1. U softveru za upravljanje bazom podataka (npr. PhpMyAdmin) treba kreirati novu bazu pod nazivom book_store, a kao collation izabrati utf8_unicode_ci.

2. Izvršiti uvoz baze iz fajla book_store.sql.3. Prekopirati folder prodavnica_knjiga u root folder web servera (www ili

htdocs folder).4. U fajlu connection.php nalaze se parametri potrebni za konekciju na bazu.

Ukoliko su drugačiji parametri za pristup MySQL serveru, to je moguće izmeniti u ovom fajlu.

5. Za pristup sajtu, potrebno je otvoriti browser i pristupiti stranici http://localhost/prodavnica_knjiga/

6. Za logovanje na administratorski nalog može se koristiti korisničko ime admin i lozinku admin, a za logovanje na nalog običnog korisnika može se koristiti korisničko ime vlada i lozinka vlada.

57

http://localhost/prodavnica_knjiga/%20

15. LITERATURA

[1] Materijali sa sajta http://www.myelab.net

[2] Materijali sa sajta http://www.learnphp.org/

[3] Luke Welling, Laura Thomson „PHP i MzSQL Razvoj aplikacija za Web“, Mikro knjiga, 2009

58

http://www.learnphp.org/

http://www.myelab.net/

Documents

Internet Prodavnica Dokumentacija