1. 컴포넌트 단위로 개발

Component-Driven Development(CDD)

레고처럼 조립해 나갈 수 있는 부품 단위로 UI 컴포넌트로 만들어 나가는 개발

Storybook

Storybook : Component-Driven Development(CDD)를 지원하는 Component Explorer(컴포넌트 탐색기)중 하나 ,

각각의 컴포넌트들을 따로 볼 수 있게 구성해주어 한 번에 하나의 컴포넌트에서 작업할 수 있음,

재사용성을 확대하기 위해 컴포넌트를 문서화하고, 자동으로 컴포넌트를 시각화하여 시뮬레이션을 할 수 있는 다양한 테스트 상태를 확인할 수 있음, 버그를 사전에 방지할 수 있도록 도와주고 테스트 및 개발 속도를 향상 시킴, 애플리케이션 또한 의존성을 걱정하지 않고 빌드할 수 있음

Storybook 주요기능

• UI 컴포넌트들을 카탈로그화
• 컴포넌트 변화를 Stories로 저장
• 핫 모듈 재 로딩과 같은 개발 툴 경험을 제공
• 리액트를 포함한 다양한 뷰 레이어 지원

Storybook 설치 및 세팅 방법

npx degit chromaui/intro-storybook-react-template taskbox
// Clone the template

cd taskbox

yarn 
// Install dependencies