storybook-simple-example

About

Just a simple Storybook example. This is me checking out Storybook. This is just a button, input and card with a few differing styles.

You can load up the mostly default React app and see a terrible looking button and input was added.

Loading up Storybook shows the same components, but isolated from the rest of the app.

There is a alert card component containing the other two components.

These are in Atomic design organziation.

Editing components/Atoms/Button/buttonStyle.css will change the button for the story and the button in App.js. This is true for all the components.

Required

• node installed
• yarn installed

Install requireds

Using homebrew to install node

brew install node

then

npm install --global yarn

Use

git clone

cd cd storybook-simple-example

yarn install

yarn start for react site on local

yarn run storybook to start storybook on local

Add Ons

There are some add ons installed this repo

https://storybook.js.org/addons/storybook-dark-mode toogle in storybook