배포 및 도메인 연결
내 로컬 저장소에 있는 코드를 전 세계와 공유하는 방법. 무료 호스팅과 최저가 도메인 조합을 추천합니다.
1. Netlify 무료 호스팅
개인적으로 바이브 코딩 시에는 Netlify를 사용합니다. 개인 사용자는 완전 무료이며, 심지어 DB(Neon) 연결도 무료입니다.
Netlify 가입 및 GitHub 연결
Netlify에 가입 후, 내 GitHub 계정을 연결하고 해당 레포지토리를 선택하면 자동으로 배포가 시작됩니다.
자동 배포
이후 코드를 GitHub에 push할 때마다 Netlify가 자동으로 빌드하고 배포합니다.
💡 클라이언트 배포 팁
외주 작업 시, 클라이언트 계정으로 Netlify를 가입하게 한 뒤, 해당 계정에 GitHub를 연결해두면 나중에 코드를 업데이트할 때마다 자동으로 클라이언트 사이트도 업데이트됩니다. 유지보수가 매우 편해집니다.
🗄️ 데이터베이스가 필요하다면? (Neon DB)
DB가 필요한 프로젝트라면 Neon을 사용하세요. Netlify와 가장 궁합이 좋은 Serverless Postgres DB입니다.
🔗 Neon DB 직접 설정 및 연동하는 법
- NeonDB 공식 홈페이지(neon.tech) 가입 후 로그인
- 새 프로젝트 생성 시 Region(서버 위치)을 Asia Pacific (Singapore)으로 선택
- 생성 완료 후 화면에 표시되는 Connection String(
postgresql://...) 복사 - Netlify Dashboard > 내 사이트 > Site configuration > Environment variables로 이동
DATABASE_URL키 값으로 복사한 연결 주소를 입력하여 저장
⚠️ 속도 최적화 팁: Netlify 대시보드의 Extension(통합) 기능을 통해 연동하면 서버 위치가 유럽 등 먼 곳으로 자동 설정되어 반응속도(레이턴시)가 매우 느려집니다.
귀찮더라도 NeonDB 공식 사이트(neon.tech)에 직접 접속하여 프로젝트 생성 시 리전을 Singapore(싱가포르)로 선택한 뒤 연결하는 것을 강력히 추천합니다.
2. 도메인 (Namecheap)
도메인은 국내 업체(가비아 등)보다 외국 서비스인 Namecheap이 훨씬 저렴합니다.
*1년 기준으로 저렴하며, 2년 이상 계약 시 가격이 비싸질 수 있음.
3. 도메인 연결 설정 (DNS)
Namecheap에서 구매한 도메인을 Netlify에 연결하는 가장 쉬운 방법은 Nameserver 변경입니다.
Netlify 설정
Netlify 대시보드 > Domain management > Add a domain으로 이동합니다.
구매한 도메인 주소(예: my-service.com)를 입력하고 Verify를 클릭합니다.
"Add domain"을 누르면 Netlify가 4개의 네임서버 주소(dns1.p0x.nsone.net 등)를 알려줍니다. 이 창을 켜두세요.
Namecheap 설정
Namecheap 로그인 > Domain List > 해당 도메인의 Manage 버튼 클릭.
Nameservers 항목을 "Namecheap BasicDNS"에서 "Custom DNS"로 변경합니다.
Netlify에서 받은 4개의 주소를 차례대로 입력하고 체크(저장) 버튼을 누릅니다.
HTTPS (보안) 자동 적용
네임서버 변경 후 최대 24시간이 걸릴 수 있지만, 보통 10분~1시간 내에 완료됩니다.
연결이 완료되면 Netlify가 자동으로 SSL 인증서(HTTPS)를 발급해줍니다. 이제 당신의 사이트는 전 세계 어디서든 안전하게 접속 가능합니다.