Thinking in Stories: Component-First
summary
Generates a fresh Ember app and builds precisely one component—a Tailwind UI contact card—then wires a CSF story into Storybook so stories double as test fixtures. Implements red-green testing by rendering stories in unit tests via the render story helper, passes accessibility checks with the Storybook a11y addon, and removes boilerplate step by step. Everything is live coded and proven: the story renders, tests go from failing to passing, and the component is styled and interactive in Storybook.
AI-written summary · about
chapters (12)
- 0:00Start
- 1:22Thinking Component First
- 3:29What Is a Story
- 4:35Default Exports
- 6:01Storybook Adapter
- 8:01Edit the Markdown
- 9:33Tailwind Css
- 10:05Tailwind Ui
- 10:25Contact Card
- 18:20Valid Alt Text
- 25:52Live Debugging
- 36:08Manual Copy
related talks
30mUsing Storybook to Maintain Components and RedwoodJS
23mScale your UI documentation with Storybook
24mReact-Storybook"Design, Develop, Document and Debug your React UI components"
15mOnce Upon a Time Storybook
14mBuilding a component library with React, Vue, Angular or WebComponents
03mDocument your components with Storybook for Vue
18mStorybook and Testing
23mComponent Driven ClojureScript with Storybook