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
Angular2
Search
Paulo Pires
May 28, 2015
Programming
0
220
Angular2
Talk apresentada no Google I/O Extended BH onde mostro minhas impressões sobre o Angular2
Paulo Pires
May 28, 2015
Tweet
Share
More Decks by Paulo Pires
See All by Paulo Pires
Introdução ao WebAssembly
paulohp
0
40
Introdução ao GraphQL
paulohp
0
44
GraphQL 101
paulohp
0
77
Side Effects: Uma Saga até o React
paulohp
0
81
MobX: State Management made easy
paulohp
0
84
Docker: The Rise of Containers
paulohp
0
88
We Work Remotely
paulohp
2
92
Node.js Codelab
paulohp
1
170
NodeBR, um ano memoravel!
paulohp
0
91
Other Decks in Programming
See All in Programming
Devinのメモリ活用の学びを自社サービスにどう組み込むか?
itarutomy
0
1.9k
コンテナでLambdaをデプロイするときに知っておきたかったこと
_takahash
0
170
これだけは知っておきたいクラス設計の基礎知識 version 2
masuda220
PRO
22
4.9k
Develop Faster With FrankenPHP
dunglas
2
3k
技術選定を未来に繋いで活用していく
sakito
3
100
国漢文混用体からHolloまで
minhee
1
130
フロントエンドテストの育て方
quramy
11
2.8k
gen_statem - OTP's Unsung Hero
whatyouhide
1
190
プログラミング教育のコスパの話
superkinoko
0
130
PHPのガベージコレクションを深掘りしよう
rinchoku
0
260
パスキーのすべて / 20250324 iddance Lesson.5
kuralab
0
140
AHC 044 混合整数計画ソルバー解法
kiri8128
0
320
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.7k
The Invisible Side of Design
smashingmag
299
50k
Making the Leap to Tech Lead
cromwellryan
133
9.2k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
17
1.1k
A better future with KSS
kneath
239
17k
RailsConf 2023
tenderlove
29
1k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
102
19k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
A Tale of Four Properties
chriscoyier
158
23k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
30k
Transcript
Angular 2 Minhas Impressões
@Component({selector: 'talk'}) @View({template: '<h1>Google I/O</h1>'}) // Component controller class TalkComponent
{ constructor() { this.name = 'Paulo Pires'; this.twitter = '@paulo_hp'; } }
None
None
Angular 1.x
Angular 1.4 Performance Melhorada Novo Router e i18n Suporte a
CommonJS Melhoria nas animações E muito mais...
Angular 1.4 (use este hoje!)
Angular 1.5 (pode ser o elo até o 2.0)
Angular 2
/angular/angular
TypeScript typescriptlang.org
Será que a checagem de tipo em tempo de execução
pode deixar a app mais lenta? pergunta
Eu devo usar o TypeScript para meu novo app em
Angular2? pergunta
es6rocks.com
webcomponents.org
Sem controllers
3 tipos de directives
@Component
@Viewport
@Decorator
Mas isso não quebra a separação de 'concerns' que o
Angular tanto prega? pergunta
Então vou ter que mudar tudo? Converter todos meus controllers
para directives? pergunta
O Angular2 é tipo o React.js, no fim das contas?
Vou ter que escrever HTML inline? pergunta
Sem Two-Way data-binding
Agora vou ter que manipular e construir formularios na unha?
pergunta
Fluxo de dados unidirecional... Posso usar Flux? pergunta
Então o Angular2 é o React implementado pela Google? pergunta
Novo Router
/angular/router
Começo meu novo projeto com o Router velho ou com
o novo? pergunta
Real Modules
Tchau $scope
@Component({ selector: 'sample-app', componentServices: [ NameList ] }) @Template({ url:
'./templates/sample-app.html', directives: [Foreach] }) class SampleApp { constructor() { this.names = NameList.get(); this.newName = ''; } addName(newname) { this.names.push(newname.value); newname.value = ''; } }
... <ul> <li *foreach="#name in names"></li> </ul> ...
Ultra Fast Change Detection
DI Melhorada
/angular/di.js
import {Inject} from 'di'; import {Electricity} from './electricity'; @Inject(Electricity) export
class Fridge { constructor(electricity) { this.electricity = electricity; } getEggs() { return '3 eggs'; } }
None
Não esta pronto para producão!
None
Experimente!
perguntas?
Obrigado!