#angularjs

Vitor NogueiraDesenvolvedor Front-end - Jaws Digital

FATEC ItapetiningaSENAC Itapetininga

- Framework JavaScript para criação de Web Apps- Criado em 2010- Hoje é mantido pelo Google

O que é?

Two Way Data Binding

- É o processo que estabelece uma conexão entre a interface da aplicação e o lógica de negócio ¹

https://gist.github.com/diegoeis/1033b3f7a91cb8a337d8 [1]

Data Binding

- Vínculo entre dois componentes da sua aplicação- Ao alterar o valor de um componente, este valor é automaticamente alterado no outro

Two Way Data Binding

bit.ly/angularjs-1

bit.ly/angularjs-2

Module

- Local onde são “adicionadas” as diferentes partes do seu aplicativo: Controllers, Services, Filters, Directives

Module

bit.ly/angularjs-3

bit.ly/angularjs-4

Controller

- No Angular um controller é uma função JavaScript onde se manipula o escopo ($scope)

Controller

Não use um Controller para:- Manipular o DOM- Controlar entradas (ex.: validação de formulários)- Filtrar saídas

Controller

bit.ly/angularjs-2

Directives

- Estendem o codigo HTML, atribuindo funcionalidades aos componentes ¹- Diretivas são o lugar onde você irá manipular o DOM na sua aplicação ²

http://tableless.com.br/diretivas-angularjs-abas/ [1]

http://pedronauck.com/angularjs/sobre-diretivas-e-como-usar-

corretamente-plugins-jquery-com-angularjs [2]

Directives

- Permite a criação de componentes reutilizáveis

Directives

bit.ly/angularjs-5

Services

- Função ou objeto utilizado para compartilhar dados ou comportamentos entre controllers, filters, directives e outros serviços ¹

Services

http://lostechies.com/gabrielschenker/2014/02/26/angular-jspart-13-services [1]

- O Angular tem diferentes tipos de serviços ²

Services

http://pedronauck.com/angularjs/entendendo-os-tipos-de-servico-do-angularjs [2]

bit.ly/angularjs-4

Filters

- Usados para formatação dos dados exibidos para o usuário

Filters

bit.ly/angularjs-6

- Backbone JS- Ember JS- Knockout JS- Can JS

http://blog.codeschool.com/post/85819292538/angular-backbone-or-ember-which-is-

best-for-your

http://sporto.github.io/blog/2013/04/12/comparison-angular-backbone-can-ember/

Alternativas

https://github.com/angular/angular.js/wiki/Projects-using-AngularJS

https://builtwith.angularjs.org/

https://play.google.com/store/apps/details?id=com.clickbus.mobile

http://ionicframework.com/

Cases

- CRUD- Google Maps App

Exemplos

http://campus.codeschool.com/courses/shaping-up-with-angular-js/intro

http://www.angularcourse.com/#/

https://www.youtube.com/playlist?

list=PLgMNBa0XaIgcD9IGiqvAQxPrUEyW_i87I

https://www.facebook.com/groups/angularjsbrasil/

Referências e Materiais

github.com/vitornogueira

facebook.com/vitornogueiraa

twitter.com/vitornogueiraa