Storybook is the most popular UI component explorer! This is the website for https://storybook.js.org/.
Note: This is not the docs, those are located here.
Contributions welcome! If it’s something small like grammar or punctuation, open up a pull request. If it’s a bigger change or new feature, add an issue for discussion.
Workflow
- Feature idea or bugfix?
- Build new UI or tweak existing UI in Storybook first
- Integrate with Gatsby
- Ensure tests pass in Circle CI storybooks/frontpage
- Ensure site works and is QAed via Netlify previews
- Ensure no visual bugs in Chromatic storybooks/frontpage
- Pull request
The Storybook for Storybook contains every UI component. The UI is built following Component-Driven Development, a process that builds UIs from the “bottom up” starting with components and ending with screens. That means contributors should compose UIs in Storybook before integration with the Gatsby app.
- yarn install
- yarn build
- yarn run storybook
Gatsby is used for basic routing and static site generation.
- yarn start
This project uses these tools to make our job easier.
💫 Deploys by Netlify
Master and branches are automatically deployed by Netlify every commit.
🖼 Visual testing by Chromatic
All stories in the Storybook are automatically visual tested on desktop and mobile each commit. Ensure all baselines are ✅ accepted before merging.
🚦 Continuous integration by Circle CI
Every build a test suite runs. Ensure there are no errors before merging.