모든 것은 내 마음대로

pegboard.me

요즘 작은 개인 프로젝트로 pegboard.me 라는 사이트를 만들고 있다. 한 페이지에 도구 하나씩, 작은 유틸리티 페이지를 100여 개 모으는 정적 웹사이트다.

이게 새삼스러운 형태도 아니고 굳이 블로그에 쓸 일은 아니라 생각했는데, 막상 진행하면서 "100여 개의 페이지를 한 사람이 운영한다" 라는 전제가 거의 모든 결정을 끌고 다닌다는 걸 느꼈다. 그래서 만든 동기부터 차근차근 정리해두려고 한다.

왜 만들기로 했나

솔직하게 적으면 — 수익이 조금이라도 나는 개인 프로젝트를 하나 가지고 있고 싶었다.

회사 일과 별개로 내가 결정 권한을 100% 갖는 무언가가 있으면 좋겠다는 생각은 오래됐다. 토이 프로젝트는 몇 개 만들어봤는데 결국 내가 다시 들어가서 쓰지 않는 사이트로 끝났다. 그게 나쁜 건 아니지만, 어차피 시간을 쓸 거면 작더라도 자생하는 프로젝트 가 더 매력적으로 느껴졌다.

자생한다 = 수익이 있다. 그런데 결제 상품을 받는 사이트는 운영 부담이 크고 (CS, 환불, 결제 이슈, 세무), 구독은 사용자가 이탈하면 끝이다. 가장 결이 맞는 모델이 디스플레이 광고 였다.

• 사용자가 결제하지 않고 잠깐 들렀다 나가도 광고 노출만으로 수익이 발생
• 운영 부담이 작음 (광고 네트워크가 알아서 굴린다)
• 트래픽이 늘면 비례해서 늘고, 안 늘면 안 늘 뿐 큰 손해는 없음

이미 널린 도구인데, 될까?

"이런 도구는 이미 널렸잖아? 그게 수익이 되겠어?"

맞는 말이고, 솔직히 나도 될지 모르겠다. 그런데

궁금하니까, 한번 해보지 뭐, 혹시 또 알어?

AI가 판치면서 아이디어까지 고갈나는 세상에, 가만히 있는 건 아닌것 같았다.

그냥 무작정 하나 저질러보고 싶었다.

그리고 — 다들 말하는 그 광고비 라는 게 실제로 얼마나 벌리는지도 내 손으로 한번 확인해보고 싶었다.(안들어오면 0이겠지만..)

Pegboard = 타공판

브랜드명 Pegboard 는 영어 단어인데, 한국어로 가장 가까운 게 타공판 이다. 공방이나 차고 벽에 망치·드라이버·렌치를 한 줄로 걸어두는 그 구멍 뚫린 판자.

이름을 이렇게 지은 건 단순하다. 도구를 하나 만들 때마다 빈 타공판에 페그를 하나씩 걸어 채워간다 — 그 느낌이 좋았다.

한 도구 = 한 페그(peg).

도구마다 페이지가 하나씩 있고, 사용자는 벽에서 도구를 꺼내듯 페이지를 연다.

빈 칸이 하나씩 메워지는 걸 보는 재미는 덤이다.

서버비를 0에 가깝게 — 정적 사이트(SSG)

운영비 얘기를 짚고 가야 한다.

광고 수익이라는 모델은 수익이 트래픽에 비례 하는 형태인데, 비용은 정해져 있다. 트래픽이 작은데 서버비가 매월 몇만 원 빠지면, 이 프로젝트는 시작도 전에 적자 다. 그래서 비용 = 0에 수렴해야 한다.

답은 정적 사이트 생성(SSG, Static Site Generation) 이다. SSG는 사이트를 빌드 타임에 미리 HTML/JS/CSS 파일로 만들어두고, 런타임에는 그걸 그냥 서빙만 하는 방식이다. 런타임에 백엔드 서버가 없다.

• 사용자 요청이 들어오면 정적 호스팅이 미리 만들어둔 HTML을 그대로 응답
• 데이터베이스 X, API 서버 X, 미들웨어 X
• 호스팅 비용은 대역폭 + 빌드 시간 만큼만 — 무료 티어로 충분한 호스팅이 많음

문제는 서버가 없다는 게 단순히 "쉬워졌다" 가 아니라는 것이다. 모든 변환 로직이 사용자 브라우저에서 직접 돌아야 한다. 이게 나중에 위험한 함정을 하나 만드는데, 거기서 한 번 크게 깨졌다.

호스팅 — Vercel 이 아니라 Cloudflare Pages 인 이유

Next.js 사이트의 가장 흔한 호스팅 선택은 Vercel 이다. Next.js 를 만든 회사가 운영하니까. 무료 Hobby 플랜이 있고, 사용 경험이 좋다.

그런데 무료 Hobby 플랜에는 치명적인 제약 이 있다. 광고를 달면 안 된다.

Hobby teams are restricted to non-commercial personal use only ... The inclusion of advertisements, including but not limited to online advertising platforms like Google AdSense, is explicitly listed as an example of prohibited commercial use on the Hobby plan.

— Vercel Fair Use Guidelines

요약하면 — Vercel Hobby 플랜은 개인 비상업적 용도 전용이고, 광고를 통한 수익 은 명시적으로 상업적 사용 에 해당한다. 합법적으로 광고를 달려면 Pro 플랜으로 올라가야 하는데, 개발자당 월 $20 이다 (2026년 기준).

내 프로젝트의 핵심은 비용을 0에 가깝게 였다. 그러니 Vercel은 자동 탈락. 대신 Cloudflare Pages 를 골랐다.

Cloudflare Pages 도 함정이 하나 있다. 단일 자산(파일)은 25 MiB 까지 — 이게 나중에 ffmpeg.wasm 같은 큰 바이너리를 self-host 하려고 할 때 문제가 된다. 다만 광고 정책 vs 단일 파일 크기 한계 — 둘 중에 내가 협상할 수 있는 쪽 은 후자였다. 광고는 정책이라 협상 불가, 파일 크기는 압축으로 우회 가능.

다국어 — 7개 로케일을 처음부터

다음 결정은 어떤 언어로 사이트를 운영하느냐. 답은 7개 언어를 처음부터 였다.

• en — 영어 (베이스)
• ko — 한국어 (내 모국어)
• ja — 일본어
• zh-Hans / zh-Hant — 중국어 간체 / 번체
• fr — 프랑스어
• es — 스페인어

이유는 두 가지다.

1. 검색 트래픽의 형태. 도구류 검색은 의외로 영어가 압도적이지 않다. "json formatter" 도 검색되지만, "json 포매터", "json 美化", "json 整形", "formateador de json" 도 다 검색된다. 그리고 검색 엔진은 각 언어로 정확히 쓰여진 페이지 를 그 언어 검색 결과 상위에 띄운다. 영어 페이지를 자동 번역한 사이트는 어느 언어 검색 결과에서도 약하다.

2. 100여 개 페이지가 한 언어 안에만 갇히는 위험. 사이트를 영어로만 운영하면, 100여 개를 다 만들어 놓고 "이제 한국어/일본어 추가하자" 하는 순간 기존 100개 × 다른 언어 수 만큼의 번역 작업이 한꺼번에 쌓인다. 시작할 때 7개 언어를 깔아두면, 새 도구 하나 추가할 때마다 7개 언어 키만 같이 만들면 된다. 누적 부담의 평탄화.

이걸 가능하게 해주는 게 next-intl 이다. 로케일별 메시지 파일을 두고, 라우트마다 자동으로 언어가 갈라진다.

messages/
├── en.json
├── ko.json
├── ja.json
├── zh-Hans.json
├── zh-Hant.json
├── fr.json
└── es.json

각 파일은 동일한 키 구조 를 유지해야 하고, 새 도구 페이지가 추가될 때마다 7개 파일을 모두 갱신해야 한다. 이걸 사람이 손으로 하면 반드시 누락이 생긴다. 그래서 자동화 워크플로를 따로 만들어 굴린다.

기술 스택

여기까지의 결정을 종합해서 스택을 정했다.

Sources / 참고:

• Vercel Fair Use Guidelines — Hobby 플랜의 광고/상업적 사용 정책
• Vercel Hobby Plan — 무료 플랜 한도
• Cloudflare Pages — 호스팅 (무료 + 광고 허용)
• next-intl — Next.js 다국어 라이브러리
• shadcn/ui — 컴포넌트 라이브러리