CDD
{
"object": "block",
"id": "b29c9945-650b-4fa3-ac80-fc1de71df4f6",
"parent": {
"type": "page_id",
"page_id": "390765fe-8b67-81b5-a65a-cb8349780cb9"
},
"created_time": "2026-07-01T14:59:00.000Z",
"last_edited_time": "2026-07-01T14:59:00.000Z",
"created_by": {
"object": "user",
"id": "2ecd872b-594c-81f7-92e3-000210a8d473"
},
"last_edited_by": {
"object": "user",
"id": "2ecd872b-594c-81f7-92e3-000210a8d473"
},
"has_children": false,
"in_trash": false,
"type": "heading_4",
"heading_4": {
"rich_text": [
{
"type": "text",
"text": {
"content": "컴포넌트 주도 개발 (Component Driven Development)",
"link": null
},
"annotations": {
"bold": false,
"italic": false,
"strikethrough": false,
"underline": false,
"code": false,
"color": "default"
},
"plain_text": "컴포넌트 주도 개발 (Component Driven Development)",
"href": null
}
],
"is_toggleable": false,
"color": "default"
},
"archived": false
}컴포넌트를 모듈 단위로 개발하여 사용자 인터페이스(UI) 구축에 도달하는 개발 및 설계 방법론입니다. 기본적인 컴포넌트 단위부터 시작하여 UI 뷰(view)를 구성하기 위해 점진적으로 결합(조립)해가는 상향적(bottom-up) 성향을 띕니다.
Storybook
Storybook은 React 컴포넌트를 위한 UI 개발 환경입니다. 이를 통해 UI 컴포넌트의 다양한 상태 시각화 또는 인터랙티브 스타일로 개발 할 수 있습니다. Storybook은 앱 외부에서 실행되므로, 앱 모듈 종속성에 대해 걱정하지 않고 UI 컴포넌트를 독립적인 환경에서 개발할 수 있습니다.
Storybook 사용법
따라해보기