Monorepo + Feature-Sliced Design (FSD) 하이브리드 구조 문서 (v2)
SSUPort 프론트엔드의 FSD 아키텍처 상세 문서입니다.
ssuport-frontend/
├── apps/ # 배포 단위 앱 (각각 FSD)
│ ├── ssuport-apply/ # 신청 앱 (3000)
│ └── ssuport-grading/ # 채점 앱 (3001)
│
├── packages/ # 모노레포 공용 패키지
│ ├── ui/ # 디자인 시스템
│ ├── api/ # API 클라이언트/React Query 설정
│ ├── types/ # 공통 타입
│ ├── utils/ # 공용 유틸
│ ├── constants/ # 공용 상수
│ └── config/ # tsconfig 등 공용 설정
│
└── (package.json, turbo.json, pnpm-workspace.yaml)
| 분류 | 위치 | 범위 | 예시 |
|---|---|---|---|
| 전사 공용 | packages/* |
모든 앱 | Button, API client, 공통 타입 |
| 앱 내부 공용 | apps/*/src/shared |
해당 앱만 | 앱 전용 레이아웃, 앱 전용 훅, 앱 설정 |
FSD는 Layer(계층) + Slice(도메인 단위 모듈) + **Segment(슬라이스 내부 구조)**로 구성된다.
app / pages / widgets / features / entities / sharedssuport, application, grading) 또는 기능 단위(예: apply-ssuport)ui / model / api / lib 등app
pages
widgets
features
entities
shared
(외부) packages
packages/*는 앱 내부 레이어가 아니라 모든 레이어에서 접근 가능한 외부 공용 라이브러리 영역으로 취급한다.