프런트엔드 로컬 틸트 아키텍처

이 회고에서는 bf25fc6, 8b28948, 88d7c0a, c7ad439 및 5501704 전반의 변화를 다룹니다.

증상

현재 아키텍처는 의도적으로 로컬 우선입니다.

lumie-frontend/Tiltfile는 lumie-frontend를 npm run dev를 실행하는 local_resource로 등록합니다.
lumie-frontend/package.json는 dev를 next dev --turbo가 아닌 일반 next dev로 정의합니다.
lumie-frontend/src/shared/api/resolveBaseUrl.ts는 SSR 요청을 프런트엔드 원본을 통해 다시 루프하고 localhost 및 *.localhost에 http를 사용합니다.
.github/tilt-up.sh는 여전히 작업 공간 루트에서 Tilt를 실행하므로 프런트엔드는 클러스터에 배포되지 않고 클러스터 지원 서비스와 함께 시작됩니다.

원래 dev-cluster 레이아웃은 Next.js 프런트엔드를 다른 클러스터 작업 부하처럼 처리했습니다. 해당 모델은 next dev의 실제 동작과 싸웠습니다.

bf25fc6는 Traefik HTTP/2 ALPN 뒤에 반복적으로 수화 교착 상태가 발생한 후 클러스터 배포를 완전히 제거했습니다.
8b28948는 tilt up의 프런트엔드 참여를 복원했지만 개발자 노트북의 로컬 프로세스로만 가능했습니다.
장기간 실행된 Apple Silicon 개발 세션에서 터보팩 메모리 증가가 무제한으로 나타난 후 88d7c0a는 --turbo를 제거했습니다.
c7ad439는 비밀이 아닌 프런트엔드 환경을 Tiltfile serve_env로 옮겼으므로 로컬 개발자는 더 이상 개발자별 .env.local 드리프트에 의존하지 않습니다.
5501704는 나머지 SSR 엣지 케이스를 수정했습니다. next dev가 http를 통해 해당 호스트에 서비스를 제공하더라도 resolveBaseUrl()는 foo.localhost를 https로 처리했습니다.

안정적인 아키텍처는 다음과 같습니다.

상태가 많은 서비스는 클러스터에 유지됩니다.
Next.js 앱은 Tilt 관리형 npm run dev를 통해 로컬로 실행됩니다.
브라우저 요청은 http://localhost:3000에서 동일한 출처를 유지하고 프런트엔드 /api 프록시를 통해 NEXT_PUBLIC_API_BASE로 이동합니다.
로컬 SSR은 강제 내부 백엔드 URL 대신 요청 Host 헤더를 사용합니다.

관련 프록시별 인증 함정은 Next.js API Proxy Auth Gotchas에 문서화되어 있습니다.