Uvod u Veb i Internet tehnologije
Filip Mari´c
10. januar 2016
Predgovor
Ovaj tekst predstavlja skriptu za predmet „Uvod u Veb i Internet tehnologije” na
Matematiˇckom fakultetu u Beogradu. Materijal je namenjen, pre svega studentima
koji sluˇsaju pomenuti kurs, ali svima drugima zainteresovanim za detaljnije i
sistematsko upoznavanje sa softverskim tehnologijama koji se koriste u okviru
Interneta i Veba.
Naravno, s obzirom da je Veb izrazito popularan, pregled svih relevantnih
tehnologija nije mogu´ce napraviti u okviru jednog udˇzbenika, tako da su odre
d
ene
odluke i izbori morale biti napravljene na samom poˇcetku. Prednost je data
slobodnom softveru tehnologijama otvorenog koˆda, tako da materijal uglavnom
pokriva tzv.
LAMP (Linux-Apache-MySQL-PHP)
platformu.
Materijal je izlagan pristupom „odozdo-naviˇze” (eng. bottom-up), te samim tim,
moˇzda nije najpogodniji za prvo upoznavanje sa materijalom. Sa druge strane,
smatra se da veliki broj studenata i potencijalnih ˇcitalaca ovog materijala ve´c
poseduje odre
d
ena elementarna znanja o raˇcunarskim (pa i o Veb) tehnologijama.
Kreiranje Veb stranica, kao proces donekle jednostavniji od programiranja, ˇcesto je
primamljiv i za amatere u raˇcunarstvu tako da je mogu´ce nai´ci na veliki broj
„instant” reˇsenja koji materiju prikazuju parcijalno i nesistematski. Za razliku od
ovakvih receptaˇskih materijala (eng. „cookbook”), u ovom materijalu se sve
tehnologije izlaˇzu, postupno, priliˇcno detaljno i pridrˇzavaju´ci u ˇsto ve´coj meri
relevantnih standarda, specifikacija i zvaniˇcnih preporuka. Autor je miˇsljenja da
odre
d
eni delovi materijala mogu da sluˇze i kao referentni priruˇcnik tokom realnog
rada. Naravno, zbog obima materijala, vrˇsena su odre
d
ena uproˇs´cavanja tako da su
neki delovi izostavljeni i mogu´ce ih je na´ci pre svega u zvaniˇcnim specifikacijama
odre
d
enih tehnologija.
Tokom izrade Veb stranica, u praksi se koriste i mnogi WYSIWYG alati (npr.
Macromedia Dreamveawer, Microsoft Front Page). Iako ovakvi alati mogu znaˇcajno
da ubrzaju rad, oni ne mogu da odmene detaljno poznavanje Veb tehnologija. Iz ovog
razloga, odluˇceno je da se oni ne pominju u okviru materijala, ve´c da se ˇcitaocima
prepusti samostalno upoznavanje sa njima, tek nakon ˇsto se izloˇzeni materijal
savlada.
Poˇsto se tehnologije, naroˇcito u oblasti informacionih tehnologija, izrazito brzo
menjaju, opasnost za svaki materijal koji prikazuje ove tehnologije je da veoma brzo
zastareva. Zbog toga izloˇzene podatke treba uzeti sa rezervom i imati na umu
trenutak nastajanja ovog materijala — 2010. godina.
Veliki problem prilikom pisanja materijala je postojanje razliˇcitih terminologija
koje se koriste u ovoj oblasti raˇcunarstva. Svesno, odabran je pristup koji izbegava
1
koriˇs´cenje anglicizama i ve´cina termina je koriˇs´cena u prevedenom obliku (iako je
autor svestan da u praksi anglicizmi, definitivno, dominiraju). Tako je npr. za engleski
termin
web browser
, umesto rogobatnog anglicizma brauzer (zaˇsto ne brauser ili
brovzer?) koriˇs´cen termin
pregledaˇc Veba
. Osnovna motivacija za ovaj pristup je
pokuˇsaj uklapanja terminologije u postoje´ci korpus jezika (poˇsto se, na primer,
lekovi kupuju u apoteci, knjige iznajmljuju u biblioteci, zaˇsto se podaci ne bi
skladiˇstili u datoteci nego u „fajlu”?). Engleski termini su uvek navedeni prilikom
prvog pojavljivanja termina, dok je u dodatak ukljuˇcen i terminoloˇski reˇcnik.
Na ovom mestu ´cu se rado zahvaliti svim studentima i ostalim ˇcitaocima koji mi
budu ukazali na greˇske i propuste u materijalu (kojih, svakako, ima).
U Beogradu,
Filip Mari´c
Februar, 2011.
3
menti. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
46
3.3 HTML/XHTML
. . . . . . . . . . . . . . . . . . . . . . . . . . .
49
3.3.1 Istorijat . . . . . . . . . . . . . . . . . . . . . . . . . . . .
49
3.3.2 Verzije jezika . . . . . . . . . . . . . . . . . . . . . . . . . 50
3.3.3 Skup karaktera i kodiranje karaktera . . . . . . . . . . . .
53
3.3.4 Osnovna struktura HTML dokumenata
. . . . . . . . . .
55
3.3.5 Tekst
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66
3.3.6 Liste . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
70
3.3.7 Veze . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
72
SADRZAJˇ
3.3.8 Objekti, slike, apleti . . . . . . . . . . . . . . . . . . . . . 76
3.3.9 Tabele . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
79
3.3.10 Formulari . . . . . . . . . . . . . . . . . . . . . . . . . . .
85
3.4 CSS - stilski listovi . . . . . . . . . . . . . . . . . . . . . . . . . .
85
3.4.1 Sintaksa CSS opisa . . . . . . . . . . . . . . . . . . . . . . 85
3.4.2 CSS selektori . . . . . . . . . . . . . . . . . . . . . . . . .
85
3.4.3 Neka CSS svojstva i njihove vrednosti . . . . . . . . . . .
87
3.4.4 CSS pozicioniranje . . . . . . . . . . . . . . . . . . . . . . 93
3.4.5 Umetanje CSS opisa u HTML dokumente . . . . . . . . .
95
3.5 MathML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
3.6 SVG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101
3.7 SMIL
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102
4 Klijentski skriptovi
104
4.1
Objektni model dokumenta - DOM . . . . . . . . . . . . . . . . . 105
4.1.1
Core DOM
. . . . . . . . . . . . . . . . . . . . . . . . . . 107
4.1.2
HTML DOM . . . . . . . . . . . . . . . . . . . . . . . . . 110
4.1.3
DOM pristup pregledaˇcu
. . . . . . . . . . . . . . . . . . 112
4.2
Javascript/ECMAScript . . . . . . . . . . . . . . . . . . . . . . . 115
4.2.1
Osnovne karakteristike jezika . . . . . . . . . . . . . . . . 115
4.2.2
JavaScript objekti
. . . . . . . . . . . . . . . . . . . . . . 121
4
4.3
Biblioteka JQuery
. . . . . . . . . . . . . . . . . . . . . . . . . . 125
5 Veb serveri - Apache
126
6 Serverski skriptovi - PHP
127
6.1
PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
Glava 1
Uvod u raˇcunarske mreˇze
U danaˇsnje vreme nezamislivo je koriˇs´cenje raˇcunara koji nisu na neki naˇcin
povezani sa drugim raˇcunarima. Izgradnja raˇcunarskih mreˇza i naroˇcito nastanak i
razvoj Interneta i njegovih servisa poput Veba dovele su do izrazito znaˇcajnog
proˇsirenja kruga korisnika raˇcunara i promene uloge raˇcunara u odnosu na ranije.
Moˇze se slobodno re´ci da je pojava savremenih raˇcunarskih mreˇza dovela do
revolucije sliˇcne onoj koju je pojava parne maˇsine izazvala u XVIII veku. Sve je ve´ci
broj razliˇcitih ure
d
aja koji postaju umreˇzeni i vremenom se pojavljuje sve viˇse vrsta
usluga koje nam nudi mreˇzno okruˇzenje.
1.1
Uloga raˇcunarskih mreˇza i naˇcin rada u mreˇzi
Moˇzemo re´ci da su osnovne uloge raˇcunarskih mreˇza:
Komunikacija - koriˇs´cenjem raˇcunara ljudi danas komuniciraju putem elektronske
poˇste, instant poruka, ´caskanja (eng. chat), video konferencija, itd.
Deljene informacija i podataka - u mreˇznom okruˇzenju, mogu´ce je pristupati
informacijama koje se nalaze na drugim raˇcunarima u okviru mreˇze. Mogu´c
je prenos podataka, najˇceˇs´ce u obliku preuzimanja razliˇcitih vrsta datoteka.
Prenos informacija je mogu´ce vrˇsiti i okviru lokalnih mreˇza, obiˇcno u okviru
jedne kompanije, kao i u okviru globalne svetske mreˇze. Internet i Veb se danas
smatraju glavnim izvorima informacija.
Deljene softvera - Korisnici povezani u mreˇzu mogu da koriste mnoge usluge koje im
pruˇza softver koji radi na raˇcunarima u okviru mreˇze. Na primer, putem Veba
je mogu´ce kupovati, rezervisati karte i sliˇcno. Tako
d
e, na primer, distribuiran i
paralelizovan sofver se moˇze izvrˇsavati na viˇse povezanih raˇcunara ˇcime se
mogu ubrzati zahtevna izraˇcunavanja.
Deljene hardverski resursa - u mreˇznom okruˇzenju, mogu´ce je zajedniˇcko koriˇs
´cenje hardvera (npr. ˇstampaˇca, skenera) od strane viˇse korisnika. Cesto se
pokazuje da je kompaniji jeftinije da instalira jedan kvalitetnijiˇ ure
d
aj, koji kroz
raˇcunarsku mreˇzu moˇze biti simultano koriˇs´cen od strane viˇse korisnika,
nego da svakog korisnika oprema zasebnim ure
d
ajima.
GLAVA 1. UVOD U RACUNARSKE MREˇ
ZEˇ
6
Obiˇcno je to
mreˇzna kartica (mreˇzni adapter) - NIC (eng. network interface card)
koja omogu´cava ure
d
aju fiziˇcki pristup mreˇzi. Svaku mreˇznu karticu karakteriˇse
jedinstvena
fiziˇcka (MAC) adresa
kojom se ure
d
aj jedinstveno identifikuje prilikom
komunikacije. Neke mreˇzne kartice obezbe
d
uju pristup ˇziˇcanim, a
Slika 1.1: Podela elektromagnetnog spektra
neke beˇziˇcnim komunikacionim kanalima. Osim mreˇznih kartica, za umreˇzavanje se
koriste
modemi
(telefonski, kablovski), kao i neki drugi sliˇcni ure
d
aji.
1.2.2
Komunikacioni kanali
Da bi se ure
d
aji unutar mreˇze povezali me
d
u sobom koriste se komunikacioni kanali
kao ˇsto su kablovi ili beˇziˇcni prenosni sistemi.
Osnovna mera kvaliteta komunikacionog kanala jeste brzina prenosa koja se meri
u broju bita koji se mogu preneti u jednoj sekundi (bit/s). Brzina prenosa se dakle meri
brojem elementarnih informacija koje mogu da proteku u sekundi. Uzimaju´ci u obzir
aktuelne tehnologije prenosa na raˇcunarskim mreˇzama, ˇceˇs´ce se koristi jedinica
Megabit (milion bita) u sekundi — Mbps, ili Gigabit (milijarda bita) u sekundi — Gbps.
Brzina prenosa je fiziˇcka karakteristika komunikacionog kanala i zavisi od
frekvencijskog opaega (eng. bandwidth) koji se moˇze propustiti kroz kanal bez
gubitka signala. Na slici 1.1 prikazan je raspon frekvencija koje se koriste pri razliˇcitim
prenosnim tehnologijama. S obzirom da je brzina prenosa podataka srazmerna
frekvencijskom opsegu, sa slike se jasno vidi zbog ˇcega optiˇcki kablovi daju najbolje
performanse.
Ziˇcane komunikacijeˇ
Parice (eng. twisted-pair wire) - Ovo je najkoriˇs´ceniji naˇcin komunikacije. Ure
d
aji se
povezuju koriˇs´cenjem uvijenih uparenih izolovanih bakarnih ˇzica, veoma
sliˇcno povezivanju obiˇcnih telefona(u telefonijskom ˇzargonu ove se ˇzice
