
3월 11일, Vercel에서 메일이 왔다.
"Your project has used 75% of the included Edge Requests."
이틀 뒤인 3월 13일, 또 왔다.
"Your project has used 100% of the included Edge Requests."
Vercel 무료 플랜은 월 100만 요청이 한도다. 넘으면 사이트가 통째로 꺼진다.
GeekNews에 올린 글이 터지면서 일주일 만에 PV 6만을 넘겼는데, 그게 한도를 잡아먹은 거다.
수익이 없는 프로젝트에 월 $20은 부담이다. 두 번째를 골랐다.
Cloudflare Pages는 요청 수 제한이 없다. 무료다.
같은 GitHub 저장소를 두 곳에서 동시에 가져가는 구조다.
GitHub (소스)
│ push
├──→ Vercel (자동 빌드 + 배포)
└──→ Cloudflare (자동 빌드 + 배포)
git push 한 번이면 둘 다 자동으로 빌드된다. 충돌 없다 — 각자 독립적으로 빌드하니까.
주소가 두 개 생긴다:
claude-code-playbook.pages.dev (Cloudflare)claude-code-playbook-nu.vercel.app (Vercel)한 쪽이 꺼져도 다른 쪽이 살아있다.
연결도 간단하다. Cloudflare 대시보드에서 GitHub 저장소 연결하고, 빌드 명령만 넣으면 끝이다. 10분이면 된다.
이중화 자체는 쉬웠다. 문제는 검색엔진이었다.
같은 콘텐츠가 두 개 주소에 있으면, Google은 혼란스러워한다.
"어디가 원본이지?"
이걸 알려주는 게 canonical(캐노니컬)이다. "이 URL이 정본이다"라는 선언.
같은 글이 두 곳에 있다
pages.dev/docs/intro ← canonical (원본)
vercel.app/docs/intro ← 복사본
Google: "검색결과에 원본만 보여주자"
canonical을 안 잡아주면 Google이 둘 중 아무거나 골라서 보여준다. 최악의 경우 두 주소가 서로 경쟁해서 둘 다 순위가 떨어진다.
Docusaurus 기준으로는 설정 파일에서 url 하나만 바꾸면 된다.
url: 'https://claude-code-playbook.pages.dev'
이 한 줄이 사이트 전체의 정본 주소를 결정한다. sitemap, 검색엔진용 태그, 소셜 공유 링크가 전부 이 주소 기준으로 생성된다.
Vercel에서 빌드해도, Cloudflare에서 빌드해도, 소스가 같으니까 결과물도 같다. 양쪽 다 pages.dev를 원본으로 가리킨다.
Cloudflare (pages.dev) → "나는 원본이다" ★
Vercel (vercel.app) → "원본은 pages.dev다"
Google은 이걸 보고 pages.dev만 검색결과에 띄운다.
| Vercel 무료 | Cloudflare Pages | |
|---|---|---|
| 요청 한도 | 월 100만 | 무제한 |
| 초과 시 | 사이트 정지 | 없음 |
| 대역폭 | 월 100GB | 무제한 |
| 커스텀 도메인 | 가능 | 가능 |
| 비용 | $0 (Pro $20/월) | $0 |
둘 다 무료인데 Cloudflare가 요청 제한이 없다. 대신 빌드 횟수 제한(월 500회)이 있지만, 하루에 16번 배포해야 닿는 수치라 현실적으로 문제없다.
트래픽이 문제면, 좋은 문제다. 그걸 해결하는 데 돈은 안 든다.
이 글은 Claude Code 플레이북을 만들면서 배운 것을 비개발자 시점으로 정리한 시리즈입니다.