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
時間軸から考えるTerraformを使う理由と留意点
fufuhu
16
4.8k
print("Hello, World")
eddie
2
530
Navigating Dependency Injection with Metro
zacsweers
3
3.5k
ProxyによるWindow間RPC機構の構築
syumai
3
1.2k
個人軟體時代
ethanhuang13
0
330
スケールする組織の実現に向けた インナーソース育成術 - ISGT2025
teamlab
PRO
2
170
AI時代のUIはどこへ行く?
yusukebe
18
9.1k
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
130
AIを活用し、今後に備えるための技術知識 / Basic Knowledge to Utilize AI
kishida
22
5.9k
Tool Catalog Agent for Bedrock AgentCore Gateway
licux
7
2.5k
MCPとデザインシステムに立脚したデザインと実装の融合
yukukotani
4
1.5k
基礎から学ぶ大画面対応(Learning Large-Screen Support from the Ground Up)
tomoya0x00
0
4.3k
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
BBQ
matthewcrist
89
9.8k
Code Review Best Practice
trishagee
71
19k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
Statistics for Hackers
jakevdp
799
220k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Why Our Code Smells
bkeepers
PRO
339
57k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Designing for humans not robots
tammielis
253
25k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Optimizing for Happiness
mojombo
379
70k
Fireside Chat
paigeccino
39
3.6k
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