React 컴포넌트와 추상화

React 컴포넌트와 추상화

• 컴포넌트와 책임: 컴포넌트는 UI와 비즈니스 로직을 나누는 단위이며, 단일 책임 원칙에 따라 응집도를 높여야 합니다. 프론트엔드 컴포넌트는 이벤트, 스타일, DOM 구조를 고려하여 책임을 수행합니다.
• 범용적인 컴포넌트: 도메인에 종속되지 않고 재사용성을 높여야 합니다. 특정 도메인을 위한 분기 처리는 지양하고, 컴포넌트 합성을 통해 유연성을 확보할 수 있습니다. ListItem 컴포넌트 예시처럼 공통 속성을 활용하여 추상화합니다.
• 도메인과 컴포넌트: React 훅을 사용하여 비즈니스 로직을 추상화하고, 컴포넌트의 응집도를 높입니다. 상태 관리 라이브러리를 사용할 때는 데이터 간 의존성을 최소화해야 합니다. Redux 예시에서 데이터 구조를 통합하거나, 인터페이스를 만들어 관리하는 방법을 제시합니다.