도메인 세팅 후 배포하기

완성된 웹사이트를 세상에 공개하려면 도메인(주소)과 호스팅이 필요합니다.
저렴하게 도메인을 구입하고 무료 호스팅 서비스인 Netlify에 배포하는 전 과정을 다룹니다.


1. Namecheap에서 도메인 구입하기

Namecheap은 전 세계적으로 인기 있는 도메인 등록 업체 중 하나입니다.
국내 업체보다 저렴한 가격과 간편한 관리 인터페이스가 장점입니다.

Step 1: 도메인 검색

  1. Namecheap 홈페이지에 접속합니다.
  2. 검색창에 원하는 도메인 이름을 입력합니다. (예: myproject.com)
  3. 사용 가능한 도메인 목록과 가격이 표시됩니다.

💡 Tip: .com 도메인이 가장 신뢰도가 높지만, 예산에 따라 .io, .xyz, .site 등도 좋은 선택입니다.
첫해 $1~5 정도의 저렴한 도메인도 많으니 부담 없이 시작하세요.

Step 2: 도메인 구매

  1. 원하는 도메인을 장바구니에 담습니다.
  2. 결제 페이지에서 WhoisGuard(개인정보 보호)가 무료로 포함되어 있는지 확인합니다.
  3. 계정을 생성하고 결제를 완료합니다.

2. Netlify 배포 설정

Netlify는 무료로 정적 웹사이트와 Next.js 프로젝트를 배포할 수 있는 서비스입니다.
GitHub와 연동하면 코드를 푸시할 때마다 자동으로 배포됩니다.

Step 1: GitHub 저장소 연결

  1. Netlify에 GitHub 계정으로 로그인합니다.
  2. [Add new site] → [Import an existing project]를 클릭합니다.
  3. GitHub를 선택하고 배포할 저장소를 찾아 선택합니다.

Step 2: 빌드 설정

Next.js 프로젝트의 경우 아래 설정을 입력합니다:

Build command: npm run build
Publish directory: .next

설정이 완료되면 [Deploy site] 버튼을 클릭합니다.
몇 분 내에 random-name.netlify.app 형태의 임시 주소로 사이트가 배포됩니다.

3. Namecheap 도메인을 Netlify에 연결

이제 구입한 도메인을 Netlify 사이트에 연결하여 실제 주소로 접근할 수 있게 만듭니다.

Step 1: Netlify에서 도메인 추가

  1. Netlify 대시보드에서 배포된 사이트를 선택합니다.
  2. [Domain settings] → [Add custom domain]을 클릭합니다.
  3. 구입한 도메인 주소를 입력합니다. (예: myproject.com)
  4. Netlify가 DNS 레코드 설정 안내를 표시합니다.

Step 2: Namecheap DNS 설정

  1. Namecheap 대시보드 → [Domain List]에서 해당 도메인의 [Manage]를 클릭합니다.
  2. [Advanced DNS] 탭으로 이동합니다.
  3. 기존 레코드를 삭제하고 Netlify가 제공한 DNS 레코드를 추가합니다.

💡 DNS 레코드 예시:

Type: A Record
Host: @
Value: 75.2.60.5 (Netlify IP)
TTL: Automatic

Type: CNAME Record
Host: www
Value: your-site-name.netlify.app
TTL: Automatic

Step 3: SSL 인증서 활성화

DNS 전파가 완료되면 (보통 몇 분 ~ 최대 48시간), Netlify 도메인 설정에서 [Verify]를 클릭합니다.
그 후 [HTTPS] 섹션에서 [Provision certificate]를 클릭하면 무료 SSL 인증서가 자동 발급됩니다.

💡 더 쉬운 방법: 이전 단계(환경 세팅)에서 GitHub 연결을 완료했다면, Netlify와 GitHub를 연결한 상태에서 안티그래비티 프롬프트에 "푸시해줘, Netlify 세팅해줘"라고 요청하면 자동으로 배포됩니다.

⚠️ 주의: 카페24 사용 금지
간혹 카페24 호스팅을 사용하시는 분들이 있는데, 절대 사용하지 마세요.
카페24는 SSL 인증서(HTTPS)가 무료로 제공되지 않아 지속적으로 비용을 지불해야 합니다. Netlify는 무료로 SSL을 제공합니다.

방향키로 이동