Introducing – Cos'è AngularJS? – Soluzioni

View Github Repository Open presentation in a new window

dwightjack

See all presentation from dwightjack

Introducing – Cos'è AngularJS? – Soluzioni

0 0

angular-todolist-slides

Slides to introduce an AngularJS WorkShop

On Github dwightjack / angular-todolist-slides

Introducing

Marco Solazzi @dwightjack

About me

  • Senior Front-End Developer @ Intesys
  • Autore canale JavaScript @ HTML.it

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.”
  • 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

Yet another MV* Framework?!

Perché?

  • ☠ i test... questi sconosciuti
  • ☠ troppo codice boilerplate per configurare e inizializzare
  • ☠ string templating sucks (http://bit.ly/1oYjPmL)
  • ☠ le view imperative non hanno controllo su cosa è cambiato

Soluzioni

  • ✌ Test-first

  • ✌ MVVM, Data Binding e Dependency Injection

    • Models talk to Views talk to Models
    • Addio agli event listeners
    • Semplificazione contro sovra-ingegnerizzazione

  • ✌ 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

ma soprattutto...

✌ No need for magic

Extendable DOM(http://bit.ly/1cRPmPV)

Observe Objects (http://bit.ly/Ts1pRr)

Inheritance (http://bit.ly/1qHw2zP)

Welcome to the future!

The dark side

  • Model ridotto all'osso

  • Utility limitate

  • SEO ???

  • Crappy-code  prone

Learning curve?

Today demo

Stack

  • AngularJS
  • Bootstrap
  • jQuery
  • Grunt + Bower

Let's code!

git clone https://github.com/dwightjack/angular-todolist-fevr.git

cd angular-todolist-fevr

npm install

bower install

grunt