Loading...
JavaScript, React, TypeScript 등 학습하며 정리
프로젝트 구조 - 라우팅/레이아웃/도메인 분리
app/: 라우트·레이아웃·페이지 엔트리
shared/: 공통 UI, 도메인별 컴포넌트
hooks/ · lib/ · types/: 훅, 유틸, 타입 분리
클릭하여 복사
1src/
2├ app/
3│ ├ layout.tsx // 최상위 레이아웃·메타
4│ ├ page.tsx // 홈 (또는 (marketing)/page.tsx)
5│ ├ (auth)/ // 로그인/회원가입 그룹
6│ ├ blog/[slug]/page.tsx// 동적 라우트 예시
7│ ├ api/ // route handler (REST/RPC)
8│ └ global-error.tsx // 전역 에러 UI
9├ shared/
10│ ├ ui/ // 버튼·폼 등 재사용 UI
11│ └ common/ // Header, Footer, Navigation
12├ hooks/ // 공용 훅 (예: usePrefetch)
13├ lib/ // fetcher, auth, utils
14├ styles/ // 글로벌 스타일, tokens
15└ types/ // 전역 타입 선언