컴포넌트의 기준?
단일 책임 원칙 (Single Responsibility Principle)
각 컴포넌트는 하나의 명확한 역할 또는 책임을 가져야 합니다.
예를 들어, UI 렌더링과 데이터 로직은 서로 다른 역할을 하므로 각각 다른 컴포넌트로 분리하는 것이 좋습니다.
재사용성 (Reusability)
컴포넌트를 재사용 가능한 조각으로 나누어야 합니다.
특정 기능이나 디자인 패턴을 여러 곳에서 사용해야 할 때, 해당 컴포넌트로 추상화하여 재사용성을 높일 수 있습니다.
가독성과 유지 보수성
컴포넌트를 작고 간단하게 유지하여 코드의 가독성을 향상시켜야 합니다.
긴 컴포넌트는 이해하기 어렵고 버그를 찾기 어려울 수 있습니다.
컨테이너 컴포넌트와 프레젠테이션 컴포넌트 구분
컨테이너 컴포넌트
데이터를 가져오고 관리하는 역할을 하는 컴포넌트로, 주로 상태(state)를 가집니다.
&
프레젠테이션 컴포넌트
UI를 렌더링하고 사용자 인터페이스를 보여주는 역할을 하는 컴포넌트로, 주로 상태를 가지지 않습니다.
단계별로 분해하기
컴포넌트를 처음부터 너무 작게 분해하지 말고, 기능을 추가하면서 점진적으로 분해해 나가는 방식을 고려해 보세요.
컴포넌트의 독립성
컴포넌트 간의 의존성을 최소화하여, 하나의 컴포넌트를 수정할 때 다른 컴포넌트에 영향을 미치지 않도록 해야 합니다.
UI와 데이터 로직 분리
UI 컴포넌트와 데이터 로직을 분리하여, 각각의 역할을 명확하게 정의하고 관리하기 쉽게 만들어야 합니다.
페이지 레벨 컴포넌트
페이지마다 하나 이상의 페이지 레벨 컴포넌트를 사용하여, 각 페이지의 전체 구조와 동작을 관리할 수 있습니다.
프로젝트 구조 고려
프로젝트의 규모와 복잡성에 따라 컴포넌트 구조를 설계하고 조정해야 합니다.
