April digest
One of the main reasons for Storybook’s popularity is the community ecosystem. There are thousands of UI developers releasing addons, guides, and tutorials. This digest shares the community’s most helpful resources.
Mock pages in Storybook
The growing trend is to build connected components and even pages in Storybook. Gone are the days of spinning up the database and back-end just to work on UI. Instead, teams use addons to mock API requests: MirageJS, Mock Service Worker, Axios, Apollo and urql.
All things testing
- How to actually test UIs —We researched ten teams to find a testing strategy that works (featuring Twilio, Adobe, Peloton, Shopify and more).
- Discover how the Kenshoo team tests 400 React components without breaking a sweat! 😅
- Learn how to use stories with Testing Library
CSS & styling addons
Debugging CSS layouts is a pain! It’s impossible to eyeball alignment. Here’s a couple of addons that help:
- Column Guides to visualize your CSS Grid
- Outline makes it easy to verify positioning and placement
Storybook works with your favourite tools
There is a guide for all your favorite tools:
- Frameworks: Rails, Web components, Svelte
- CSS libraries: Tailwind CSS, Ionic (Vue)
- Languages: TSDX
Other handy tools
- XState Inspector brings statecharts right into Storybook.
- Addon Preview Code to load up and display code files
- Studybook a nifty way to turn Storybook into a learning aid. With lots of confetti! 🎉
❤️ Varun, DX @ Storybook
