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
Ember ATX: Components
Search
timgthomas
May 29, 2015
Programming
0
82
Ember ATX: Components
An introduction to Ember's Components
timgthomas
May 29, 2015
Tweet
Share
More Decks by timgthomas
See All by timgthomas
Living Style Guides: Bringing Designers and Developers Together
timgthomas
0
200
Icons and the Web: Symbols of the Modern Age
timgthomas
0
160
Constructing Modern UIs with SVG
timgthomas
0
180
Browser Invasion: Desktop Apps and the Web
timgthomas
0
150
Mind the Gap: Bringing Designers and Developers Together
timgthomas
0
120
Zero to App Store: A Hybrid App’s Tale
timgthomas
1
140
Chocolate-Covered Vegetables: Tasty Workflows with Broccoli
timgthomas
0
120
Ember ATX: Ember.Evented
timgthomas
0
110
Chocolate-Covered Vegetables: Tasty Workflows with Broccoli
timgthomas
0
370
Other Decks in Programming
See All in Programming
Kiroの仕様駆動開発から見えてきたAIコーディングとの正しい付き合い方
clshinji
1
200
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
mipypf
0
1k
Trem on Rails - Prompt Engineering com Ruby
elainenaomi
1
100
2025 年のコーディングエージェントの現在地とエンジニアの仕事の変化について
azukiazusa1
16
7.1k
詳解!defer panic recover のしくみ / Understanding defer, panic, and recover
convto
0
210
複雑なドメインに挑む.pdf
yukisakai1225
5
940
RDoc meets YARD
okuramasafumi
4
160
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
160
為你自己學 Python - 冷知識篇
eddie
1
330
JSONataを使ってみよう Step Functionsが楽しくなる実践テクニック #devio2025
dafujii
0
250
AIを活用し、今後に備えるための技術知識 / Basic Knowledge to Utilize AI
kishida
19
4.5k
TDD 実践ミニトーク
contour_gara
1
280
Featured
See All Featured
Balancing Empowerment & Direction
lara
3
610
Git: the NoSQL Database
bkeepers
PRO
431
66k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
A better future with KSS
kneath
239
17k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Unsuck your backbone
ammeep
671
58k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
How STYLIGHT went responsive
nonsquared
100
5.8k
Transcript
Components
Tim G. Thomas @timgthomas timgthomas.com
Components
{{ember-atx}}
Controller + View (+ Template) Route-less
Why?
Using Components
{{ember-atx}}
/* ember-atx.hbs */ <h1>‚</h1> /* elsewhere... */ {{ember-atx}}
/* ember-atx.hbs */ <h1>‚</h1> /* In 1.13... */ <ember-atx>
export default Ember.Component.extend({ });
export default Ember.Component.extend({ didInsertElement() { // I'm a view! }
});
export default Ember.Component.extend({ didInsertElement() { this.$().fadeOut(); } });
export default Ember.Component.extend({ itemCount: function() { // No, wait...I'm a
Controller! }.property() });
export default Ember.Component.extend({ itemCount: function() { return this.get('items'); }.property('items') });
{{ember-atx items=model}}
export default Ember.Component.extend({ items: function() { return Ember.$ .getJSON('/dont/tell/anyone'); }.property()
});
<ember-atx foo={{action 'attend'}}> foo: 'bar', actions: { somethingHappened() { this.attrs.foo.call({});
} }
<ember-atx attend={{action 'attend'}}>
<p>{{yield}}</p> {{#ember-atx}} I'm a lumberjack and I'm okay... {{/ember-atx}}
{{component 'component-name'}}
guides.emberjs.com ember-components.com timgthomas.com Don't go here!
Thanks! @timgthomas