Getting Started

• Setting Up Storybook
• Storybook Sandboxes
• How to Write a Story
• Adding Variants to a Story
• Adding Controls to a Story
• Adding Button Sizes
• Setting Default Arguments

Styling

• Importing Styles, Using Tailwind, and Using Themes
• Customizing Tailwind Colors
• Importing Fonts from Fontsource

Documenting Components

• Using Storybook with MDX
• Improving argTypes with Metadata
• Color Palette
• Icon Gallery
• Type Set
• Organizing Stories and Documentation

Component Styling Techniques

• Class Variance Authority
• Adding a Size Variant with CVA
• Supporting Dark Mode
• Forcing Dark Mode
• An Alternative Approach to Dark Mode
• Implementing a Callout Component

Testing and Interactions

• Play Functions
• Testing Components
• Setting Up a Test Runner
• Visual Tests
• Accessibility Testing

APIs, Context, and External Dependencies

• Using Decorators for Context
• Using Loaders to Fetch Data

Appendix

• Integration with Mock Service Worker
• Storybook in Figma
• Figma in Storybook