[260701] TIL

Today I Learned (2026-07-01)

호스팅과 렌더링은 다른 축이다

• 호스팅은 앱을 어디에, 어떤 방식으로 올려서 제공할지의 문제이고, 렌더링(CSR·SSR·SSG·ISR)은 화면을 언제, 어디서 만들지의 문제다. 둘이 같이 언급돼서 헷갈리기 쉽지만 서로 독립된 개념이다.
• 정적 호스팅은 빌드된 파일(HTML·JS·CSS)을 그대로 전달만 한다. Vite로 만든 SPA는 이걸로 충분하지만, 직접 접근한 경로를 index.html로 돌려주는 fallback rewrite가 없으면 새로고침할 때 404가 난다.
• Next.js의 SSR·Route Handler·Middleware는 요청마다 서버 코드가 돌아야 하므로 서버(컴퓨트) 호스팅이 필요하다. 정적 호스팅과 SSG도 같은 말이 아니다. SSG는 빌드 때 미리 그리는 렌더링 방식이고, 정적 호스팅은 그 결과물을 서빙하는 방식이다.

AWS Amplify의 WEB_COMPUTE

• Amplify 앱의 플랫폼 타입은 크게 WEB(정적 호스팅)과 WEB_COMPUTE(서버 호스팅) 두 가지다. SSR이 있는 Next.js 앱은 WEB_COMPUTE여야 한다.
• 타입이 WEB으로 남아 있으면 요청을 Next가 아니라 S3가 받는다. 그러면 /login이 /login/으로 301 리다이렉트된 뒤 index.html을 찾지 못해 404가 난다. 로컬 next dev는 진짜 Next 서버라 이 문제가 재현되지 않는다.
• 프론트 앱을 Vite에서 Next.js로 옮긴 뒤 배포 환경에서만 404가 나서 원인을 따라가 봤는데, 코드가 아니라 호스팅 타입 설정 문제였다.