FSD 아키텍처 적용기 : "이 코드는 어디에 넣어야 할까?" FSD가 답해준 코드 위치의 명확성

1. FSD 아키텍처 도입 배경

• 기존 레포지토리의 복잡한 구조로 개발 생산성 저하, 시스템 안정성 우려가 있었습니다.
• 코드 위치 명확성과 의존성 문제 해결을 위해 FSD(Feature-Sliced Design) 아키텍처를 도입했습니다. 2. FSD 핵심 개념
• FSD는 프론트엔드 구조 방법론으로, 높은 응집도와 낮은 결합도를 목표합니다.
• 코드를 레이어(Layers), 슬라이스(Slices), 세그먼트(Segments) 3가지 차원으로 분리합니다.
• 레이어는 단방향 의존성 수직 계층이며, 슬라이스는 도메인별 수평 분할, 세그먼트는 기술 목적(ui, api, model) 구분을 담당합니다. 3. FSD 적용 전략 및 성과
• widgets 레이어 미사용, pages 레이어는 Slice Grouping을 허용했습니다.
• API 코드 위치는 재사용 범위에 따라 명확히 구분하고, 상향식(Bottom-Up) 방식으로 점진적 도입했습니다.
• 적용 후 코드 위치 명확화, 재사용 통제, 개발 생산성 및 유지보수성 향상 효과를 얻었습니다.