Slide 1

Slide 1 text

from to From Frontend to Backend

Slide 2

Slide 2 text

davide.zeffi[email protected]

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

Node.js® è un runtime Javascript costruito sul motore JavaScript V8 di Chrome. ! Node.js usa un modello I/O non bloccante e ad eventi, che lo rendono un framework leggero ed efficiente. ! L'ecosistema dei pacchetti di Node.js, npm, è il più grande ecosistema di librerie open source al mondo.

Slide 5

Slide 5 text

Paypal & node.js: performance L’applicazione node.js, rispetto a quella Java, ha:! ! • doppie richieste/secondo (un core per node.js vs. 5 core per il Java)! ! • 35% in meno in media di tempo di risposta (200ms più veloce) L’applicazione node.js rispetto a quella Java era:! ! • costruita velocemente quasi il doppio con meno persone! ! • scritto con il 33% di linee di codice in meno! ! • costituito dal 40% in meno di file

Slide 6

Slide 6 text

Librerie

Slide 7

Slide 7 text

Librerie node.js • Moduli nativi: https://nodejs.org/api/index.html • https://www.npmjs.com/ $ npm init! $ npm install [--save] [-g] nomeModulo! • /usr/local/lib/node_modules

Slide 8

Slide 8 text

$ npm init! ! package.json:! {! "name": "modulename",! "description": "Foo for bar",! "version": "0.0.1",! "repository": {! "type": "git",! "url": "git://github.com/mixu/modulename.git" },! "dependencies": {! "underscore": "1.1.x",! "foo": "git+ssh://[email protected]:mixu/foo.git#0.4.1",! "bar": "git+ssh://[email protected]:mixu/bar.git#master"! },! "private": true! } package.json

Slide 9

Slide 9 text

in depth…

Slide 10

Slide 10 text

In HTML:! ! ! In NODE.JS:! var http = require('http');! ! http.createServer(function (req, res) {! ! res.writeHead(200, {'Content-Type': 'text/plain'});! ! res.end('Hello World\n');! })! .listen(1337, '127.0.0.1'); Primo esempio: server Hello World

Slide 11

Slide 11 text

util.js:! ! var x = 5;! var addX = function(value) {! ! return value + x;! }! module.exports.x = x! module.exports.addX = addX;! ! app.js:! ! var util = require(‘./util’);! console.log(‘x =‘ + util.x);! console.log(’10 + x =‘ + util.addX(10)); Understanding require & exports 1

Slide 12

Slide 12 text

User.js:! function User(name, email) {! ! this.name = name;! ! this.email = email;! }! ! ! module.exports.User = User;! ! vs.! ! module.exports = User;! ! app.js:! var User = require(‘./User’);! ! ! var user = new User.User(…);! ! vs:! ! var user = new User(…); Understanding require & exports 2

Slide 13

Slide 13 text

User.js:! var Animal = require(./Animal);! class User {…} Understanding require & exports 3 Animal.js:! var User = require(./User);! class Animal {…} app.js:! var User = require(./User);! …

Slide 14

Slide 14 text

Classi

Slide 15

Slide 15 text

EC5:! function User(name, surname) {! ! this.name = name;! ! this.surname = surname;! }! User.prototype.getFullName = function() {! ! return this.name + ’ ’ + this.surname;! }! module.exports = User;! ! ! EC6:! class User {! ! constructor(name, surname) {! ! ! this.name = name;! ! ! this.surname = surname;! ! }! ! getFullName() {! ! ! return this.name + ’ ’ + this.surname;! ! }! }! module.exports = User; Classi

Slide 16

Slide 16 text

Modo Javascript:! ! ! function Animal(name) {! ! ! this.name = name;! ! };! ! Animal.prototype.move = function(meters) {! ! ! console.log(this.name+" moved "+meters+"m.");! ! };! ! ! function Snake() {! ! ! Animal.apply(this, Array.prototype.slice.call(arguments));! ! };! ! Snake.prototype = new Animal();! ! Snake.prototype.move = function() {! ! ! Animal.prototype.move.call(this, 5);! ! };! ! ! var sam = new Snake("Sammy the Python");! ! Con inerits in node.js:! ! ! var util = require('util');! ! util.inherits(Snake, Animal); Ereditarietà delle Classi

Slide 17

Slide 17 text

Programmazione asincrona

Slide 18

Slide 18 text

Programmazione sincrona vs asincrona var fs = require('fs');! ! // Lettura sincrona! var file = fs.readFileSync('/path/to/file', 'utf8');! console.log(file);! ! // Lettura asincrona! fs.readFile('/path/to/file', 'utf8', function(err, file) {! ! if (err) {! ! ! throw err;! ! }! ! console.log(file);! });

Slide 19

Slide 19 text

The event loop & the message queue • Non-blocking I/O! • One thread! • One call stack! • One thing a time

Slide 20

Slide 20 text

Callback Hell

Slide 21

Slide 21 text

La piramide della sventura

Slide 22

Slide 22 text

Una “promessa” rappresenta il risultato di una operazione asincrona.! Una promise è in uno di questi stati:! • pending: in attesa del compimento della funzione asincrona! • fulfilled: funzione asincrona terminata correttamente! • rejected: funzione asincrona terminata con errore! • settled: funzione asincrona terminata Soluzione: Promises (1)

Slide 23

Slide 23 text

Creazione promise:! ! function readFile(filename, enc) {! return new Promise(function (resolve, reject) {! fs.readFile(filename, enc, function (err, res) {! if (err) reject(err);! else resolve(res);! });! });! }! ! Utilizzo promise:! ! function readJSON(filename) {! return readFile(filename, 'utf8')! .then(function (res) {! return JSON.parse(res)! });! }! function readJSON(filename) {! return readFile(filename, 'utf8').then(JSON.parse);! } Soluzione: Promises (2)

Slide 24

Slide 24 text

funzioneAsincrona1()! .then(funzioneAsincrona2)! .then(funzioneAsincrona3)! .catch(function (err) {! ! console.log(err);! });! ! ! funzioneAsincrona1()! .then(function(data) {! ! …! ! return Promise.resolve();! },! function(err) {! ! console.log(err);! ! return Promise.resolve();! })! .then(…); Soluzione: Promises (3)

Slide 25

Slide 25 text

http://nodeframework.com/ Frameworks

Slide 26

Slide 26 text

var express = require('express');! var app = express();! ! app.use(express.static('public'));! ! app.get('/', function (req, res) {! ! console.log("Got a GET request for the homepage");! ! res.send('Hello World');! })! ! app.post('/', function (req, res) {! console.log("Got a POST request for the homepage");! res.send('Hello POST');! })! ! var server = app.listen(8081, function () {! ! var host = server.address().address;! ! var port = server.address().port;! ! console.log('Example app listening at http://%s:%s', host, port);! })

Slide 27

Slide 27 text

• Waterline ORM (object-relational mapping) per tutti i DB: MySql, Postgres, Mongo, ecc… • Modellazione dei dati tramite file JSON • Generazione automatica delle API REST • Supporto ai WebSockets (Socket.io) • Policy di sicurezza dichiarative e riusabili tramite funzioni middleware prima delle azioni “controller”

Slide 28

Slide 28 text

WebKit

Slide 29

Slide 29 text

NW.js const electron = require('electron');! const app = electron.app;! const BrowserWindow = electron.BrowserWindow;! electron.crashReporter.start();! ! var mainWindow = null;! app.on('window-all-closed', function() {! // On OS X it is common for applications and their menu bar! // to stay active until the user quits explicitly with Cmd + Q! if (process.platform != 'darwin') {! app.quit();! }! });! app.on('ready', function() {! mainWindow = new BrowserWindow({width: 800, height: 600});! mainWindow.loadURL('file://' + __dirname + '/index.html');! mainWindow.webContents.openDevTools();! mainWindow.on('closed', function() {! mainWindow = null;! });! });

Slide 30

Slide 30 text

Thanks!

Slide 31

Slide 31 text

Bonus

Slide 32

Slide 32 text

Web Workers