Need to learn about Storybook controls in a hurry?
Storybook controls make your documentation come to life with auto-generated, interactive UI for component props! This video is your crash course into Storybook controls.
Visit our comprehensive Controls documentation to learn more: storybook.js.org/docs/react/e...
▬ How to connect component props with Storybook Controls ▬▬▬▬▬▬▬▬▬▬
00:00 Intro
00:30 What are Storybook controls?
01:31 Create a new component story with controls
02:13 Write stories that take args
02:37 Apply args to component stories
03:18 Storybook infers control types
03:33 Args only apply to a single story
04:04 Add type annotations to get default controls for all stories
05:36 Beware, inferred types aren't always what you want…
06:29 Add argTypes to specify controls types for all stories in a file
07:35 Where do I learn more about Storyboook controls?
08:38 Outro
▬ Follow us! ▬▬▬▬▬▬▬▬▬▬
Discord: / discord
Twitter: / storybookjs
Instagram: / storybookjs
GitHub: github.com/storybookjs/storybook
Follow @chantastic on:
- twitter: / chantastic
- youtube: @chantastic
▬ Learn more ▬▬▬▬▬▬▬▬▬▬
- Storybook at learnstorybook.com/
- Storybook addons at storybook.js.org/addons
- Component driven UI development at www.componentdriven.org/
▬ Free Storybook hosting ▬▬▬▬▬▬▬▬▬▬
Chromatic is made by Storybook maintainers and sets up in just 2 minutes.
Claim free Storybook hosting at www.chromatic.com/
25 июн 2024
