통합 경계
NestJS와 프론트엔드 경계
React나 Next 화면은 사용자 경험을 맡고, NestJS는 API 계약과 서버
정책을 맡는다. 둘 사이는 명확한 데이터 계약으로 연결한다.
연동 단위
DTO
CORS
Auth
Static
프론트 앱
화면 상태와 사용자 흐름
Route
페이지 전환과 렌더링
Fetch
API 호출과 캐시
계약면
서로 맞춰야 하는 형식
Request
헤더, 토큰, 파라미터
Response
DTO, 오류 코드, 페이지 크기
NestJS 서버
검증, 권한, 도메인 처리
Controller
요청 라우팅
Service
업무 규칙 실행
| 지점 | 프론트 관점 | Nest 관점 |
|---|---|---|
| 데이터 | 필요한 필드와 로딩 상태를 정한다. | DTO와 검증 규칙으로 응답을 고정한다. |
| 인증 | 토큰 저장과 재요청 흐름을 다룬다. | Guard와 세션 검증으로 접근을 제한한다. |
| 배포 | 정적 자산 또는 별도 호스팅을 선택한다. | API 서버와 정적 파일 제공 범위를 분리한다. |
운영 기준
Nest가 화면을 직접 품기보다 API 경계를 안정적으로 지키면, 프론트
교체와 서버 배포가 서로 덜 흔들린다.