디자인 패턴
FSD(Feature-Sliced Design) 패턴
써치킴
2024. 10. 7. 14:54
FSD(Feature-Sliced Design)
애플리케이션을 Feature(기능) 단위로 조직화하여 관리하는 방법을 말하며 layer, slice, segment의 총 3depth로 이루어져 있다.
Layers
7가지의 폴더로 구성하면 되고, 각 폴더마다 서로의 역할이 있어서 폴더별로 구분해서 관리해야 한다
(app, pages, widgets, features, entities, shared)
- app: 애플리케이션 로직 초기화 및 글로벌 설정(정의), 애플리케이션의 진입점 역할
- processes: 복잡한 비즈니스 프로세스 관리 (선택적)
- pages: 라우팅 가능한 화면 정의
- widgets: 재사용 가능한 UI 블록, 독립적
- features: 사용자 시나리오와 비즈니스 기능을 다룸, 선택적 레이어
- entities: 도메인 객체와 관련 로직
- shared: 공유 유틸리티 및 UI 키트
Slices
각 레이어 내에서 특정 기능 영역이나 도메인을 나타내는 하위 디렉터리 (서비스 별로 묶여있음)
- 특정 비즈니스 도메인이나 기능을 캡슐화
- 독립적으로 개발 및 테스트 가능
- 다른 슬라이스와의 의존성을 명시적으로 관리
Segments
슬라이스 내부의 코드를 목적에 따라 더 세분화한 것
- ui: UI 컴포넌트
- model: 비즈니스 로직 (상태 관리, 액션, 셀렉터 등)
- api: 외부 서비스와의 통신
- lib: 유틸리티 함수
- config: 설정 및 상수