📕 storybook 사용하기

storybook 6.x 버전부터는 이전 버전과 디렉터리 구조 등의 차이가 있다

Reference

• https://storybook.js.org/docs/react/get-started/introduction
• https://www.componentdriven.org/
• https://storybook.js.org/tutorials/
• https://github.com/storybookjs/storybook/blob/master/app/react/README.md

스토리북 예제들

• https://next--storybookjs.netlify.app/official-storybook/?path=/story/addons-a11y-basebutton--default
• https://5ccbc373887ca40020446347-geedzbiswp.chromatic.com/?path=/story/avatarlist--basic
• https://workday.github.io/canvas-kit/
• https://airbnb.io/react-dates/?path=/story/daterangepicker-drp--default

리액트

• https://github.com/storybookjs/presets/tree/master/packages/preset-scss
• https://github.com/storybookjs/presets/tree/master/packages/preset-create-react-app

Reference

• Storybook을 다양한 Addon과 함께 활용해보면서 사용법 정복하기 (https://velog.io/@velopert/start-storybook)
• Storybook 입문 가이드 (https://hyunseob.github.io/2018/01/08/storybook-beginners-guide/)
• CRA로 만든 프로젝트에 Storybook 적용 / 유용한 팁 / 강의를 마치면서.. (https://velog.io/@velopert/storybook-tips-and-tutorial-conclusion)
• Storybook 소개 / 기본 사용법 (https://www.daleseo.com/storybook/)
• Storybook을 이용한 React Test 환경 구축하기 (https://medium.com/@benjaminwoojang/storybook%EC%9D%84-%EC%9D%B4%EC%9A%A9%ED%95%9C-react-test-%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95%ED%95%98%EA%B8%B0-65bbe6c453b5)