JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac
-
Upload
hujak-hrvatska-udruga-java-korisnika-croatian-java-user-association -
Category
Technology
-
view
1.067 -
download
1
description
Transcript of JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac
![Page 1: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/1.jpg)
MEAN Stack MEAN Stack Kako i kada?
Nenad PećanacSerengeti
![Page 2: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/2.jpg)
Sadržaj
1) O MEAN-u
2) Mongo DB
3) Node.JS & Express
4) Angular4) Angular
5) Kada koristiti MEAN?
6) Kada ne koristiti MEAN?
7) Mean.IO & Mean JS
8) Reference
![Page 3: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/3.jpg)
1) O MEAN-u
![Page 4: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/4.jpg)
MEAN
MEAN je Full stack JS framework - potpuni razvojni
okvir za izradu modernih internetskih
stranica i aplikacija.
Sastoji se od 4 tehnologije:
Mongo DB, Express, Angular i Node.JS.Mongo DB, Express, Angular i Node.JS.
Naziv je 2013. godine smislio Valeri Karpov,
član razvojnog tima Mongo DB-a.
MEAN omogućava ubrzan razvoj JS aplikacija.
![Page 5: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/5.jpg)
MEAN
MEAN je pogodan za brzu izradu prototipova aplikacija.
JS se koristi na serverskoj i klijentskoj strani,
podaci u bazi zapisani su u JSON formatu.
Unaprijed konfigurirani projekti dostupni su
za preuzimanje na
MEAN.JS i MEAN.IO stranicama.
Yeoman – alat za generiranje predložaka
za razvoj internetskih aplikacija.
![Page 6: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/6.jpg)
2) Mongo DB
![Page 7: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/7.jpg)
Mongo DB
Mongo DB – najraširenija NoSQL baza podataka.
Podaci se zapisuju u binarnom JSON formatu – BSON.
BSON format je vrlo efikasan za spremanje i pretraživanje.
![Page 8: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/8.jpg)
Mongo DB
Svaki podatak u bazi zapisan je kao Dokument:
Dokumenti se spremaju u Kolekcije.
Kolekcije imaju funkciju kao tablice u relacijskim bazama.
Kolekcije omogućavaju fleksibilniji podatkovni model.
![Page 9: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/9.jpg)
Mongo DB
Kolekcije nemaju kolone kao tablice, ne definiraju
hijerarhijske odnose među podacima.
Podatkovni model moguće je realizirati ugrađivanjem
ili referenciranjem podataka.
Podatkovni modeli koji koriste ugrađivanjePodatkovni modeli koji koriste ugrađivanje
su denormalizirani, omogućavaju brže čitanje.
Podatkovni modeli koji koriste referenciranje
su normalizirani, koriste se za definiranje hijerarhije.
![Page 10: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/10.jpg)
Mongo DB
Ugrađivanje podataka:
![Page 11: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/11.jpg)
Mongo DB
Referenciranje podataka:
![Page 12: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/12.jpg)
Mongo DB
Nad kolekcijama se grade indeksi i vrše upiti:
![Page 13: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/13.jpg)
Mongo DB
Operacije za agregiranje/sortiranje koriste Map/Reduce
algoritme, čime se postižu visoke performanse.
Mongo DB ima ugrađenu podršku za klastering,
replikaciju, backup, monitoring i HA.
Mongo DB usluge dostupne su u cloudu:
Amazon, IBM, Red Heat, VMWare, MongoLab ...
NoSQL baza nije primjerena kod programskih rješenja
koja zahtjevaju strogu hijerarhiju i kontrolu
nad podacima.
U MEAN-u ju je po potrebi moguće zamijeniti sa MySQL-om.
![Page 14: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/14.jpg)
3) Node.JS & Express
![Page 15: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/15.jpg)
Node JS
Node.JS je platforma za izradu brzih i skalabilnih mrežnih
aplikacija, izgrađena na Chrome-ovom JS V8 runtime-u.
Node.JS je platforma za server-side JS.
Sadrži asinhrone biblioteke za upravljanje datotekama,
soketima, te za HTTP komunikaciju.soketima, te za HTTP komunikaciju.
Node.JS koristi efikasan, neblokirajući I/O model obrade podataka.
Prikladan je za brzu razmjenu velike količine podataka
i izradu aplikacija za rad u realnom vremenu,
distribuiranih na različitim uređajima.
![Page 16: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/16.jpg)
Node JS
Node.JS izgrađen je kao platforma, koja se sastoji od raznih
modula, koji implementiraju određene funkcionalnosti.
Npr. za obradu HTTP zahtjeva, potrebno je koristiti HTTP modul:
var http = require('http');
NPM je Node-ov upravljač modulima, koristi se izNPM je Node-ov upravljač modulima, koristi se iz
komandne linije.
Instaliranje novog modula:
npm install module_name
![Page 17: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/17.jpg)
Node JS
Primjer >Node.JS HTTP server; file: http.js:
var http = require("http");
http.createServer(function (request, response) {
request.on("end", function () {request.on("end", function () {
response.writeHead( 200, { 'Content-Type': 'text/plain' });
response.end('Hello HTTP!');
});
}).listen(8080);
Exec: node http.js
![Page 18: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/18.jpg)
Express
Express je minimalističan, brz i efikasan razvojni okvir za izradu
internet aplikacija na Node.JS-u.
Express podržava sve potrebne funkcionalnosti za izradu
single-page, multi-page ili hibridnih web aplikacija.
Također implementira dodatne funkcionalnosti za: Također implementira dodatne funkcionalnosti za:
- korištenje ostalih protokola pored HTTP-a,
- za autentifikaciju korisnika,
- upravljanje greškama,
- parsiranje POST zahtjeva
...
![Page 19: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/19.jpg)
Express
Primjer >Node.JS + Express HTTP server:
var express = require('express');
var app = express();
app.get('/helloworld', function(req, res){app.get('/helloworld', function(req, res){
res.send('Hello World');
});
var server = app.listen(3000, function() {
console.log('Listening on port %d', server.address().port);
});
![Page 20: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/20.jpg)
Node JS - performanse
Trajanje operacija na serveru:
![Page 21: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/21.jpg)
Node JS - performanse
Mrežne operacije traju višestruko duže od svih ostalih.
Razlog tome je čekanje na izvršavanje I/O operacija na serveru.
Node.JS obrađuje I/O operacije asinkrono, korištenjem
internog thread-poola ili asinkronih I/O API-ja OS-a.
![Page 22: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/22.jpg)
Node JS - performanse
Node.JS ima najbolje performanse kad obrada zahtjeva ne uključuje CPU intenzivne operacije.
![Page 23: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/23.jpg)
4) Angular
![Page 24: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/24.jpg)
Angular
JS MVC framework za izradu dinamičkih HTML predložaka.
Omogućava efikasan razvoj klijentskih aplikacija.
Angular koristi Ajax i JSON za komunikaciju sa Node-om.
![Page 25: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/25.jpg)
Angular
http://tutorialzine.com/2013/08/learn-angularjs-5-examples/
![Page 26: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/26.jpg)
Angular
<form ng-app ng-controller="OrderFormController">
<h1>Services</h1>
<ul><li ng-repeat="service in services"
ng-click="toggleActive(service)"
ng-class="{active:service.active}"> {{service.name}}
<span>{{service.price | currency}}</span>
</li></ul>
<div class="total">Total:
<span>{{total() | currency}}</span>
</div>
</form>
![Page 27: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/27.jpg)
5) Kada koristiti MEAN?
![Page 28: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/28.jpg)
Kada koristiti MEAN?
Prilikom izrade prototipova aplikacija.
Ukoliko se koristi u produkciji, potrebno je ukloniti
CPU-intenzivne operacije iz Event-Loopa
i veliku pažnju posvetiti obradi grešaka,
koja ukoliko je neispravno implementirana možekoja ukoliko je neispravno implementirana može
srušiti server.
Za izradu višekorisničkih, real-time aplikacija kao npr. CHAT.
Za izradu CRUD aplikacija, npr. BLOG.
Za izradu Data-streaming aplikacija.
Za izradu Proxy-a.
![Page 29: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/29.jpg)
6) Kada ne koristiti MEAN?
![Page 30: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/30.jpg)
Kada ne koristiti MEAN?
Za izradu enterprise aplikacija.
Kada su potrebne transakcijske servisne operacije.
Kada je potrebno obavljati CPU-intenzive operacije na serveru.
Kad se zahtjeva stroga relacijska hijerarhija nad modelom
podataka (može se, ali vjerojatno nije dobra ideja).podataka (može se, ali vjerojatno nije dobra ideja).
Node.JS je “mlada” tehnologija, trenutna verzija je 0.10.26.
Mnoga rješenja koje su u drugim tehnologijama već
implementirana tek treba implementirati na Node-u.
![Page 31: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/31.jpg)
7) MEAN.IO & MEAN.JS
![Page 32: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/32.jpg)
MEAN.IO
![Page 33: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/33.jpg)
MEAN.JS
![Page 34: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/34.jpg)
8) Reference
![Page 35: JavaCro'14 - MEAN Stack – How & When – Nenad Pećanac](https://reader033.fdocuments.net/reader033/viewer/2022050808/5478e8e4b4795990098b4622/html5/thumbnails/35.jpg)
Reference
MEAN.IO: http://www.mean.io/
MEAN.JS: http://meanjs.org/
MONGO DB: http://www.mongodb.org/
NODE JS: http://nodejs.org/NODE JS: http://nodejs.org/
EXPRESS: http://expressjs.com/
ANGULAR: https://angularjs.org/
YEOMAN.IO: http://yeoman.io/
SCOTCH.IO: http://scotch.io/