AWS CloudFront로 React 프로젝트를 배포하는 과정을 기록해보려고 한다.
글은 2025년 11월 기준 aws 콘솔이다.

이전 글인 가비아 도메인 구매하는 방법은 아래 글에 자세히 적어두었다.
https://bba-jin.tistory.com/78
[AWS] CloudFront로 React 정적배포하기 - 1. 가비아 도메인 구매하기
AWS CloudFront로 React 프로젝트를 배포하는 과정을 기록해보려고 한다.글은 2025년 11월 기준 aws 콘솔이다. 1. 가비아에서 도메인 구매하기1. 가비아에서 구매할 도메인을 검색해본다. 마음에 드는 도
bba-jin.tistory.com
1. AWS Console의 Route53으로 접속한다.
이때! Region은 Global로 뜨는게 맞다. (특정 지역을 선택하는게 아님!)

2. Hosted Zone 생성하기
좌측 메뉴의 'Hosted zones' > 'Create hosted zone' 버튼을 클릭한다.

3. 아래 정보들을 입 후 하단에 'Create hosted zone' 버튼을 클릭한다. 빨간색은 필수!
Domain name(필수!) : 가비아에서 산 도메인
Description : 부가 설명
Type : Public hosted zone 버튼 클릭 (필수!)
Tags : 태그 설정(인데 안해도 전혀 문제되지 않는다)

+ 여기서 설정한게 하루가 지나도 적용이 안되길래 골머리를 썩었는데
다시 사진을 확인해보니 내가 'memeduck.site'가 아니라 'memduck.site'로 입력을 해둔걸 발견했다ㅠㅜ
혹시 이 글을 보고 설정하고 계신분들은 domain name에 오타가 나지 않도록 조심하시길!
4. 생성 후 '.org', '.com', '.co.uk', '.net'으로 끝나는 4개의 NS레코드가 나온다.
이 네개를 복사해서 가비아에 넣으면 된다.

5. 'My 가비아' https://my.gabia.com/dashboard#/ 링크 접속 후 '서비스 관리', '서비스 관리' 탭을 클릭한다

6. 구매한 도메인 우측에 '관리' 버튼 클릭

7. 네임서버 우측에 있는 '설정' 버튼 클릭

8. 1-4차 입력칸에 4에서 생성된 네임서버들을 입력한다.
순서는 무관!

9. 소유자 인증을 하고 확인버튼을 누르면 아래와 같이 변경된 걸 확인할 수 있다.

설정을 잘 하면 아래 코드를 그냥 아무 로컬 cli에 입력했을 때 처음엔 아래 사진 처럼 나오던게, 2~30분정도 지나면 두번째 사진처럼 route 53에 뜨는 ns 레코드가 나온다.
nslookup -type=ns 사이트도메인 8.8.8.8

30분정도 후, 네임서버 등록이 완료됐을 때 :

등록 후 전파되는데 시간이 걸리기 때문에, 다음단계를 진행하고 추후에 이 부분을 확인하는걸 추천한다.
| ✅ 1 | Route53 Hosted Zone memeduck.site 새로 생성 |
| ✅ 2 | 가비아 네임서버 4개 AWS로 교체 완료 |
| 🕒 3 | 전파 대기 (최대 24시간, 보통 1~3시간) |
| 🔜 4 | ACM 자동 검증 후 “Issued” |
| 🔜 5 | CloudFront 배포 + Route53 레코드 연결 |
'Infra' 카테고리의 다른 글
| [AWS] CloudFront로 React 정적배포하기 - 6. ACM 인증서 검증 및 Cloudfront 연결 (0) | 2025.11.06 |
|---|---|
| [AWS] CloudFront React 정적배포하기 - 5. Cloudfront 배포 (0) | 2025.11.06 |
| [AWS] CloudFront로 React 정적배포하기 - 4. S3 버킷 생성 및 설정 (0) | 2025.11.06 |
| [AWS] CloudFront로 React 정적배포하기 - 3. AWS Certificate Manager ACM인증서 발급 (1) | 2025.11.06 |
| [AWS] CloudFront로 React 정적배포하기 - 1. 가비아 도메인 구매하기 (0) | 2025.11.06 |