🚀 Monorepo Template

현대적이고 확장 가능한 웹 개발을 위한 모노레포 템플릿입니다. Next.js와 React 기반의 애플리케이션을 포함하고 있으며, TypeScript, Tailwind CSS, Turbo를 활용하여 빠르고 효율적인 개발 환경을 제공합니다.

✨ 주요 특징

• 🔄 모노레포 구조: 여러 프로젝트를 효율적으로 관리
• ⚡ Turbo: 빠른 빌드와 캐싱으로 개발 생산성 향상
• 🎨 일관된 디자인: Tailwind CSS로 통일된 디자인 시스템
• 🔒 타입 안전성: TypeScript로 안정적인 코드 작성
• 📱 반응형 디자인: 모든 디바이스에서 완벽한 사용자 경험
• 🚀 최신 기술 스택: Next.js 14, React 18, Vite 등 최신 도구 활용

📁 프로젝트 구조

monorepo-template/
├── 📂 apps/                    # 애플리케이션들
│   ├── 📂 next-app/           # Next.js 애플리케이션 (포트 3000)
│   │   ├── 📂 src/
│   │   │   ├── 📂 app/        # App Router 구조
│   │   │   ├── 📂 components/ # 재사용 가능한 컴포넌트
│   │   │   └── 📂 lib/        # 유틸리티 함수들
│   │   └── 📄 package.json
│   └── 📂 react-app/          # React 애플리케이션 (포트 3001)
│       ├── 📂 src/
│       │   ├── 📂 components/ # 재사용 가능한 컴포넌트
│       │   └── 📂 lib/        # 유틸리티 함수들
│       └── 📄 package.json
├── 📂 packages/               # 공유 패키지들
├── 📂 documents/              # 프로젝트 문서
│   ├── 📄 monorepo-guide.md   # 모노레포 학습 가이드
│   ├── 📄 deployment.md       # 배포 가이드
│   ├── 📄 cicd.md             # CI/CD 가이드
│   └── 📄 development.md      # 개발 가이드
├── 📄 package.json            # 루트 설정
├── 📄 turbo.json             # Turbo 설정
├── 📄 tsconfig.json          # TypeScript 설정
└── 📄 README.md              # 프로젝트 문서

🛠️ 기술 스택

프레임워크 & 라이브러리

• Next.js 14: React 기반 풀스택 프레임워크
• React 18: 사용자 인터페이스 라이브러리
• TypeScript: 정적 타입 검사
• Tailwind CSS: 유틸리티 우선 CSS 프레임워크

빌드 도구 & 개발 도구

• Turbo: 모노레포 빌드 시스템
• Vite: 빠른 개발 서버 및 빌드 도구
• ESLint: 코드 품질 관리
• Prettier: 코드 포맷팅

🚀 빠른 시작

1. 저장소 클론

git clone <repository-url>
cd monorepo-template

2. 의존성 설치

npm install

3. 개발 서버 실행

# 모든 앱 실행
npm run dev

# 특정 앱만 실행
npm run dev --filter=next-app
npm run dev --filter=react-app

4. 브라우저에서 확인

• Next.js 앱: http://localhost:3000
• React 앱: http://localhost:3001

📚 사용 가능한 스크립트

루트 레벨 명령어

npm run dev          # 모든 앱의 개발 서버 실행
npm run build        # 모든 앱 빌드
npm run lint         # 모든 앱 린트 검사
npm run test         # 모든 앱 테스트 실행
npm run clean        # 빌드 파일 정리
npm run format       # 코드 포맷팅
npm run type-check   # TypeScript 타입 체크

특정 앱 대상 명령어

# Next.js 앱
npm run dev --filter=next-app
npm run build --filter=next-app
npm run lint --filter=next-app

# React 앱
npm run dev --filter=react-app
npm run build --filter=react-app
npm run lint --filter=react-app

🎯 애플리케이션별 특징

Next.js 앱 (apps/next-app/)

• App Router: 최신 Next.js 라우팅 시스템
• SSR/SSG: 서버 사이드 렌더링 및 정적 생성
• SEO 최적화: 검색 엔진 최적화 자동 지원
• API Routes: 백엔드 API 엔드포인트 제공

React 앱 (apps/react-app/)

• Vite: 초고속 개발 서버
• Hot Module Replacement: 실시간 코드 반영
• 최적화된 빌드: 프로덕션용 최적화된 번들
• 모듈화: 컴포넌트 기반 아키텍처

📖 문서

더 자세한 정보는 다음 문서들을 참조하세요:

• 📚 모노레포 학습 가이드 - 모노레포 개념과 학습 자료
• 🚀 배포 가이드 - 배포 및 관리 방법
• 🔄 CI/CD 구축 가이드 - CI/CD 파이프라인 구축 및 테스트
• 🛠️ 개발 가이드 - 새로운 프로젝트 추가 및 설정

🤝 기여하기

1. 이 저장소를 포크합니다
2. 새로운 기능 브랜치를 생성합니다 (git checkout -b feature/amazing-feature)
3. 변경사항을 커밋합니다 (git commit -m 'Add some amazing feature')
4. 브랜치에 푸시합니다 (git push origin feature/amazing-feature)
5. Pull Request를 생성합니다

📄 라이선스

이 프로젝트는 MIT 라이선스 하에 배포됩니다. 자세한 내용은 LICENSE 파일을 참조하세요.

🙏 감사의 말

이 템플릿은 다음 오픈소스 프로젝트들의 도움을 받아 만들어졌습니다:

• Next.js
• React
• Turbo
• Tailwind CSS
• Vite

---

즐거운 코딩 되세요! 🎉