Today we talk about tools to build beautiful Web UIs! đź’«
How often have you written custom components that are hard to test or visualize as they’re complex and have multiple states? Components such as graphs, lists, checkboxes, list items, can be really hard to develop in isolation.
Here Storybook comes to the rescue! Storybook lets you test and develop your UI components through all it’s possible states. Norbert De Langen is on stage to tell us more about how he got involved in this project, and how to improve your development flow with it!
Enjoy the show 👨‍🍳
Show Notes
- 00.17 Intro
- 01.03 Episode Start
- 01.39 Norbert’s Introduction
- 02.51 What is Storybook?
- 05.29 From top down to bottom up
- 08.27 Accidentally duplicating components
- 10.25 Who’s Storybook for?
- 12.23 Storybook for native platforms?
- 14.34 Storybook’s history
- 18.25 How Norbert became a maintainer of Storybook?
- 20.49 What is a Story?
- 22.07 The most requested feature
- 24.11 Can you use Storybook at runtime?
- 25.57 Building design systems with Storybook
- 29.30 UI Testing with Storybook
- 32.31 Connecting developers and designers
- 33.22 What is Chromatic?
- 35.33 The Play function
- 36.46 Who’s using Storybook?
- 39.26 Storybook supporters
- 40.57 Moving the ecosystem
- 45.12 Maintaining big projects
- 50.16 Elegant documentation
- 52.34 Further reading
- 54.09 Where people can find you online?
Resources
- storybookjs/storybook on Github
- Storybook Official Website
- Chromatic Official Website
- Mentioned Resources:
- Why Storybook
- What’s a Story
- Storybook on OpenCollective
- Storybook Discord server
- Developing, Documenting, and Testing your Vite app with Storybook - Ian VanSchooten - Video from ViteConf 2022
- @NorbertdeLangen on Twitter
- @ndelange on Github