angularjs

39

Upload: carlos-uscamayta

Post on 12-Apr-2017

37 views

Category:

Software


0 download

TRANSCRIPT

Page 1: AngularJS
Page 2: AngularJS

CARLOS USCAMAYTA

EN 45 MIN.

Page 3: AngularJS

Carlos UscamaytaScrum Team Member

INNOVISION

Page 4: AngularJS

Desarrollo Web sin SPA

VIEW1 VIEW2VIEW3 VIEW4

Page 5: AngularJS

SPA – Single Page Application

VIEW1

VIEW3VIEW4

VIEW2

Page 6: AngularJS

DOM Manipulation

History

Module Loading

Ajax/Promises

Desafío de SPAData Binding

Routing

Caching

Page 7: AngularJS

Y ahora quien podrá ayudarnos? OH!!

Page 8: AngularJS

YO!!!!!!

Page 9: AngularJS

TRANSCLUS

ION RESTRICTIONDIRECTIVE

SCOPE

ROUTE

CONTROLLER ?

Page 10: AngularJS
Page 11: AngularJS

Pero bueno empecemos…• Fase 0

• Directives, filters & data bindings

• Views, controllers & scope

• Modules, routes & factories

Page 12: AngularJS

PERO ANTES UN SABIO CONSEJO

Page 13: AngularJS

Fase 0EL INICIO

Page 14: AngularJS

Descargar

https://angularjs.org

Page 15: AngularJS

Como Instalar AngularJS y no morir en el intento

Page 16: AngularJS

DIRECTIVES, FILTERS AND DATA BINDINGS

Page 17: AngularJS

Directives & binding

Directives

Page 18: AngularJS

Iterando con la directiva ng-repeat

Page 20: AngularJS

Usando filters

Page 22: AngularJS

VIEWS, CONTROLLERS AND SCOPE

Page 23: AngularJS

Views

Page 24: AngularJS

Controller

Page 25: AngularJS

The ‘GLUE’

Scope

VIEW

CONTROLLER

Page 26: AngularJS

Creando un controller

Page 27: AngularJS

MODULES, ROUTES & FACTORIES

Page 28: AngularJS
Page 29: AngularJS

Modules & containers

Page 30: AngularJS

Creando un moduloQue es esto?

Nuestro módulo depende de otro módulo

Page 31: AngularJS

Creando un controller en un módulo

Definimos nuestro controller

Page 32: AngularJS

El rol de los routes

VIEW1 VIEW2

VIEW3VIEW4/view4

/view3

/view2

/view1

Page 33: AngularJS

Definiendo Routes

Page 34: AngularJS

Usando factories & services

Page 35: AngularJS

El rol de las factories

Page 36: AngularJS

AngularJS y otros Frameworks

Page 37: AngularJS

Demostración

https://github.com/cuscamayta/AngularJSDemo

Page 38: AngularJS

Conclusión

Page 39: AngularJS

GRACIAS!!!