역할 분리
버튼, 카드, 목록처럼 하나의 역할을 갖는 단위로 나눈다.
Component
React 컴포넌트 재사용 단위
화면을 큰 페이지로 보지 않고 역할이 분명한 작은 컴포넌트로 나누면 조합과 테스트가 쉬워진다.
컴포넌트 설계 기준
ui unit입력
props는 부모가 자식에게 전달하는 데이터와 동작의 계약이다.
렌더링
컴포넌트는 현재 입력과 상태를 바탕으로 화면 조각을 반환한다.
조합
작은 컴포넌트를 합쳐 페이지와 복잡한 UI를 만든다.
propscomponentrendercompose
컴포넌트를 잘 나누는 기준은 파일 수가 아니라, 변경 이유와 재사용 맥락이 자연스럽게 분리되는가이다.