Slide 1
Slide 1 text
INTRODUCING
Marco Solazzi @dwightjack
Slide 2
Slide 2 text
ABOUT ME
Senior Front-End Developer @ Intesys
Autore canale JavaScript @ HTML.it
Slide 3
Slide 3 text
COS'È ANGULARJS?
“AngularJS is a structural framework for
dynamic web apps. It lets you use HTML as your
template language and lets you extend HTML's
syntax to express your application's components
clearly and succinctly.”
Slide 4
Slide 4 text
Sviluppato a partire dal 2009 by Miško Hevery and Adam
Abrons
Rilasciato da Google con licenza open-source nel 2010
Attualmente alla versione 1.2.18
Slide 5
Slide 5 text
YET ANOTHER MV*
FRAMEWORK?!
Slide 6
Slide 6 text
PERCHÉ?
☠ i test... questi sconosciuti
☠ troppo codice boilerplate per configurare e inizializzare
☠ string templating sucks
☠ le view imperative non hanno controllo su cosa è cambiato
(http://bit.ly/1oYjPmL)
Slide 7
Slide 7 text
SOLUZIONI
✌ TEST-FIRST
Unit test con +
E2E test con
✌ MVVM, DATA BINDING E DEPENDENCY INJECTION
Models talk to Views talk to Models
Addio agli event listeners
Semplificazione contro sovra-ingegnerizzazione
Karma Jasmine
Protractor
Slide 8
Slide 8 text
✌ TEMPLATING BASATO SUL DOM
Si aggiorna solo ciò che serve quando serve
✌ VIEW DICHIARATIVE
Estensione dell'HTML
Si utilizzano classi e attributi per definire nuove interazioni
Slide 9
Slide 9 text
ma soprattutto...
✌ NO NEED FOR MAGIC
Slide 10
Slide 10 text
EXTENDABLE DOM
(HTTP://BIT.LY/1CRPMPV)
OBSERVE OBJECTS
(HTTP://BIT.LY/TS1PRR)
INHERITANCE
(HTTP://BIT.LY/1QHW2ZP)
Slide 11
Slide 11 text
WELCOME TO THE
FUTURE!
Slide 12
Slide 12 text
THE DARK SIDE
MODEL RIDOTTO ALL'OSSO
UTILITY LIMITATE
SEO ???
CRAPPY-CODE PRONE
Slide 13
Slide 13 text
LEARNING CURVE?
Slide 14
Slide 14 text
TODAY DEMO
Slide 15
Slide 15 text
STACK
AngularJS
Bootstrap
jQuery
Grunt + Bower
Slide 16
Slide 16 text
LET'S CODE!
g
i
t c
l
o
n
e h
t
t
p
s
:
/
/
g
i
t
h
u
b
.
c
o
m
/
d
w
i
g
h
t
j
a
c
k
/
a
n
g
u
l
a
r
-
t
o
d
o
l
i
s
t
-
f
e
v
r
.
g
i
t
c
d a
n
g
u
l
a
r
-
t
o
d
o
l
i
s
t
-
f
e
v
r
n
p
m i
n
s
t
a
l
l
b
o
w
e
r i
n
s
t
a
l
l
g
r
u
n
t