il web orientato al futuro: express, angular e nodejs
DESCRIPTION
Vincenzo Ferrari @ MEAN Conference - 9 giugno 2014TRANSCRIPT
![Page 1: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/1.jpg)
MEAN
MongoDB, ExpressJS, AngularJS, NodeJS
![Page 2: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/2.jpg)
© Ibuildings 2013 - All rights reserved© Ibuildings 2013 - All rights reserved
Vincenzo (Wilk) Ferrari
▪ Fullstack Web Developer & Software Engineer
▪ Open Source supporter
▪ Javascript ninja
@__wilky__
https://github.com/wilk
![Page 3: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/3.jpg)
© Ibuildings 2013 - All rights reserved
NodeJS
![Page 4: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/4.jpg)
© Ibuildings 2013 - All rights reserved
Cosa è Node.JS
Node.JS è una piattaforma software utilizzata
per costruire applicazioni scalabili
particolarmente per il lato server-side
per gestire un elevato throughput
![Page 5: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/5.jpg)
© Ibuildings 2013 - All rights reserved
La storia di Node.JS
Node.JS è stato creato da Ryan Dahl
Il progetto ha avuto inizio nel 2009
Nasce dall’idea ottenuta osservando una progress-bar evoluta su Flickr (Il client non sa quanto manca)
Necessità di eventi in push
Preceduto da una serie di fallimenti in C, Lua e Haskell
Basato sul motore Javascript di Chrome chiamato V8
Il progetto si è spostato dalla semplice idea iniziale fino a diventare l’oggetto che è ora
![Page 6: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/6.jpg)
© Ibuildings 2013 - All rights reserved
I simili di Node.JS
Altri linguaggi offrono piattaforme simili a Node.JS
Tornado e Twisted in Python
libevent in C
Vert.X in Java, JavaScript, Groovy, Python and Ruby (Su JVM)
Akka in Scala
EventMachine in Ruby
e molti altri…
![Page 7: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/7.jpg)
© Ibuildings 2013 - All rights reserved
Perché dovrei scegliere Node.JS?
![Page 8: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/8.jpg)
© Ibuildings 2013 - All rights reserved
Perchè scegliere Node.JS?
Familiarità con il linguaggio, anche i programmatori di front end lo conoscono
Tempi di sviluppo ridotti, rispetto a tecnologie più tradizionali per svolgere operazioni realtime/asincrone
Framework leggero, costi di infrastruttura ridotti, necessità minore hardware a parità di prestazione
Gestione nativa dei JSON, non servono livelli hardware o software intermedi
carico di lavoro condiviso con il client, meno carico sul server, più utenti contemporanei con lo stesso hardware
![Page 9: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/9.jpg)
© Ibuildings 2013 - All rights reserved
Performance
I punti di forza che rendono Node.JS performante sono
I grandi del settore competono sui motori Javascript (Mozilla, Google, Apple, Microsoft, Opera)
V8 di Google è diventato estremamente performante
Modello non bloccante di Node.JS
Software leggero
Possibilità di gestire migliaia di connessioni contemporanee su una dotazione hardware nella media
![Page 10: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/10.jpg)
© Ibuildings 2013 - All rights reserved
Supporto - Società alle spalle
Lo sviluppo di Node.JS è sponsorizzato da Joyent
Il rischio di progetti giovani è la mancanza di supporto da parte di una corporate
La spinta societaria ne garantisce le fondamenta
Il progetto è attivo e supportato
![Page 11: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/11.jpg)
© Ibuildings 2013 - All rights reserved
Supporto - Community
La community è molto attiva
crescita costante
elevato numero di moduli
gruppi e canali di aiuto
Il progetto è attivo e supportato
![Page 12: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/12.jpg)
© Ibuildings 2013 - All rights reserved
Reperibilità di sviluppatori
Javascript è probabilmente il linguaggio più conosciuto
familiarità del linguaggio
praticamente tutti hanno avuto esperienze d’uso
è impossibile da evitare se si sviluppa per il web
c’è quindi un largo numero di sviluppatori che possano diventare sviluppatori Node.JS
![Page 13: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/13.jpg)
© Ibuildings 2013 - All rights reserved
Centralizzazione degli sforzi
Esiste un portale dedicato ai moduli sviluppati dalla community
facile reperibilità dei moduli
tracciamento delle versioni
tracciamento dei bug
meno ridondanze
codice controllato da più utenti
statistiche di uso
![Page 14: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/14.jpg)
© Ibuildings 2013 - All rights reserved
Per sintetizzare
I motivi che rendono forte Node.JS sono
Abbattimento dei costi dell’infrastruttura
Diminuzione dei tempi di sviluppo
Reperibilità di sviluppatori
Aumento delle performance
Supporto della community e corporate
Disponibilità di svariati moduli
![Page 15: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/15.jpg)
© Ibuildings 2013 - All rights reserved
Node.JS ok, ma per cosa?
![Page 16: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/16.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa usare Node.JS?
API per un applicazione
Supporto nativo di JSON
Implementazione leggera di REST
Modello I/O non bloccante
![Page 17: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/17.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa usare Node.JS?
Utilizzo di strumenti nativi / shell
possibilità di sfruttare software esistenti
non reinventare la ruota
rapida creazione di processi
gestione degli output come flussi (stream)
![Page 18: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/18.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa usare Node.JS?
Creare e gestire flussi di dati (stream)
distaccarsi dal modello request/response come eventi atomici
come per l’esempio dell’upload del file e della progress bar
![Page 19: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/19.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa usare Node.JS?
Applicazioni single page o con molte aree indipendenti e in tempo reale
ogni sezione, ogni blocco opera in modo indipendente
esempio applicazione browser di Gmail
tempi di risposta molto bassi
carico di lavoro condiviso con il client
![Page 20: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/20.jpg)
© Ibuildings 2013 - All rights reserved
Allora Node.JS è la soluzione a tutti i miei mali?
![Page 21: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/21.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa NON usare Node.JS?
Applicazioni di elaborazione intensiva di dati
calcoli pesanti
tempi di calcolo lunghi
si perde la caratteristica non bloccante
la parte di calcolo supera le operazioni di I/O
![Page 22: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/22.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa NON usare Node.JS?
Sostituzione generalista di applicazioni (CMS o altro)
Node.JS non va usato indistintamente
Non si può pensare di sostituire tutto il software già esistente
Ogni strumento va usato per il proprio scopo
Evitare la tendenza a reinventare la ruota
![Page 23: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/23.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa NON usare Node.JS?
Sostituzione di server per i file statici
Node.JS non vuole sostituire gli altri web server
![Page 24: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/24.jpg)
© Ibuildings 2013 - All rights reserved
Node.JS il loop di eventi
![Page 25: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/25.jpg)
© Ibuildings 2013 - All rights reserved
Node.JS il loop di eventi
Node.JS è un’applicazione single thread
Tutti gli eventi gestiti sono asincroni
Vengono eseguiti da un thread-pool interno
Le funzioni di callback gestiscono gli eventi
![Page 26: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/26.jpg)
© Ibuildings 2013 - All rights reserved
Node.JS il loop di eventi
Ad ogni evento Node.JS risponde associando una callback
L’operazione è veloce
Quando il risultato della callback è pronto viene restituito
Non è bloccante
![Page 27: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/27.jpg)
© Ibuildings 2013 - All rights reserved
Il core di Node.JS
![Page 28: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/28.jpg)
© Ibuildings 2013 - All rights reserved
CommonJS
Node.JS aderisce ad un progetto più ampio di specifiche per definire un ecosistema di API javascript tra loro compatibili
La raccolta è disponibile su http://www.commonjs.org/specs/
Molte sono ancora in fase di sviluppo e approvazione
Non tutte sono implementate in Node.JS
![Page 29: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/29.jpg)
© Ibuildings 2013 - All rights reserved
Chi usa Node.JS in produzione?
![Page 30: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/30.jpg)
© Ibuildings 2013 - All rights reserved
Chi usa Node.JS in produzione?
Nonostante la giovane età Node.JS è già utilizzato per grandi progetti
Linkedin - Motore dell’applicazione mobile
Ebay - Gateway in http http://ql.io
Paypal - Ha creato un Framework, base di tutte le loro applicazioni http://krakenjs.com
Myspace - http://expressjs.com/applications.html
E molti altri - https://github.com/joyent/node/wiki/Projects,-Applications,-and-Companies-Using-Node
![Page 31: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/31.jpg)
© Ibuildings 2013 - All rights reserved
ExpressJS
![Page 32: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/32.jpg)
© Ibuildings 2013 - All rights reserved
Express
Express è il framework più utilizzato per lo sviluppo di applicazioni Node.JS
si ispira a Sinatra (Ruby)
è diventato ormai di uso standard
si installa facilmente con NPM
![Page 33: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/33.jpg)
© Ibuildings 2013 - All rights reserved
Express Features
express è il framework più utilizzato per lo sviluppo di applicazioni Node.JS. Prevede le seguenti features:
Robust routing
HTTP helpers (redirection, caching, etc)
14+ supported template engines
Content negotiation
Focus on high performance
Executable for generating applications quickly
High test coverage
![Page 34: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/34.jpg)
© Ibuildings 2013 - All rights reserved
Express
Differenze tra middleware e framework
Nella terminologia Node.JS si usa middleware per definire un modulo (o insieme di moduli) che definisca delle funzioni senza avere un set di utilità specifiche
Il middleware dà le basi per un framework
Il framework implementa le funzioni di utilità e stabilisce delle linee guida per il proprio utilizzo
Vengono chiamate middleware anche le funzioni esposte dal middleware stesso (come abbreviazione di funzione di middleware)
Si appoggia su un middleware chiamato Connect
![Page 35: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/35.jpg)
© Ibuildings 2013 - All rights reserved
Express
Come creare un middleware:
// ./lib/myMiddleware.js
module.exports = function (req, res, next) {
// logic here
};
// ./app.js
var app = require('express')(),
myMiddleware = require('./lib(myMiddleware');
app.use(myMiddleware);
![Page 36: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/36.jpg)
© Ibuildings 2013 - All rights reserved
Express
Lista di middleware più comuni:
Logger
Compress
BasicAuth
JSON
BodyParser
CookieParser
Query
Ulteriori middleware: http://www.senchalabs.org/connect/
![Page 37: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/37.jpg)
© Ibuildings 2013 - All rights reserved
![Page 38: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/38.jpg)
© Ibuildings 2013 - All rights reserved
Cos'è AngularJS
Framework Javascript creato da Google per realizzare ricche e moderne applicazioni web
https://angularjs.org
Nato nel 2009
Creato con l'idea di evitare la manipolazione diretta del DOM
Multipattern (MVC, MVVM)
![Page 39: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/39.jpg)
© Ibuildings 2013 - All rights reserved
Filosofia
Angular estende il vocabolario HTML con elementi e attributi personalizzati per servire pagine web dinamiche attraverso il two-ways data-binding
Disaccoppiamento tra la manipolazione del DOM e la logica dell'applicazione
Facile testabilità del codice
Sviluppo parallelo del client e del server
Strutturare l'applicazione tramite servizi e direttive
![Page 40: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/40.jpg)
© Ibuildings 2013 - All rights reserved
Features
Model-View-View-Model
Template engine
Direttive
Servizi
Routing client-side
Dependency Injection
Validazione form avanzata
I18n e l10n
Filtri ed espressioni
![Page 41: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/41.jpg)
© Ibuildings 2013 - All rights reserved
Supporto
Angular permette due tipi di supporto
Community
![Page 42: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/42.jpg)
© Ibuildings 2013 - All rights reserved
Per cosa usare AngularJS?
Adatto per realizzare applicazioni web e mobile altamente customizzate:
Applicazioni web single-page
Applicazioni mobile
Necessità di personalizzazione
![Page 43: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/43.jpg)
© Ibuildings 2013 - All rights reserved
Cosa offre AngularJS?
Sviluppo in puro Javascript
Alta modularità
Automatizzazione
Facile integrazione con librerie di terze parti
Integrazione con diversi webframework (SailsJS, Ionic, Yeoman)
![Page 44: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/44.jpg)
© Ibuildings 2013 - All rights reserved
Pitfall
Sviluppo non tradizionale
Deve essere affiancato da un framework CSS
Inadeguato per certe tipologie di web app
![Page 45: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/45.jpg)
© Ibuildings 2013 - All rights reserved
Current State
Versione stabile 1.2.x
Compatibilità fino a IE8
108Kb minified
~1500 moduli (ngmodules.org & bower.io)
![Page 46: Il Web orientato al futuro: Express, Angular e nodeJS](https://reader038.vdocument.in/reader038/viewer/2022103113/554bcd56b4c9058f6c8b488c/html5/thumbnails/46.jpg)
Ibuildings ITALIAFinalmente le tue APP Web & Mobile diventano GRANDI
IbuildingsRappresentanza per l’ItaliaVia Santa Maria Valle, 320123 [email protected]