Build your own Storybook in Astro, using CSF
🌱 This post is in the growth phase. It may still be useful as it grows up.
You don’t need Storybook to write stories.
When I started at Chromatic, I was using Storybook everyday to build a component library. Today, I mostly just build my website.
No shade on Storybook but I will never install Storybook to do [component driven development] here. And even if I wanted to, there isn’t an Astro integration.
But I reach for stories all the time.
What I want is stories, without the
Storybook is a full development environment.
This is how I think of stories, as a baseline.
- CSF (Meta, named exports, object syntax, play functions)
- page fragments for linking
- A formatted name from the named export name
- interface information
- a nested container inside
- A default template
- A sidebare
- How to parse an astro component file and render that using CSF?
- How to test test components using testing-library (vitest?)
flowchart LR id[“This ❤ Unicode”]