[TIL] 클라이언트 배포

신재욱·2023년 5월 3일
1
post-thumbnail

📒 오늘 공부한 내용

🔍수업목차

[33-1] 클라이언트 배포 기초
[33-2] 배포 방식에 따른 데이터 흐름
[33-3] 클라이언트 배포 실습

✅ 클라이언트 배포 기초


📂 S3 : Simple Storage Service

  • 무제한 용량을 제공하는 온라인 스토리지 서비스
  • S3 Glacier (단위 : 1 Vault) : 백업을 위한 스토리지 서비스, 일정 기간마다 Vault로 전송된 데이터를 한번에 기록한 다음 전원을 차단하여 초장기 보관을 하는 방식으로 서비스된다. 일반 사용자보다는 기업에서 대규모 데이터를 백업할 때 주로 사용

📂 EC2 : Elastic Compute Cloud

  • 아마존 서버 내 일부 영역을 가상 컴퓨터 형태로 임대하는 서비스
  • 클라이언트 동적 배포 시에도 사용할 수 있으며, 주로 RDS와 같은 DB서비스에 연결하여 백엔드 서버로 이용된다.
  • 사용량(컴퓨터 가동 시간, 트래픽)에 따라 과금되며 분당 요금을 부과하기 때문에 프리티어가 아닐 경우 과도한 요금이 청구될 수 있다.
  • Load Balancer : EC2가 트래픽을 안정적으로 처리할 수 있도록 하는 부하 분산 서비스 인스턴스의 처리 한계를 넘을 경우 서비스 제공이 지연되거나 중단될 수 있기 때문에 대규모 서비스 구축 시 1차 대비책으로 로드밸런서를, 2차 대비책으로 오토스케일링을 설정

📂 CloudFront

  • 아마존에서 제공하는 CDN 서비스
  • 전세계 어디서나 빠른 속도로 파일을 제공받을 수 있도록 해 주며, S3과 연결하여 클라이언트 복합 배포를 할 수 있고, 라우팅 경로 최적화용으로도 사용할 수 있다.

📂 Route 53

  • 아마존에서 제공하는 DNS 서비스
  • 구입한 도메인을 AWS의 각 서비스들에 연결할 수 있도록 해 주며, 도메인 구입 및 관리도 지원한다.

📂 ACM

  • HTTPS 연결을 위한 SSL 인증서를 발급하고 관리하도록 해 주는 서비스

✅ 배포 방식에 따른 데이터 흐름


✅ 클라이언트 배포 실습


1️⃣ Next.js 프로젝트 빌드

"scripts": {
  "dev": "next dev",
  "build": "next build",
	"build:ssg": "next build && next export"
  "start": "next start"
},

2️⃣ next.config.js trailing slash 옵션을 추가

module.exports = {
  trailingSlash: true,
}

3️⃣ S3(Simple Storage Service) 배포

4️⃣ 도메인 연결

profile
1년차 프론트엔드 개발자

0개의 댓글