쿠쿠더님의 블로그

정적 배포(Static Deployment) 경험과 배운 점 본문

개발자 공부

정적 배포(Static Deployment) 경험과 배운 점

쿠쿠더 2025. 10. 29. 20:15

이번 MPS 기업협약 프로젝트에서는 정적 배포(Static Deployment) 방식을 사용했습니다.
처음에는 단순히 “서버에 올리는 것” 정도로만 생각했지만, 실제로 적용하면서 정적 배포의 개념과 장점, 그리고 세부 설정 과정을 깊이 이해할 수 있었습니다.

 정적 배포란 무엇일까?

정적 배포는 말 그대로, 서버에서 매번 동적으로 페이지를 생성하지 않고 미리 만들어둔 HTML, CSS, JS 파일을 그대로 제공하는 방식입니다.
Next.js나 React 같은 프레임워크를 사용할 때 npm run build 명령으로 만들어지는 out 폴더(또는 build 폴더) 안의 결과물이 바로 그 정적 파일들이죠.
이 파일들은 서버에서 실행되는 로직 없이도 CDN(Content Delivery Network) 을 통해 빠르게 배포할 수 있습니다.

즉, 사용자가 페이지를 요청할 때마다 서버가 새로 계산하지 않아도 되기 때문에
속도가 빠르고, 트래픽 비용이 적으며, 관리가 간편한 장점이 있습니다.

 

MPS 프로젝트에서의 적용 과정

MPS 프로젝트에서는 Next.js 기반의 프론트엔드를 사용했습니다.
처음에는 서버 사이드 렌더링(SSR) 방식으로 배포를 고민했지만,
기업 협약 특성상 관리 효율성과 유지 보수 용이성이 더 중요했기 때문에 정적 배포 방식으로 결정했습니다.

배포 과정은 아래와 같았습니다.

 

1. next export를 이용해 정적 파일 생성

npm run build
npm run export

 

    이렇게 하면 out/ 디렉토리에 HTML, CSS, JS 등 완성된 정적 리소스가 생성됩니다.

  1. S3에 업로드 (정적 웹 호스팅 설정)
    AWS S3 콘솔에서 버킷을 만들고,
    정적 웹 사이트 호스팅(Static website hosting) 옵션을 활성화한 뒤 out 폴더의 파일들을 업로드했습니다.
  2. CloudFront 연결로 CDN 구성
    정적 파일을 빠르게 전송하기 위해 S3 버킷을 CloudFront에 연결했습니다.
    이렇게 하면 한국뿐 아니라 해외에서도 지연 없이 빠른 응답 속도를 제공합니다.
  3. 버전 관리와 캐시 무효화 설정
    새로운 빌드를 올릴 때마다 기존 캐시가 남아 있어서 변경사항이 바로 반영되지 않는 경우가 많았습니다.
    이 문제를 해결하기 위해 CloudFront의 Invalidation(무효화) 기능을 사용해
    /index.html, /static/* 경로를 새로 갱신했습니다.
    이 과정을 자동화해두니 배포 속도가 훨씬 빨라졌습니다.

정적 배포의 장점과 한계

직접 적용하면서 느낀 정적 배포의 장점은 다음과 같았습니다.

  • 속도: 서버 로드 없이 즉시 응답 → 사용자 입장에서 로딩 체감이 매우 빠름
  • 안정성: 서버 장애가 발생해도 CDN이 캐시된 파일을 그대로 전달
  • 비용 절감: EC2나 백엔드 서버 없이 S3 + CloudFront로도 충분히 운영 가능
  • 보안성: 서버 로직이 노출되지 않음 (API 서버와 분리)

하지만 단점도 있었습니다.

  • 실시간 데이터 반영이 어려움
    (예: 게시글 수정 후 바로 반영되지 않거나 빌드를 다시 해야 하는 경우)
  • 빌드 시간이 길어질 수 있음
    페이지 수가 많으면 export 과정에서 시간이 점점 늘어남
  • SSR 기능을 사용할 수 없음
    SEO나 로그인 기반 페이지는 별도 API 연동으로 처리해야 함

그래서 이후에는 일부 페이지를 동적 렌더링으로 전환하고,
정적/동적 하이브리드 구조를 고민하게 됐습니다.

이번 경험을 통해 느낀 점

정적 배포는 단순히 “파일을 올리는 과정”이 아니라,
서비스의 규모, 트래픽, 유지 보수 전략에 따라 배포 방식을 선택하는 판단의 문제라는 걸 느꼈습니다.
또한 정적 배포 환경에서는 CloudFront 캐시 정책, 버전 관리, 배포 자동화 같은 운영적인 부분도 함께 고려해야 합니다.

MPS 프로젝트를 진행하면서
“배포도 개발의 일부다”라는 말을 실감했습니다.
화면을 만드는 것만큼, 사용자에게 안정적이고 빠르게 전달하는 과정도 결국은 개발자의 역할이었습니다.

참고 자료

'개발자 공부' 카테고리의 다른 글

1일차 기본 지식  (0) 2024.12.30
'개발자 공부' Related Articles more