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
33
Introdução ao GraphQL
paulohp
0
40
GraphQL 101
paulohp
0
74
Side Effects: Uma Saga até o React
paulohp
0
79
MobX: State Management made easy
paulohp
0
80
Docker: The Rise of Containers
paulohp
0
85
We Work Remotely
paulohp
2
88
Angular2
paulohp
0
220
Node.js Codelab
paulohp
1
170
Other Decks in Programming
See All in Programming
Внедряем бюджетирование, или Как сделать хорошо?
lamodatech
0
950
PSR-15 はあなたのための ものではない? - phpcon2024
myamagishi
0
410
BEエンジニアがFEの業務をできるようになるまでにやったこと
yoshida_ryushin
0
200
PHPで作るWebSocketサーバー ~リアクティブなアプリケーションを知るために~ / WebSocket Server in PHP - To know reactive applications
seike460
PRO
2
770
shadcn/uiを使ってReactでの開発を加速させよう!
lef237
0
300
Androidアプリのモジュール分割における:x:commonを考える
okuzawats
1
280
20年もののレガシープロダクトに 0からPHPStanを入れるまで / phpcon2024
hirobe1999
0
1k
ゼロからの、レトロゲームエンジンの作り方
tokujiros
3
1.1k
快速入門可觀測性
blueswen
0
500
“あなた” の開発を支援する AI エージェント Bedrock Engineer / introducing-bedrock-engineer
gawa
4
260
Асинхронность неизбежна: как мы проектировали сервис уведомлений
lamodatech
0
1.4k
AppRouterを用いた大規模サービス開発におけるディレクトリ構成の変遷と問題点
eiganken
1
450
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
693
190k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
98
18k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
240
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
How to train your dragon (web standard)
notwaldorf
89
5.8k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
The Cult of Friendly URLs
andyhume
78
6.1k
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