21
AngularJS Superheroic Javascript MVW Framework

Maraton AngularJS

Embed Size (px)

Citation preview

Page 1: Maraton AngularJS

AngularJSSuperheroic Javascript MVW Framework

Page 2: Maraton AngularJS

Luis Felipe Natividad Alejos◇ Bachiller en Ingeniería de Software de

la Universidad Nacional Mayor de San Marcos.

◇ Frontend developer en Grupo El Comercio (Clicks & Bricks).

◇ Colaborador en Frontend Labs (frontendlabs.io)

◇ @feluis23

Page 3: Maraton AngularJS

AngularJS es un framework javascript del lado del frontend mantenido por Google, nace en el 2009, pero se hace popular a finales del 2012. Framework MVW(Model-View-Whatever), donde whatever nos indica “lo que nos sirva a cada uno”.

Hablemos de AngularJS

Page 4: Maraton AngularJS
Page 5: Maraton AngularJS

“AngularJS extiende el HTML de tal manera que podemos decir que le da súper poderes, permitiéndonos crear aplicaciones dinámicas, con mucha interacción del usuario y altamente escalables.

Page 6: Maraton AngularJS

Two-Way data binding

Page 7: Maraton AngularJS

Inyección de dependenciasEste principio es muy usado por AngularJS, y permite que se inyecten los objetos o dependencias en vez que el mismo módulo donde estamos trabajando sea quien lo cree. Esto permite tener un código desacoplado.

Page 8: Maraton AngularJS

$scopeScope es el ámbito donde interactúa algun modulo o componente definido por AngularJS

1

Page 9: Maraton AngularJS

Módulos(module)Los módulos son contenedores de diferentes partes de nuestra aplicación.

2

Page 10: Maraton AngularJS

Controladores(controller)Los controladores en AngularJS son objetos que permiten desarrollar la lógica de la aplicación, enlaza el $scope con la vista y permite tener un control total de los datos.

3

Page 11: Maraton AngularJS

Directivas(directive)Las directivas vienen a ser la forma en que extendemos nuestro html, permitiéndonos agregar una porción de código hasta una funcionalidad completa.

4● ng-app● ng-controller● ng-model● ng-view● ng-click

● ng-init● ng-repeat● ng-change● ng-hide● ng-show … entre otros

Page 12: Maraton AngularJS

Servicios(service) y Fábricas(factory)Los servicios y fábricas, son módulos que permiten agrupar una funcionalidad específica e inyectarlos donde queramos.5

Page 13: Maraton AngularJS

Filtros(filter)Los filtros son los encargados de transformar los datos para luego mostrarlos.6

Page 14: Maraton AngularJS

Consumir API Rest con ngResource

Page 15: Maraton AngularJS

Para tener en cuenta

◇ AngularJS es una solución completa, por lo cual no se puede comparar con Jquery.

◇ Es un framework que está diseñado para ser testeable fácilmente.

◇ Esta diseñado para desarrollar aplicaciones no páginas web.

Page 16: Maraton AngularJS

Vs. OtrosBackboneJSFramework javascript MVC, que permite trabajar aplicaciones pequeñas y medianas, ligero y de muy baja curva de aprendizaje.Jquery y Underscore

EmberJSFramework javascript MVC, permite desarrollar aplicaciones single page de manera ordenada y óptima.Jquery y Handelbars.

ReactJSEs un framework javascript que ha tomado mucha relevancia últimamente en la comunidad y permite interfaces de usuarios y no puede ser comparado con AngularJS.

Page 17: Maraton AngularJS

AngularJS es genial!!!Nos brinda un sin número de herramientas, como routing, inyección de dependencias, templates entre otros, que hacen de este framework muy completo.

Page 18: Maraton AngularJS

Ionic FrameworkThe beautiful, open source front-end SDK for developing hybrid mobile apps with HTML5.

Place your screenshot here

Page 19: Maraton AngularJS

Aplicaciones que usan AngularJS

Plunker

Page 20: Maraton AngularJS

Angular 2.0Angular 2.0 es un nuevo framework, ¿Cómo asi?, Pues es cierto.Igor Minar y Tobias Bosch, desarrolladores de google anunciaron en el pasado ngEurope.“El equipo estaba preparando AngularJS 2.0 y esta nueva versión sería incompatible hacia atrás y no habría una ruta de migración desde 1.x.”

Page 21: Maraton AngularJS

Thanks!Preguntas?Pueden ubicarme en:◇ @feluis23◇ [email protected]◇ http://frontendlabs.io