$30 off During Our Annual Pro Sale. View Details »

AngularJS Frontenders VLC

AngularJS Frontenders VLC

Introducción a Angular JS para Frontenders Valencia con @jacarma.

Javier Casal Ruiz

May 09, 2013
Tweet

Other Decks in Programming

Transcript

  1. View Slide

  2. Quiénes somos?
    Javier Carrasco @jacarma
    Javier Casal @jcasalruiz

    View Slide

  3. Qué hacemos? Solvency II
    Nueva ley reguladora de fondos financieros:
    Protección del consumidor
    Control y supervisión de las aseguradoras
    Fondo A
    Fondo B
    Fondo C Fondo D
    50%
    50%
    100%

    View Slide

  4. Qué utilizamos?
    Frontend?

    View Slide

  5. Qué queremos?
    API REST y Framework Javascript
    Maduro
    Testable
    Tests, Mocks, etc
    Inyección de dependencias
    Modularidad
    Sin boilerplate

    View Slide

  6. Elegir framework
    Backbone Closure
    Ember YUI
    Knockout AngularJS
    ¿Y vosotros?

    View Slide

  7. Elegir framework
    Backbone Closure
    Sin bindings, verboso Poca documentación
    Ember YUI
    Poco maduro No es MVC
    Knockout AngularJS
    Sólo bindings

    View Slide

  8. Lo que dicen
    "No es una librería"
    "No es un framework"
    "Angular es a los documentos dinámicos lo que HTML a los
    documentos estáticos"
    "Angular es lo que hubiera sido HTML si hubiera sido
    diseñado para hacer aplicaciones web"

    View Slide

  9. Lo que pensamos
    "Is the Javascript framework that sucks less"

    View Slide

  10. Creador
    Mysko Hevery
    Agile Coach en Google
    Autor de:
    Testability Explorer
    JsTestDriver

    View Slide

  11. Madurez
    Angular Backbone Knockout
    Github 9,134 stars 1,760 forks 13,871 stars 2,632 forks 3,632 stars 549 forks
    StackOverflow 4,908 preguntas 8,506 preguntas 5,335 preguntas
    Antigüedad Octubre 2010 Octubre 2010 Julio 2010

    View Slide

  12. Principios
    No manipular el DOM directamente
    Todo bien separado
    Pensado para ser testeado
    Escribir menos código

    View Slide

  13. Qué ofrece?
    ● Separación "Model View Whatever"
    ● Data binding
    ● Deep linking
    ● Inyección de dependencias
    ● Plain javascript
    ● Preparado para REST
    ● Componentes reusables

    View Slide

  14. Demo

    View Slide

  15. Ecosistema
    Grunt
    Karma (testacular)
    Yeoman
    Angular UI
    Batarang http://blog.angularjs.org/2012/07/introducing-angularjs-batarang.html
    Screencasts http://www.egghead.io/

    View Slide

  16. Demo
    Intro con transparencias 15 min
    Data binding 5m
    Controllers 5m
    Aplicación con deep linking 5m
    Servicios: REST con deployd
    Directivas
    Karma
    Yeoman

    View Slide

  17. View Slide