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
98
(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
330
Data Loading Patterns in Ember
balint
1
230
Auth* in Ember apps with Torii
balint
1
310
Complex Component Design in Ember
balint
0
390
Don't call me back - How Ember uses promises and how you can, too
balint
5
11k
Acceptance testing in Ember.js
balint
1
530
Unit testing in Ember.js
balint
0
100
Introduction to ember-data
balint
0
170
Other Decks in Technology
See All in Technology
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
14k
バニラVisaギフトカードを棄てるのは結構大変
meow_noisy
0
160
オンプレとGoogle Cloudを安全に繋ぐための、セキュア通信の勘所
waiwai2111
3
610
【SLO】"多様な期待値" と向き合ってみた
z63d
2
200
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
4
22k
opsmethod第1回_アラート調査の自動化にむけて
yamatook
0
320
男(監査)はつらいよ - Policy as CodeからAIエージェントへ
ken5scal
3
550
Data Hubグループ 紹介資料
sansan33
PRO
0
2.8k
primeNumber DATA MANAGEMENT CAMP #2:
masatoshi0205
1
610
バクラクにおける Document Understanding の挑戦:書類の「読取」から「意思決定」へ / document-understanding-in-bakuraku-2026
yuya4
0
110
失敗できる意思決定とソフトウェアとの正しい歩き方_-_変化と向き合う選択肢/ Designing for Reversible Decisions
soudai
PRO
8
1.2k
What's new in Go 1.26?
ciarana
2
250
Featured
See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
420
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
660
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
63
53k
Technical Leadership for Architectural Decision Making
baasie
2
270
Design in an AI World
tapps
0
160
Ethics towards AI in product and experience design
skipperchong
2
210
Unsuck your backbone
ammeep
671
58k
AI: The stuff that nobody shows you
jnunemaker
PRO
3
330
My Coaching Mixtape
mlcsv
0
63
The browser strikes back
jonoalderson
0
740
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
1
1.3k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
2
65
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.