Next.js + Vercel 무료 호스팅으로 블로그 5개 운영하는 법
Vercel 무료 플랜(Hobby)으로 Next.js 블로그 5개를 동시에 운영하면서 얻은 실전 노하우를 공유합니다. 프로젝트 구조, 도메인 설정, 빌드 최적화, 트래픽 관리까지 경험 기반으로 정리했습니다.
왜 Vercel 무료 플랜인가
솔직히 말하면, 처음에는 WordPress + 공유호스팅으로 블로그를 운영했습니다. 월 5,000원짜리 호스팅에 블로그 하나 올려두고 "이 정도면 괜찮지" 하고 있었는데, 문제는 블로그가 하나가 아니었다는 겁니다. 기술 블로그, 사이드 프로젝트 소개 페이지, 포트폴리오… 하나씩 늘어나더니 어느새 5개가 됐습니다.
월 호스팅비만 2만 5천 원. 거기다 SSL 인증서 관리, PHP 업데이트, 플러그인 충돌 문제까지. "이걸 왜 돈 내고 고생하고 있지?" 라는 생각이 들었습니다.
그때 눈에 들어온 게 Vercel이었습니다. Next.js를 만든 회사답게 Next.js 프로젝트 배포가 미친 듯이 간편했고, 무엇보다 Hobby 플랜이 완전 무료였습니다.
Vercel Hobby 플랜의 실제 한계
공식 문서(Vercel Pricing)를 보면 Hobby 플랜의 제한은 이렇습니다:
- 대역폭: 월 100GB
- 빌드 시간: 월 6,000분
- Serverless Function 실행: 월 100GB-Hours
- 프로젝트 수: 무제한 (!)
네, 프로젝트 수는 무제한입니다. 이게 핵심이에요. 블로그 5개든 10개든 프로젝트 자체를 만드는 건 자유입니다. 단, 대역폭과 빌드 시간이 모든 프로젝트 합산이라는 점만 주의하면 됩니다.
제 경우 블로그 5개의 월 트래픽을 합치면 대략 15GB 정도입니다. 100GB 한도의 15%밖에 안 쓰고 있으니 여유가 넉넉합니다.
프로젝트 구조: 모노레포 vs 개별 레포
처음에는 모노레포(Turborepo)로 5개를 한 레포에 넣으려 했습니다. 하지만 실제로 해보니 개별 레포가 훨씬 편했습니다. 이유는:
- 빌드 트리거: 모노레포에서는 하나의 블로그 수정이 전체 빌드를 트리거할 수 있음
- 의존성 충돌: 블로그마다 쓰는 MDX 플러그인 버전이 다를 수 있음
- 배포 독립성: 하나가 빌드 실패해도 나머지는 영향 없음
그래서 최종 구조는 이렇습니다:
GitHub
├── blog-tech (기술 블로그)
├── blog-life (일상 블로그)
├── blog-portfolio (포트폴리오)
├── blog-project-a (프로젝트 A 소개)
└── blog-project-b (프로젝트 B 소개)
각 레포는 동일한 Next.js 보일러플레이트를 기반으로 하되, 테마와 콘텐츠만 다릅니다. 보일러플레이트는 GitHub 템플릿 레포로 만들어두면 새 블로그 생성이 5분 컷입니다.
커스텀 도메인 설정 실전
Vercel에서 커스텀 도메인을 연결하는 건 정말 간단합니다. 하지만 5개를 운영하면서 알게 된 팁이 있습니다.
서브도메인 활용
도메인을 5개 사는 건 비효율적입니다. 저는 메인 도메인 하나에 서브도메인을 활용합니다:
bric.pe.kr → 메인 블로그
tech.bric.pe.kr → 기술 블로그
lab.bric.pe.kr → 실험 프로젝트
DNS 설정에서 CNAME 레코드를 cname.vercel-dns.com으로 잡아주면 끝입니다. SSL은 Vercel이 자동으로 Let's Encrypt 인증서를 발급해줍니다. 이게 WordPress 시절 certbot 돌리며 고생하던 것과 비교하면 천지 차이입니다.
빌드 최적화: 6,000분을 아끼는 법
5개 블로그를 운영하면 빌드 시간 관리가 중요합니다. 제가 쓰는 전략:
1. ISR(Incremental Static Regeneration) 활용
export const revalidate = 3600; // 1시간마다 재검증
전체 빌드 대신 ISR을 쓰면 변경된 페이지만 재생성됩니다. 빌드 시간이 체감 70% 줄었습니다.
2. 이미지 최적화
Next.js의 next/image를 쓰되, 외부 이미지는 Cloudinary 무료 티어를 활용합니다. Vercel의 Image Optimization 크레딧을 아낄 수 있습니다.
3. 불필요한 빌드 방지
vercel.json에서 특정 파일 변경 시에만 빌드되도록 설정:
{
"git": {
"deploymentEnabled": {
"main": true
}
},
"ignoreCommand": "git diff --quiet HEAD^ HEAD -- content/"
}
README만 수정했는데 빌드가 도는 걸 방지할 수 있습니다.
실제 운영 비용 정리
| 항목 | WordPress 시절 | Vercel 현재 |
|---|---|---|
| 호스팅 | 월 25,000원 | 0원 |
| 도메인 | 연 15,000원 | 연 15,000원 |
| SSL | 무료(수동) | 자동 무료 |
| CDN | 별도 설정 필요 | 기본 포함 |
| 월 총비용 | ~26,250원 | ~1,250원 |
연간으로 따지면 30만 원 절약입니다. 블로그 5개 기준으로요.
주의할 점
솔직히 Vercel Hobby 플랜이 만능은 아닙니다:
- 상업적 용도 불가: Hobby 플랜은 개인/비상업 프로젝트 전용입니다. 블로그에 광고를 붙이기 시작하면 Pro 플랜(월 $20)으로 업그레이드해야 합니다.
- 팀 협업 제한: 1인 프로젝트만 가능합니다.
- Edge Function 제한: 무료 플랜에서는 Edge Middleware 실행 시간이 제한적입니다.
이런 제한이 신경 쓰인다면 Cloudflare Pages도 좋은 대안입니다. 하지만 Next.js와의 궁합은 역시 Vercel이 최고입니다.
마무리: 시작이 반이다
블로그를 "시작"하는 게 가장 어렵습니다. 호스팅 비용 걱정, 서버 관리 부담을 핑계로 미루지 마세요. Vercel + Next.js 조합이면 5분 만에 블로그가 배포됩니다.
저처럼 여러 주제로 블로그를 나눠 운영하고 싶다면, 이 조합이 현재로선 최고의 선택이라고 자신 있게 말할 수 있습니다.
관련해서 제가 운영하는 다른 사이트들도 참고해보세요:
- SysoftI — 시스템 통합 및 IT 컨설팅
- SBM Lab — 시스템 생물학 연구 플랫폼
- GenoBalance — 유전체 균형 분석 서비스
- KBrain Map — 한국 뇌지도 프로젝트
참고 링크: