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
(Somewhat) Complex Component Design – Ember.BP,...
Search
Balint Erdi
February 11, 2016
Technology
1
91
(Somewhat) Complex Component Design – Ember.BP, 2015/02/11
Balint Erdi
February 11, 2016
Tweet
Share
More Decks by Balint Erdi
See All by Balint Erdi
Data Loading Patterns with JSON API
balint
5
1.4k
Why you should consider Ember.js for your next project
balint
4
300
Data Loading Patterns in Ember
balint
1
200
Auth* in Ember apps with Torii
balint
1
300
Complex Component Design in Ember
balint
0
380
Don't call me back - How Ember uses promises and how you can, too
balint
5
11k
Acceptance testing in Ember.js
balint
1
520
Unit testing in Ember.js
balint
0
80
Introduction to ember-data
balint
0
160
Other Decks in Technology
See All in Technology
歴代のWeb Speed Hackathonの出題から考えるデグレしないパフォーマンス改善
shuta13
6
580
ドキュメントはAIの味方!スタートアップのアジャイルを加速するADR
kawauso
3
120
生成AI活用のROI、どう測る? DMM.com 開発責任者から学ぶ「AI効果検証のノウハウ」 / ROI of AI
i35_267
4
150
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.5k
AIドリブンのソフトウェア開発 - うまいやり方とまずいやり方
okdt
PRO
9
510
datadog-distribution-of-opentelemetry-collector-intro
tetsuya28
0
240
Engineering Failure-Resilient Systems
infraplumber0
0
130
どこで動かすか、誰が動かすか 〜 kintoneのインフラ基盤刷新と運用体制のシフト 〜
ueokande
0
170
ウォンテッドリーのアラート設計と Datadog 移行での知見
donkomura
0
300
KiroでGameDay開催してみよう(準備編)
yuuuuuuu168
1
110
EKS Pod Identity における推移的な session tags
z63d
1
200
我々は雰囲気で仕事をしている / How can we do vibe coding as well
naospon
2
200
Featured
See All Featured
Navigating Team Friction
lara
188
15k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Bash Introduction
62gerente
614
210k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Why Our Code Smells
bkeepers
PRO
338
57k
A better future with KSS
kneath
239
17k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
GitHub's CSS Performance
jonrohan
1031
460k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Testing 201, or: Great Expectations
jmmastey
45
7.6k
A designer walks into a library…
pauljervisheath
207
24k
Transcript
Complex Component Design Ember.BP – 2015/02/11
Best of the month
None
None
Song of the month
http://frontside.io/blog/2016/01/22/functional-templating-in- ember.html
https://github.com/samselikoff/ember-cli-mirage
Survey results
(Somewhat) Complex Component Design
Basic component concepts
None
Non-block form (no hash)
Non-block form (no hash) Block form (with hash)
Non-block form (no hash) Block form (with hash) Yields parameters
to the block form (function call)
Non-block form (no hash) Block form (with hash) Yields parameters
to the block form (function call) Block params (function params)
Closure (vs. element) actions
Element actions (iact “string” actions)
None
None
None
Closure actions
None
Why closure actions? • They can return values • Enable
reacting to actions sent from the controller • Better debuggability • They can also bubble (check out ember-route- action-helper)
Component design guidelines
Short & sweet non-block form
Don’t assume too much
Allow customization
Data down, actions up (Use actions)
Data down, actions up (Use actions) Don’t do that.
Advanced concepts • Keep your component layers decoupled • Find
ways to prevent registering • Replace observers with (DOM) actions
Advanced concepts http://balinterdi.com/2015/09/10/complex-component-design- in-ember-intro.html
Thank you.