ZAŠTO JAVASCRIPT?ZAŠTO DANAS?

JS ZADOVOLJAVA POTREBE DANAŠNJEG INTERNETA

JS JE NASTAO U BROWSERU

KAKO FUNCKIONIRA WEB BROWSER?

URL

HTML

GET IMAGE

GET

JS

GET CSS

HTML STRANICA

HTML recept za izgradnju straniceCSS izgledJS dinamičnost

EVENT DRIVEN I ASINKRONOST

EVENT DRIVEN

• Jedan event loopa) Zaprimanje evenatab) Akcije/odgovor na evente

ŠTO ZNAČI SINKRONOST?

• Sinkrono = blokirajuće

SERVER Baza

ASINKRONOST

• Asinkron = ne blokirajući = brz SERVER BAZA

QUEUE

ZAŠTO SU OVE KARAKTERISTIKE BITNE U BROWSERU?

OSTALE KARAKTERISTIKE JS-A

VARIJABLE SU DINAMIČKE

var a = ‘neki string’;a = 3;var b = a + 5;a = [0, 2, 5];

TIPOVI VARIJABLI

• Number• String• Boolean• Null• Undefined• Object• Function

NUMBER

var a = 3;var b = 5;var sum = a + b;

console.log(sum);//8

STRING

var a = „Sum is ”;var b = „8”;var sum = a + b;

console.log(sum);//Sum is 8

NULL, UNDEFINED

var a = null;var b;

console.log(a);//nullconsole.log(b);//undefinedconsole.log(c);//undefined

OBJEKT

• Key – value

var school = {name : „V.gimnazija”, numberOfStudents : 3000

};school.address = „Klaićeva”;console.log(school[‘address’] ) // „Klaićeva”

JS OBJEKT == JSON

FUNKCIJE

function isprobajMe(unos) {console.log(unos);

}isprobajMe(„lo12”);//lo12isprobajMe(234);//234console.log(isprobajMe.name);//isprobajMe

FUNKCIJE

var isprobajMe = function (unos) {

console.log(unos);}isprobajMe(„lo12”);//lo12isprobajMe(234);//234console.log(isprobajMe.name);//undefined

FUNKCIJE

function zbroji(a, b) {var suma = a + b;return suma;

}

var suma = zbroji(4,7);console.log(suma);//11

FUNKCIJE

function ispisi(unos) {console.log(unos);

} function zbroji(a, b, funkcijaKaoArgument) {

var zbroj = a + b;funkcijaKaoArgument(zbroj);

} zbroji(2, 6, ispisi);//8

CALLBACK FUNKCIJE

function askDatabase(query, callback){..}function getActors(age, height, callback) { var query = {age: age, height: height}; askDatabase(query, callback); return „I don’t know yet”;} var result = getActors(45, 180, function (actors) {

console.log(actors); //Nadan, Ivo, ...});console.log(result);//I don’t know yet

FUNKCIJSKI JEZICI

• funkcije : • samostalne• anonimne• mogu se proslijediti kao parametar

FUNKCIJSKO VS OBJEKTNO PROGRAMIRANJE

• Objektno – kopiraju se objekti iz realnog svijeta Java, C#

• Funkcijsko – sustav se sastoji od servisa-matematičkih funkcija koje nemaju stanja Haskell

• Što odabrati OVISI O ZADATKU

DEMONSTRACIJA METEOR

http://asc-demo.meteor.com/http://bit.ly/18LrBHr

LEARN ONE – MASTER ALL

JS JE MOĆAN

• Zašto bi se koristio samo na frontendu?

NODEJS

NODEJS

• Asinkron brz• Event driven sva logika kao odgovor na

vanjske requestove• ima svoj „server”• demo u 30 sekundi

MONGODB

MONGODB

• JSON u bazi• nema tablica i oganičenja• nema JOINa• čisti JSON

MOBILNE APLIKACIJE

• 3 načina razvoja : • nativno (Android, iOS, WP)• frameworci (PhoneGap, Titanium, Xamarin)• hibridna aplikacija (nativni browser)

HIBRIDNE APLIKACIJE

HIBRIDNE APLIKACIJE

• JS, HTML, CSS• Cross platform

WEB SOCKETS

• Browser backend = Api request• Backend browser= web socket• Svi novi browseri

OPASNOSTI

PROBLEMI U KODU

• Nema standarda• Nema transakcija• Globalne varijable• Tipiziranje podataka• Teško je analizirati greške

PROBLEMI ODABIRANODEJSA / MONGODBA

• Uska specijalizacija• Silver bullet za sve probleme• PAŽLJIVO BIRATI TEHNOLOGIJE• Cijepaj sustav

ALTERNATIVE

• NodeJS GoLang, Grails, ...• MongoDB PostgreSQL, Redis, Neo4J

SAŽETAK

• JavaScript • dominantan jezik u browseru• razne metodologije -> zabavan• puno mogućnosti -> opasan• asinkron -> brz• sveprisutan -> cross platform

HVALA NA PAŽNJI!