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
Terraformで構築する セルフサービス型データプラットフォーム / terraform-self-service-data-platform
pei0804
1
160
未経験者・初心者に贈る!40分でわかるAndroidアプリ開発の今と大事なポイント
operando
5
350
下手な強制、ダメ!絶対! 「ガードレール」を「檻」にさせない"ガバナンス"の取り方とは?
tsukaman
2
420
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.7k
20250903_1つのAWSアカウントに複数システムがある環境におけるアクセス制御をABACで実現.pdf
yhana
3
540
Codeful Serverless / 一人運用でもやり抜く力
_kensh
7
370
開発者を支える Internal Developer Portal のイマとコレカラ / To-day and To-morrow of Internal Developer Portals: Supporting Developers
aoto
PRO
1
440
Automating Web Accessibility Testing with AI Agents
maminami373
0
1.2k
Obsidian応用活用術
onikun94
1
460
サンドボックス技術でAI利活用を促進する
koh_naga
0
200
職種の壁を溶かして開発サイクルを高速に回す~情報透明性と職種越境から考えるAIフレンドリーな職種間連携~
daitasu
0
140
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
3
1.5k
Featured
See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
Automating Front-end Workflow
addyosmani
1370
200k
Balancing Empowerment & Direction
lara
3
620
The Power of CSS Pseudo Elements
geoffreycrofte
77
6k
Into the Great Unknown - MozCon
thekraken
40
2k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Why Our Code Smells
bkeepers
PRO
339
57k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Gamification - CAS2011
davidbonilla
81
5.4k
Site-Speed That Sticks
csswizardry
10
810
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.