FOI Nastava - Osnove web tehnologija

Sadržaj se učitava...

FOI Nastava

apps

mdi-login

Osnove web tehnologija

Introduction to Web Technologies
2023/2024

5 ECTSa

Informacijski i poslovni sustavi 1.2 (IPS)

Katedra za teorijske i primijenjene osnove informacijskih znanosti

4. semestar

Osnovne informacijemdi-information-variant

Izvođači nastavemdi-account-group

Nastavni plan i programmdi-clipboard-text-outline

Model praćenjamdi-human-male-board

Ispitni rokovimdi-clipboard-check-outline

Rasporedmdi-calendar-clock

Konzultacijemdi-account-voice

Izvođenje kolegija

Studij	Studijski program	Semestar	Obavezan
Informacijski i poslovni sustavi 1.2 (IPS)		4	obavezan

Cilj kolegija

Cilj predmeta je upoznavanje studenata s elementima web tehnologija putem kojih se obavlja izrada i dizajn web stranica i web aplikacija. Predmetom se obrađuju elementi koji čine pojedinačne sastavne komponente cjelovitog rješenja web stranice i web aplikacije. Predmet prati moguće razine realizacije Web projekata tako da se studentima pruža uvid u različite tehnološke mogućnosti koje mogu primijeniti u konkretnim situacijama. Studenti tijekom praktičnog dijela predmeta rade vježbe kojima postepeno razvijaju pojedine gradive blokove kasnijih web stranica i aplikacija. Prezentacijom izabranih rješenja zadaća otvara se diskusija tijekom koje studenti mogu izraziti svoje mišljenje o dizajnu, dovršenosti i drugim dogovorenim kriterijima kvalitete, čime se potiče kritičko razmišljanje o tuđem i vlastitom rješenju

Preduvjeti

Informacijski i računalni sustavi (IPS 1.2)
Matematika 1 (IPS 1.2)
Programiranje 1 (IPS 1.2)
Baze podataka 1 (IPS 1.2)
Programiranje 2 (IPS 1.2)

Norma kolegija

Predavanja

30 sati

Vježbe u praktikumu

30 sati

Nastavnik	Uloga na kolegiju	Oblik nastave	Tjedana	Sati	Grupa
Kermek Dragutin	Nositelj	Predavanja	9	2	1
Novak Matija	Nositelj	Predavanja	6	2	1
Kaniški Matija	Suradnik	Vježbe u praktikumu	15	2	3
Maček Marija	Suradnik	Vježbe u praktikumu	15	2	3
Levak Iva	Vanjski suradnik	Vježbe u praktikumu	15	2	6
Mrkela Vladimir	Vanjski suradnik

Sadržaj predavanja

Uvod u Internet i Web kroz povijest i razvoj. (1+0 sat)
Odnos Internet - Web. Povijest Interneta i Weba. Trendovi razvoja Interneta i Weba.
Protokoli HTTP i HTTPS – princip rada protokola, struktura podataka zahtjeva i odgovora. (1+1 sat)
Principi prijenosa poruka mrežom između web poslužitelja i preglednika u tipičnoj web aplikaciji. Sintaksa HTTP protokola. Osobine GET i POST metoda. Zašto je potreban HTTPS protokol.
Arhitektura Web sustava, osnovni pojmovi – Web preglednik, Web poslužitelj, Web mjesto, Web stranica, Web aplikacija. (1+0 sat)
Opis osnovnih pojmova. Elementi web aplikacija (web poslužitelj i preglednik), njihove uloge i osnovne značajke njihovog konfiguriranja.
Definiranje statičkog sadržaja web stranice – jezici oznaka HTML, XML i XHTML, validacija HTML. (4+4 sati)
Povijest HTML jezika. Definiranje sintakse HTML jezika. Struktura HTML dokumenta. Osnovni oblici formatiranja. Ugrađivanje multimedijskih elemenata u dokument i veza između dokumenata. Meta definicije i određivanje skupa znakova.
Definiranje dizajna statičke Web stranice – jezik stilskih uputa CSS, validacija CSS, CSS okviri. (3+4 sati)
Opće smjernice dizajna web mjesta. Dizajn sučelja. Realizacija dizajna web mjesta. Smjernice za dizajn web stranice. Problemi formatiranja dokumenta uz čisti HTML Osnovni koncepti kaskadnog oblika (CSS) formatiranja dokumenta. Razine CSS-a. Smještaj kaskadnih uputa. Načini korištenja kaskadnih uputa. Jedinice u kaskadnim uputama. Područja primjene kaskadnih uputa. Pravila za određivanje prednosti u primjeni kaskadnih stilskih uputa..
Potrebni alati za razvoj, testiranje i isporuku Web stranica na Web poslužitelj. (1+0 sat)
Definicija autorskih alata prema W3C. Kriteriji za ocjenu autorskih i ostalih alata za web aplikacije. Potrebne osobine alata za isporuku web aplikacije na poslužitelj.
Realizacija korisničkog dijela dinamičke Web stranice – programski jezik JavaScript, DOM, JSON, dijalekti programskog jezika JavaScript, JavaScript knjižnice. (8+9 sati)
Razlika između statičkih i dinamičkih osobina web stranice te pasivnih i aktivnih osobina web stranice. Jezici skriptiranja na strani korisnika i njihovo definiranje. Osobine JavaScript programskog jezika. Sintaksa i elementi JavaScript jezika. Hijerarhija ugrađenih objekata na strani korisnika/u pregledniku. Upravljanje događajima kroz pripadajuće rukovatelje događaja
Realizacija pozadinskog dijela dinamičke Web stranice – programski jezici (PHP, JavaScript, C#, JSP, Python, Ruby on Rails,...). Generiranje HTML sadržaja. Osnovne operacije s bazom podataka (dodavanje, ažuriranje, izdvajanje) u izabranom progra
Osobine izabranog programskog jezika. Sintaksa i elementi izabranog programskog jezika. Rukovanje s tipovima podataka. Preuzimanje podataka iz obrazaca. Obrada pogrešaka. Generički model rada s bazom podataka. Generiranje HTML
Osnove realizacije REST poziva – postavke za rad, pravila i preporuke za korištenje metoda i vrste podataka. Prihvat podataka iz zahtjeva i generiranje JSON i drugih vrsta sadržaja. (2+2 sata)
Osobine REST arhitekturnog stila. Uloga pojedinih metoda REST poziva. Postavke poslužitelja za rad s REST pozivima. Automatsko pretvaranje JSON podataka u objekt izabranog programskog jezika.
Sigurnosti Web sustava i mjerenje opterećenja. (2+2 sati)
Sigurnost web mjesta. Najznačajniji oblici napada i mjere obrane od napada (OWASP). Testiranje proboja web sustava pomoću odabranih alata (npr. Burp). Važnost analize opterećenja Web mjesta. Elementi plana opterećenja web mjesta. Analiza opterećenja Web poslužitelja pomoću specijaliziranih alata (JMeter, Webserver Stress Tool i sl). Skaliranje Web poslužitelja.

Sadržaj seminara/vježbi

Ishodi učenja kolegija

Odabrati odgovarajuće HTML oznake i elemente stilskih predložaka (CSS).
Opisati principe i smjernice za Web dizajn i responzivni dizajn.
Odabrati odgovarajuće multimedijske sadržaje i ugraditi ih u HTML dokument.
Analizirati različite tipove web sjedišta prema zadanim smjernicama za web dizajn.
Izraditi i objaviti web sjedište na temelju zadanog opisa i u skladu sa smjernicama za Web dizajn i responzivni dizajn.
Osmisliti arhitekturu web aplikacije uz odabir prikladnih tehnologija (web poslužitelj, programski jezici i okviri, spremište podataka i sl.) na temelju zadanog opisa.
Izgraditi interaktivnu web aplikaciju pomoću odabranih tehnologija.
Provesti testiranje opterećenja Web mjesta pomoću specijaliziranih alata na temelju osmišljenog plana.
Analizirati osobine programskih jezika i okvira za realizaciju korisničkog dijela (eng. front-end) i pozadinskog dijela web aplikacija (eng. back-end).
Izraditi prikaz osmišljene informacijske arhitekture web mjesta uz pomoć dijagrama (npr. navigacijskog).

Ishodi učenja programa

razumjeti stanje i trendove razvoja suvremenih informacijskih i komunikacijskih tehnologija (ICT), razumjeti njihov utjecaj na pojedinca, organizaciju i društvo te procijeniti njihovu primjenjivost u zadanom kontekstu
razumjeti i primijeniti ključne aspekte informacijske tehnologije (programiranje, algoritmi, strukture podataka, baze podataka i znanja
razumjeti bitne čimbenike koji utječu na poslovanje organizacije i pojedinaca te primijeniti osnovne metode i koncepte planiranja, upravljanja i obračuna poslovanja
razumjeti i primijeniti etička načela, zakonsku regulativu i norme koje se primjenjuju u struci
razumjeti osnovna načela i metode upravljanja organizacijom i uspješno raditi u timu

Osnovna literatura

Duckett, J. HTML & CSS: Design and Build Web Sites, John Wiley & Sons, 2011.
Duckett, J. JavaScript and JQuery: Interactive Front-End Web Development, John Wiley & Sons, 2014.
Patrick J. Lynch and Sarah Horton: Web Style Guide, 3rd Edition

Dopunska literatura

Learn to Code HTML and CSS: Develop and Style Websites, Howe, S., New Riders, 2014
RESTful Web APIs: Services for a Changing World, Richardson, L., Amundsen, M., & Ruby, S. (2013). O'Reilly, 2013
Practical Web Penetration Testing, Khawaja G., O'Reilly, 2018

Slični kolegiji

Redoviti studenti

Izvanredni studenti

izvanredni rok

Datum: 22.04.2026.

Vrijeme: 16:00

Opis: Na Fakultetu

U kalendaru ispod se nalaze konzultacije predmetnih nastavnika, no za detalje o konzultacijama možete provjeriti na profilu pojedinog predmetnog nastavnika.