피드로 돌아가기
Dev.toFrontend
원문 읽기
모듈 기반 모노레포 설계로 다중 제품 개발 시 코드 중복 제거와 확장성 확보함
# I Built a Scalable Monorepo Boilerplate for Multi-Product Apps (Next.js + NestJS + Turbo)
AI 요약
Context
기존 모노레포는 앱당 코드 중복으로 확장 불가하거나 중앙 집중화로 인해 거대 앱화되는 두 가지 문제에 직면함. 다중 제품을 하나의 시스템으로 운영하려는 팀에게 명확한 구조가 필요함.
Technical Solution
- 모듈 기반 아키텍처: 제품을 독립 모듈로 정의하고 앱은 런타임으로만 동작하게 함
- 패키지 구조 분리: core/, products/, shared/, ui/로 관심사 분리함
- NestJS 플러그인 방식: ProductAModule을 import하여 API에 동적 연결함
- Next.js 기능 모듈화: 각 제품의 frontend를 독립 Feature로 추출함
- Turborepo 활용: 빌드 캐싱과 병렬 개발로 개발 속도 향상함
Impact
10개 레포 + 10개 API + 10개 프론트엔드를 1개 시스템으로 통합함. 코드 중복 제거로 유지보수 비용 절감됨.
Key Takeaway
"제품은 모듈이고 앱은 런타임"이라는 관점 전환이 모노레포 확장성의 핵심임. core와 product 로직을 절대 혼합하지 않아야 모노레포가 오래 유지됨.
실천 포인트
Next.js + NestJS 기반 다중 제품 개발 시 packages/products/[product-name]/backend와 frontend 구조로 분리할 것. 각 모듈에 index.ts 엔트리 포인트를 반드시 정의하고, 경로 별칭 설정 시 leading / 없이 상대 경로로 설정해야 빌드 오류를 방지할 수 있음.