간판업체 웹사이트를
엣지에서 통째로.
프레임워크도 빌드도 없이, Cloudflare Workers 하나로 프론트·백엔드·DB·CMS·인프라·SEO까지 1인 풀스택으로 지은 첫 클라이언트 납품작.
인디사인.kr 홈
// the brief
"간판만 하는 곳"이라는 좁은 인상.
인디사인은 송파에서 30년 된 간판업체지만, 실제로는 채널간판·아파트 외벽사인·구조물·디지털 사이니지·상업인테리어까지 통째로 시공하는 종합업체다. 문제는 온라인에 그 폭이 전혀 드러나지 않는다는 것. 그리고 콘텐츠(시공사례·후기)를 계속 채워야 하는데, 사장님은 비개발자라 개발자 손을 매번 빌릴 수 없었다.
그래서 목표가 둘로 좁혀졌다. 종합시공 업체로 재포지셔닝되는 사이트, 그리고 사장님이 직접 운영할 수 있는 구조.
// approach
프레임워크도 빌드도 없이, 엣지에서 바로.
Astro도 Next도 쓰지 않았다. 순수 JavaScript로 Cloudflare Workers 위에서 서버리스 SSR. 빌드 스텝도, node_modules도, package.json도 없이 엣지에서 직접 HTML을 그린다. 운영이 단순하고, 빠르고, 비용이 거의 들지 않는다.
D1(DB)·R2(이미지)·Email을 프레임워크 추상화 없이 엣지에서 직접 다뤘다. 3,224줄의 JS·CSS는 프레임워크가 찍어낸 코드가 아니라, 전부 이 사이트에 맞춰 설계한 것.
// key decisions
실력이 갈리는 세 가지 결정.
비개발자용 자체 CMS
사장님이 시공사례·후기·회사정보·서비스 소개를 직접 편집한다. 큰 폰트, 한글 워드브레이크 처리, 그리고 AI 자동 글작성(Gemini)으로 사진만 올려도 소개 문구가 나오게 했다. 시공사례는 기존 블로그 글 117건을 옮겨 시작했다. 사장님이 넘긴 현장 사진을 일괄 등록해 246건까지 늘었다.
캐시를 뚫는 자체 방문 통계
엣지 캐시가 걸리면 렌더 단계에서 세는 방식으로는 방문이 빠진다. 비콘 방식으로 캐시 HIT에서도 집계되게 만들고, 개인정보는 저장하지 않는다. 사장님이 유입을 눈으로 볼 수 있게 했다.
엣지 이미지 파이프라인 + 캐시 무효화
R2에 원본과 함께 WebP·AVIF 변형을 저장해 두고, 요청의 Accept 헤더에 맞는 형식을 골라 엣지에 캐시한다. 콘텐츠가 바뀌면 버전 토큰으로 캐시를 정확히 무효화한다. 빠르면서도 항상 최신이다.
보안도 엣지에서 직접 챙겼다. 문의·로그인에 레이트 리밋(문의 3회/60초·로그인 5회/60초)을 걸고, 인증은 HMAC 서명 쿠키로. 견적 문의가 들어오면 Cloudflare Email로 사장님 메일에 자동 발송된다.
// seo
검색에 잡히게, 끝까지.
지역 업체는 검색 유입이 곧 매출이다. 그래서 SEO를 장식이 아니라 기능으로 넣었다. LocalBusiness·FAQPage·Article 구조화 데이터로 검색 결과를 풍부하게, RSS·IndexNow·사이트맵으로 색인을 빠르게, 그리고 구글 서치 콘솔 API를 연동한 대시보드로 유입을 직접 본다.
// result
지금도 운영 중인 상용 사이트.
데모가 아니라 사장님이 직접 굴리는 실제 사이트다. 검색 색인과 문의 유입이 발생하고 있고, 새 콘텐츠는 CMS로 직접 올릴 수 있다.
// 이런 걸 만들어 드립니다.