EmberConf2018: Toyota's Shared Component Library

Slides for my talk at EmberConf 2018 on the Ember addon we created at Toyota Connected

Link: https://youtu.be/bt9MRkf5Mus?t=6h43m56s

Transcript

1. Tony Ward Pg. 001 Toyota’s Shared Component Library
2. • Creating solutions for the auto industry using data driven innovations • Car and ride sharing • Chose Ember • Need for an addon for quick development Toyota Connected Tony Ward Pg. 002
3. • Produce vehicles efficiently, while maintaining quality • Eliminate: • Muda: Waste • Mura: Inconsistencies • Muri: Excessive demands • Can apply to software too! Tony Ward Pg. 003 Toyota Production System
4. • Ember addon • Common web components, template helpers, Sass functions, and Sass mixins • Designers created same components as Symbols in Sketch • Design and Dev pull from the same toolbox Tony Ward Pg. 004 Loom
5. Tony Ward Pg. 005 {{#form-item flow='column' label='Email'}} {{!-- input —}} {{/form-item}}
6. {{input-toggle action=(action ‘toggle') isChecked=keepLoggedIn disabled=task.isRunning}} Tony Ward Pg. 006
7. {{button-async theme='primary' default='Sign In' pending='Signing In...' width='full' action=(perform submitTask)}} Tony Ward Pg. 007
8. • Well tested components • Shared language/tools between design and development • Shared translations • Scalable • Efficiency, Consistency, Quality • Eliminate muda, mura, and muri Tony Ward Pg. 008 Advantages
9. Tony Ward Pg. 009 Thanks EmberConf! YnotDraw @_ynotdraw YnotDraw