# Storybook Cheatsheet

| | |
|-|-|
| Install Storybook | `npx storybook@latest init --type=next.js` |
| Setup Wizard | `http://localhost:6006/?path=/onboarding` |
| Install Atlassian addon |1.`yarn add @atlaskit/storybook-addon-design-system`</br>2.`yarn add @atlaskit/storybook-addon-design-system`|
| Start Storybook | `yarn storybook` |

`mkdir sb-atlaskit && cd sb-atlaskit && yarn init -y && yarn add next react react-dom && yarn add -D @storybook/next @atlaskit/storybook-addon-design-system@1.1.1 && npx sb init
`

yarn dlx storybook@latest init --type next.js;
yarn add -D @storybook/react @atlaskit/storybook-addon-design-system@1.1.1

yarn sb init; yarn add @atlaskit/storybook-addon-design-system

`npx create-next-app@latest .`

√ What is your project named? ... storybook-next.js
√ Would you like to use TypeScript? ... No / Yes
√ Would you like to use ESLint? ... No / Yes
√ Would you like to use Tailwind CSS? ... No / Yes
√ Would you like to use `src/` directory? ... No / Yes
√ Would you like to use App Router? (recommended) ... No / Yes
√ Would you like to customize the default import alias (@/*)? ... No / Yes

`npx sb init`

`yarn add @atlaskit/storybook-addon-design-system@1.1.1`