도메인 세팅 후 배포하기
완성된 웹사이트를 세상에 공개하려면 도메인(주소)과 호스팅이 필요합니다.
저렴하게 도메인을 구입하고 무료 호스팅 서비스인 Netlify에 배포하는 전 과정을 다룹니다.
1. Namecheap에서 도메인 구입하기
Namecheap은 전 세계적으로 인기 있는 도메인 등록 업체 중 하나입니다.
국내 업체보다 저렴한 가격과 간편한 관리 인터페이스가 장점입니다.
Step 1: 도메인 검색
- Namecheap 홈페이지에 접속합니다.
- 검색창에 원하는 도메인 이름을 입력합니다. (예:
myproject.com) - 사용 가능한 도메인 목록과 가격이 표시됩니다.
💡 Tip: .com 도메인이 가장 신뢰도가 높지만, 예산에 따라 .io, .xyz, .site 등도 좋은 선택입니다.
첫해 $1~5 정도의 저렴한 도메인도 많으니 부담 없이 시작하세요.
Step 2: 도메인 구매
- 원하는 도메인을 장바구니에 담습니다.
- 결제 페이지에서 WhoisGuard(개인정보 보호)가 무료로 포함되어 있는지 확인합니다.
- 계정을 생성하고 결제를 완료합니다.
2. Netlify 배포 설정
Netlify는 무료로 정적 웹사이트와 Next.js 프로젝트를 배포할 수 있는 서비스입니다.
GitHub와 연동하면 코드를 푸시할 때마다 자동으로 배포됩니다.
Step 1: GitHub 저장소 연결
- Netlify에 GitHub 계정으로 로그인합니다.
- [Add new site] → [Import an existing project]를 클릭합니다.
- 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에서 도메인 추가
- Netlify 대시보드에서 배포된 사이트를 선택합니다.
- [Domain settings] → [Add custom domain]을 클릭합니다.
- 구입한 도메인 주소를 입력합니다. (예:
myproject.com) - Netlify가 DNS 레코드 설정 안내를 표시합니다.
Step 2: Namecheap DNS 설정
- Namecheap 대시보드 → [Domain List]에서 해당 도메인의 [Manage]를 클릭합니다.
- [Advanced DNS] 탭으로 이동합니다.
- 기존 레코드를 삭제하고 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을 제공합니다.