Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
O poderoso AngulasJS
Search
Paulo Pires
June 25, 2014
Programming
0
69
O poderoso AngulasJS
Talk apresentada no Google I/O Extended São Paulo
Paulo Pires
June 25, 2014
Tweet
Share
More Decks by Paulo Pires
See All by Paulo Pires
Introdução ao WebAssembly
paulohp
0
35
Introdução ao GraphQL
paulohp
0
41
GraphQL 101
paulohp
0
74
Side Effects: Uma Saga até o React
paulohp
0
79
MobX: State Management made easy
paulohp
0
81
Docker: The Rise of Containers
paulohp
0
85
We Work Remotely
paulohp
2
89
Angular2
paulohp
0
220
Node.js Codelab
paulohp
1
170
Other Decks in Programming
See All in Programming
GAEログのコスト削減
mot_techtalk
0
120
Amazon ECS とマイクロサービスから考えるシステム構成
hiyanger
2
580
WebDriver BiDiとは何なのか
yotahada3
1
150
Ruby on cygwin 2025-02
fd0
0
150
PHPカンファレンス名古屋2025 タスク分解の試行錯誤〜レビュー負荷を下げるために〜
soichi
1
480
CDK開発におけるコーディング規約の運用
yamanashi_ren01
2
180
CSS Linter による Baseline サポートの仕組み
ryo_manba
1
130
Kubernetes History Inspector(KHI)を触ってみた
bells17
0
230
GitHub Actions × RAGでコードレビューの検証の結果
sho_000
0
280
Open source software: how to live long and go far
gaelvaroquaux
0
650
2024年のWebフロントエンドのふりかえりと2025年
sakito
3
260
チームリードになって変わったこと
isaka1022
0
210
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
GitHub's CSS Performance
jonrohan
1030
460k
Making the Leap to Tech Lead
cromwellryan
133
9.1k
Music & Morning Musume
bryan
46
6.3k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
Adopting Sorbet at Scale
ufuk
74
9.2k
A Philosophy of Restraint
colly
203
16k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
Transcript
O poderoso AngularJS
Beto MUNIZ Paulo PIRES @obetomuniz @paulo_hp
None
None
***
Agenda O que é AngularJS? Conceitos Bootstrap e Runtime Mitos,
prós e contras The future is here Demo Time
io.minasdev.org
O que é AngularJS?
Extende o HTML
two-way data binding
Components Based
Alguns Conceitos
directives
**ngApp
**ngController
**ngModel
**ngRepeat
**ngClick
**ngSrc
Custom Directives
factories, services, providers
**$http
**$location
**$log
**$timeout
**$animate
filters
**filter
**number
**order
routing
**ngRoute
**$routeParams
**$routeProvider
**ngView
$scope
ngResources
ngCookies
***
Bootstrap & Runtime
Bootstrap
1. Navegador faz o parse do HTML para o DOM
2. Carrega o angular.js
3. Espera pelo evento DOMContentLoaded
4. O Angular 'procura' pela diretiva ng-app
5. O $injector é configurado de acordo com as dependências
6. E cria $compile e o $rootScope
7. O $compile compila o DOM dinâmico e linka com
o $scope
Runtime
1. Inicia-se com o contexto de execução do angular chamando
$scope.$apply(stimulusFn)
2. Executa a função stimulusFn
3. Entra no $digest Loop
4. Agenda a execução com $evalAsync
5. Confere a $watch list
6. E renderiza novamente o DOM
Mitos, prós e contras
Mitos
AngularJS não protege o seu sistema de desenvolvedores que escrevem
um péssimo código
AngularJS não substitui o jQuery, mas pode evitar o seu
uso em alguns casos
AngularJS não é o melhor, porém nunca me deixou na
mão
AngularJS não é mágico, tudo depende de você.
Prós
compreensivo
rico em funcionalidades
grande comunidade
Injeção de dependência no sangue.
Testable Friendly
by Google!
Contras (na nossa opinião)
Documentação mais ou menos
Performance
Templates Engessados
The future is here
Mobile first
Modularização do Framworks
Change Detection
Dependency Injection
Templating
Persistance
Routing
Logging
Annotations
Scaffolding
Reference App
Demo Time
Perguntas?
The END