Stories

Source file extensions: .stories.(js|jsx|ts|tsx)

Stories are isolated instances of a component and they could have different variants.

Adding a story is easy and will be picked up automatically by Backlight.dev. Adding a very simple index.stories.js file containing just

export const story1 = () => "<button>Hello</button>";

Will automatically result in that story being rendered in the preview tab:

Of course, how you write this story will depend on your framework and needs. Read on for more information.

Storybook compatible

Backlight.dev supports Storybook's CSF stories.

In stories/ folder

We recommend having the stories in the stories/ folder alongside all files required exclusively by the stories.