Storybook
Front end UI development can become hugely complex if code
isn't managed well.
[2]
Key concept behind Storybook. It's a general approach to
both software development, and complex systems.
https://www.componentdriven.org/
Many companies use Storybook to give developers insight
into the UI system available for their platform.
https://storybook.js.org/showcase/lg-electronics-enact
Many companies use Storybook to give developers insight
into the UI system available for their platform.
https://storybook.js.org/showcase/lg-electronics-enact
[1]
There's a lot of dependencies but it's all managed well by the
scripts provided by Storybook. It doesn't take long to set up.
https://storybook.js.org/docs/react/contribute/code
The tool provides features that simulated accessibility. It
also has statistics about how many people would have the
accessibility requirement, e.g. 23% have blurred vision.
https://storybook.js.org/blog/accessibility-testing-with-storybook/
Component Story Format (CSF) is the recommended way to write stories.
The "Story" is the source of truth for a component.
A story is a code snippet that renders an example of a component in a specific state.
# Storybook CSF Tools
An experimental library to read, analyze, transform, and write CSF programmatically.
- Read - Parse a CSF file with Babel
- Analyze - Extract its metadata & stories based on the Babel AST
- Write - Write the AST back to a file
Storybook CSF Tools
Code sample showing a small function that does a lot more than
I'd have expected... a rabbit hole of a function.
https://storybook.js.org/blog/accessibility-testing-with-storybook/
Storybook is an example of how to build a project designed to work with many
different frameworks. I struggled to follow the structure of the project,
but I realised the complexity comes from taking the code written by the
creator of a generic "story" and making it work no matter the system used
to generate the associated component.
It reminds me somewhat of a game engine, a relatively simple application,
but built to to handle very complex data.
I wonder if anyone has created a Storybook using components from
React Three Fiber ...
One of the engineers at Chromatic
(main Storybook team) took a project from the makers of Three React Fiber,
and built out a storybook from it.
winkerVSbecks code