가비아에서 도메인 구매 후 Vercel 연결하기

고대디에서 환불 이슈로 가비아로 갈아탔습니다. 역시 한국 사이트가 접근성도 좋고 심지어 가격도 더 저렴했구요. 왜 고대디를 썼었는지! 이 글에서는 가비아에서 도메인 구매 하고 Vercel에 연결하는 전체 과정을 기록했습니다.

1. 도메인 구매

가비아에서 hyebin.pro 도메인 구매했습니다. ( 가격은 1년 5500원 )

네임서버: ns.gabia.co.kr (가비아 DNS 서버 사용)

가비아에서 도메인을 구매하면 기본적으로 가비아의 네임서버(ns.gabia.co.kr)가 설정됩니다. 가비아 네임서버를 그대로 유지하면서 DNS 레코드만 추가하는 방식으로 진행했습니다.

Vercel 네임서버로 완전히 이전하는 방법도 있지만, 가비아 네임서버를 유지하는 것이 더 간단하고, 나중에 가비아의 다른 서비스(예: 이메일 호스팅)를 사용하기에도 편리합니다.

2. Vercel에서 도메인 추가

Vercel 프로젝트 설정에서 구매한 hyebin.pro커스텀 도메인 추가해줍니다.

3. 가비아 DNS 레코드 설정

Vercel이 DNS 레코드 값들을 제공하는데 이 내용을 가비아에 적어줘야합니다. 각 레코드가 어떤것을 의미하는지 알아보겠습니다!

A 레코드 설정

• 호스트: @ (www 없는 루트 도메인 → hyebin.pro )
• 타입: A
• 값: 216.198.79.1
• TTL: 800초

hyebin.pro로 직접 접속할 때 도메인을 Vercel의 IP 주소(216.198.79.1)로 연결하는 역할을 합니다. 단, A 레코드는 고정 IP 주소를 직접 가리킵니다. 따라서 Vercel이 IP를 변경하면 가비아에서 수동으로 업데이트해야 합니다.

흐름 이해하기 : 사용자가 hyebin.pro 입력

1. 1.브라우저 → ns.gabia.co.kr (가비아 DNS 서버)에 질문 : "hyebin.pro의 IP 주소 알려줘!”
2. 2.가비아 DNS → A 레코드 확인 → "216.198.79.1이야!”
3. 3.브라우저 → 216.198.79.1 (Vercel 서버)로 HTTP 요청
4. 4.Vercel 서버 → "hyebin.pro? 아, 혜빈님 프로젝트구나!" → 웹사이트 파일 찾기
5. 5.Vercel → 브라우저로 HTML, CSS, JS 전송
6. 6.브라우저 → 웹 사이트 화면에 렌더링

CNAME 레코드 설정

• 호스트: www (사용자가 www.hyebin.pro 입력 → www 있음)
• 타입: CNAME
• 값: acf5bb…..vercel-dns-017.com. (Vercel이 내 프로젝트에 부여한 고유 식별자예요.)
• TTL: 1800초

CNAME 레코드는 도메인을 다른 도메인으로 연결하는 역할을 합니다. ( 다른 도메인으로 "리다이렉트”) 즉, www.example.com은 example.com과 같은 곳이야”라고 알려주는거에요. "www.hyebin.pro로 들어오면, Vercel의 acf5bb0303dfb93d.vercel-dns-017.com으로 보내줘" CNAME 레코드는 다른 도메인을 가리키기 때문에, Vercel이 내부적으로 IP를 변경하더라도 자동으로 새 IP로 연결됩니다.

1. 1.내가 Vercel에 웹사이트 배포
2. 2.Vercel: "좋아, 네 프로젝트 ID는 acf5bb…야"
3. 3.Vercel: "네 임시 주소는 acf5bb0303dfb93d.vercel-dns-017.com이야"
4. 4.당신이 원하는 도메인(hyebin.pro)을 연결하려면
   → CNAME으로 Vercel 도메인을 가리키면 됨

흐름 이해하기 : 사용자가 www.hyebin.pro 입력

1. 1.브라우저 → 가비아 DNS 서버(ns.gabia.co.kr)에 질문 : "www.hyebin.pro의 IP 주소 알려줘!”
2. 2.가비아 DNS → CNAME 레코드 확인 : "직접 IP는 없고, acf5bb0303dfb93d.vercel-dns-017.com으로 가봐!”
3. 3. 브라우저 → Vercel DNS 서버로 다시 질문 : "acf5bb0303dfb93d.vercel-dns-017.com의 IP는?”
4. 4. Vercel DNS → 접속자 위치 확인 : "한국에서 접속하네? 가장 가까운 서버 IP는 123.123.123.123!”
5. 5.브라우저 → 123.123.123.123 (Vercel 서버)로 연결 : "안녕, 나 www.hyebin.pro 보고 싶어!"
6. 6.Vercel 서버 → "www.hyebin.pro? acf5bb... 프로젝트구나! → 웹사이트 파일 찾기
7. 7.Vercel → 브라우저로 HTML, CSS, JS 전송
8. 8.브라우저 → 웹 사이트 화면에 렌더링

TXT 레코드 설정

• 호스트: @ (루트 도메인 → hyebin.pro)
• 타입: TXT
• 값: "google-site-verification=-8c0jbAHVHb6umPpvXu1LH773Q_PTQ1VOahjx7WDN-4"
• TTL: 3600초

역할: Google Search Console 소유권 인증용 (선택사항)

TXT 레코드는 DNS에 텍스트 정보를 저장하는 역할을 합니다. A 레코드나 CNAME처럼 IP 주소나 다른 도메인을 가리키는 게 아니라, 그냥 "메모"를 남겨두는 것이라고 생각하면 됩니다.

Google Search Console에 도메인을 등록하면, Google이 "진짜 이 도메인 주인이 맞나요?"를 확인하기 위해 고유한 인증 코드를 줍니다. 이 코드를 DNS의 TXT 레코드에 저장해두면, Google이 DNS를 조회해서 코드를 확인하고 "아, 이 사람이 진짜 주인이구나!" 하고 인증해줍니다.