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
290
Data Loading Patterns in Ember
balint
1
190
Auth* in Ember apps with Torii
balint
1
290
Complex Component Design in Ember
balint
0
380
Don't call me back - How Ember uses promises and how you can, too
balint
5
10k
Acceptance testing in Ember.js
balint
1
520
Unit testing in Ember.js
balint
0
76
Introduction to ember-data
balint
0
160
Other Decks in Technology
See All in Technology
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
6.4k
「規約、知識、オペレーション」から考える中規模以上の開発組織のCursorルールの 考え方・育て方 / Cursor Rules for Coding Styles, Domain Knowledges and Operations
yuitosato
6
1.6k
Kotlinで学ぶ 代数的データ型
ysknsid25
5
1.1k
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
7.3k
原則から考える保守しやすいComposable関数設計
moriatsushi
2
330
New Cache Hierarchy for Container Images and OCI Artifacts in Kubernetes Clusters using Containerd / KubeCon + CloudNativeCon Japan
pfn
PRO
0
150
In Praise of "Normal" Engineers (LDX3)
charity
2
850
菸酒生在 LINE Taiwan 的後端雙刀流
line_developers_tw
PRO
0
140
(非公式) AWS Summit Japan と 海浜幕張 の歩き方 2025年版
coosuke
PRO
1
230
JSX - 歴史を振り返り、⾯⽩がって、エモくなろう
pal4de
2
210
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
Nonaka Sensei
kawaguti
PRO
3
650
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
81
9k
Facilitating Awesome Meetings
lara
54
6.4k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
43
2.4k
Designing for humans not robots
tammielis
253
25k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
107
19k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Rails Girls Zürich Keynote
gr2m
94
14k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
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.