Zašto JavaScript? Zašto danas?

1. Zašto JavaScript?Zašto danas?

3. JS zadovoljava potrebe današnjeg Interneta

4. JS je nastao u browseru

5. Kako funckionira web browser? URL HTML GET CSS GET IMAGE GET JS

6. HTML stranica HTML recept za izgradnju stranice CSS izgled JS dinamičnost

7. Event driven i asinkronost

8. Event driven • Jedan event loop • Zaprimanje evenata • Akcije/odgovor na evente

9. Što znači sinkronost? • Sinkrono = blokirajuće SERVER Baza

10. Asinkronost • Asinkron = ne blokirajući = brz SERVER BAZA

11. Zašto su ove karakteristike bitne u browseru?

12. Ostale karakteristike JS-a

13. Varijable su dinamičke var a = ‘neki string’; a = 3; var b = a + 5; a = [0, 2, 5];

14. Tipovi varijabli • Number • String • Boolean • Null • Undefined • Object • Function

15. Number var a = 3; var b = 5; var sum = a + b; console.log(sum); //8

16. string var a = „Sum is ”; var b = „8”; var sum = a + b; console.log(sum); //Sum is 8

17. Null, undefined var a = null; var b; console.log(a); //null console.log(b); //undefined console.log(c); //undefined

18. Objekt • Key – value var school = { name : „V.gimnazija”, numberOfStudents : 3000 }; school.address = „Klaićeva”; console.log(school[‘address’] ) // „Klaićeva”

19. JS objekt == JSON

20. funkcije function isprobajMe(unos) { console.log(unos); } isprobajMe(„lo12”); //lo12 isprobajMe(234); //234 console.log(isprobajMe.name); //isprobajMe

21. funkcije var isprobajMe = function (unos) { console.log(unos); } isprobajMe(„lo12”); //lo12 isprobajMe(234); //234 console.log(isprobajMe.name); //undefined

22. funkcije function zbroji(a, b) { var suma = a + b; return suma; } var suma = zbroji(4,7); console.log(suma); //11

23. funkcije function ispisi(unos) { console.log(unos); } function zbroji(a, b, funkcijaKaoArgument) { var zbroj = a + b; funkcijaKaoArgument(zbroj); } zbroji(2, 6, ispisi); //8

24. 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

25. Funkcijski jezici • funkcije : • samostalne • anonimne • mogu se proslijediti kao parametar

26. 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

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

28. Learn one – master all

29. JS je moćan • Zašto bi se koristio samo na frontendu?

30. NodeJS

31. NodeJS • Asinkron brz • Event driven  sva logika kao odgovor na vanjske requestove • ima svoj „server” • demo u 30 sekundi

32. MONGODB

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

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

35. Hibridne aplikacije

36. Hibridne aplikacije • JS, HTML, CSS • Cross platform

37. Web sockets • Browser  backend = Api request • Backend  browser= web socket • Svi novi browseri

38. Opasnosti

39. Problemi u kodu • Nema standarda • Nema transakcija • Globalne varijable • Tipiziranje podataka • Teško je analizirati greške

40. Problemi odabiraNodeJSa / MongoDBa • Uska specijalizacija • Silver bullet za sve probleme • PAŽLJIVO BIRATI TEHNOLOGIJE • Cijepaj sustav

41. Alternative • NodeJS  GoLang, Grails, ... • MongoDB PostgreSQL, Redis, Neo4J

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

43. Hvala na pažnji!