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
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
10k
Acceptance testing in Ember.js
balint
1
520
Unit testing in Ember.js
balint
0
78
Introduction to ember-data
balint
0
160
Other Decks in Technology
See All in Technology
怖くない!はじめてのClaude Code
shinya337
0
400
開発生産性を組織全体の「生産性」へ! 部門間連携の壁を越える実践的ステップ
sudo5in5k
2
7.2k
使いたいMCPサーバーはWeb APIをラップして自分で作る #QiitaBash
bengo4com
0
2k
How Do I Contact HP Printer Support? [Full 2025 Guide for U.S. Businesses]
harrry1211
0
120
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
50
20k
united airlines ™®️ USA Contact Numbers: Complete 2025 Support Guide
flyunitedhelp
1
340
Lakebaseを使ったAIエージェントを実装してみる
kameitomohiro
0
130
生成AI開発案件におけるClineの業務活用事例とTips
shinya337
0
260
Model Mondays S2E04: AI Developer Experiences
nitya
0
140
高速なプロダクト開発を実現、創業期から掲げるエンタープライズアーキテクチャ
kawauso
2
9.4k
Glacierだからってコストあきらめてない? / JAWS Meet Glacier Cost
taishin
1
160
Geminiとv0による高速プロトタイピング
shinya337
1
270
Featured
See All Featured
Making Projects Easy
brettharned
116
6.3k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
The Language of Interfaces
destraynor
158
25k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
The Cult of Friendly URLs
andyhume
79
6.5k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
950
For a Future-Friendly Web
brad_frost
179
9.8k
Visualization
eitanlees
146
16k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
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.