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
92
(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
310
Data Loading Patterns in Ember
balint
1
210
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
83
Introduction to ember-data
balint
0
170
Other Decks in Technology
See All in Technology
ざっくり学ぶ 『エンジニアリングリーダー 技術組織を育てるリーダーシップと セルフマネジメント』 / 50 minute Engineering Leader
iwashi86
6
3k
組織全員で向き合うAI Readyなデータ利活用
gappy50
5
1.6k
20251024_TROCCO/COMETAアップデート紹介といくつかデモもやります!_#p_UG 東京:データ活用が進む組織の作り方
soysoysoyb
0
130
激動の時代を爆速リチーミングで乗り越えろ
sansantech
PRO
1
170
AI駆動で進める依存ライブラリ更新 ─ Vue プロジェクトの品質向上と開発スピード改善の実践録
sayn0
1
340
プロダクト開発と社内データ活用での、BI×AIの現在地 / Data_Findy
sansan_randd
1
620
webpack依存からの脱却!快適フロントエンド開発をViteで実現する #vuefes
bengo4com
4
3.7k
東京大学「Agile-X」のFPGA AIデザインハッカソンを制したソニーのAI最適化
sony
0
150
猫でもわかるAmazon Q Developer CLI 解体新書
kentapapa
1
140
データとAIで明らかになる、私たちの課題 ~Snowflake MCP,Salesforce MCPに触れて~ / Data and AI Insights
kaonavi
0
120
オブザーバビリティが育むシステム理解と好奇心
maruloop
3
1.6k
abema-trace-sampling-observability-cost-optimization
tetsuya28
0
360
Featured
See All Featured
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
A Modern Web Designer's Workflow
chriscoyier
697
190k
Balancing Empowerment & Direction
lara
5
700
Done Done
chrislema
185
16k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
4 Signs Your Business is Dying
shpigford
186
22k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
Docker and Python
trallard
46
3.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
Large-scale JavaScript Application Architecture
addyosmani
514
110k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.7k
Raft: Consensus for Rubyists
vanstee
140
7.2k
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.