본 문서는 프로젝트에 설치된 의존성 목록과 역할, 그리고 주요 패키지의 설정 포인트를
정리합니다. 정확한 버전은 package.json 및
pnpm-lock.yaml 이 원본(single source of truth) 입니다.
| 패키지 |
버전 |
용도 |
next |
16.x |
프레임워크 (App Router) |
react / react-dom |
19.x |
UI 라이브러리 |
typescript |
5.x |
정적 타입 |
| 패키지 |
용도 |
tailwindcss 4.x |
유틸리티 퍼스트 CSS |
@tailwindcss/postcss |
Tailwind v4 PostCSS 플러그인 |
tw-animate-css |
Tailwind v4 용 애니메이션 유틸 (shadcn/ui 권장) |
class-variance-authority |
variant 기반 클래스 조합 |
clsx |
조건부 클래스네임 병합 |
tailwind-merge |
Tailwind 클래스 충돌 해소 |
lucide-react |
아이콘 세트 (shadcn/ui 기본) |
@radix-ui/react-slot |
shadcn/ui 의 asChild 구현체 |
shadcn/ui 컴포넌트는 src/shared/ui/ 에 배치됩니다. 추가 컴포넌트 설치 예시:
pnpm dlx shadcn@latest add card dialog input label
components.json 의 alias 가 @/shared/ui 로 지정되어 있어 자동으로 FSD 경로에
설치됩니다.
| 패키지 |
용도 |
@tanstack/react-query |
서버 상태(fetch/cache/mutate) 관리 |
@tanstack/react-query-devtools |
개발자 도구 (dev 환경에서만 렌더) |
zustand |
경량 전역 상태 관리 |
QueryClient 는 src/shared/api/query-client.ts 에,
Provider 는 src/app/providers.tsx 에 정의되어 있습니다.
| 패키지 |
용도 |
@biomejs/biome |
린터 + 포매터 (ESLint + Prettier 대체) |
husky |
Git 훅 매니저 |
lint-staged |
스테이지된 파일에만 린트/포맷 실행 |
@commitlint/cli |
커밋 메시지 검증 |
@commitlint/config-conventional |
Conventional Commits 규칙 |
| 스크립트 |
설명 |
pnpm lint |
린트 검사만 |
pnpm lint:fix |
린트 자동 수정 |
pnpm format |
포맷 자동 수정 |
pnpm check |
lint + format + import 정렬 일괄 수정 |
pnpm typecheck |
TypeScript 타입 체크 |
| 스크립트 |
설명 |
pnpm dev |
개발 서버 실행 |
pnpm build |
프로덕션 빌드 |
pnpm start |
빌드 결과물 실행 |