GEO METRIC CARE

URL 하나를 넣으면 SEO·GEO를 진단해 PDF 리포트를 메일로 보내는 서비스.

담당

프론트엔드 · 분석 파이프라인 · 리포트 생성

팀

백엔드 1 · 프론트 1(본인)

기간

2026.03 – 2026.06

URL 입력부터 크롤링·분석·PDF 생성·메일 발송까지의 파이프라인을 프론트와 함께 만들었다. 외부 URL을 받아 서버에서 크롤링하는 구조라 SSRF 방어와 개인정보 암호화가 기능만큼 중요했다.

배포

스택

Next.js 15React 19TypeScriptNode 20PlaywrightVitestAWS

주요 작업

외부 URL을 받는 서비스의 방어선
- URL 형식 검증 → SSRF 가드(내부·사설·메타데이터 IP·비-HTTP 스킴 차단) → 필터 → rate limit → robots 확인 순으로 통과한 뒤에야 크롤링한다.
- 분석 결과에 찍히는 외부 IP는 가리고, 로그인 페이지를 감지하면 별도로 분기한다.
- 로그인 감지는 오차단 위험이 있어 본문 패턴 매치에 더해 짧은 본문·비밀번호 입력 존재·타이틀 중 하나를 추가로 요구하는 다중 신호 방식으로 바꾸고 회귀 테스트를 붙였다.
PDF 워터마크를 일곱 번 시도한 끝에
- SVG 경로는 Chromium PDF 래스터화에서 계속 깨졌다.
- 결국 HTML 텍스트 타일(600개 span을 CSS로 -30° 회전)로 전환했고, HMR로 즉시 확인할 수 있는 미리보기 라우트를 따로 만들어 시도 비용을 낮췄다.
SEO를 코드로 고정
- 사이트 상수 한 파일을 기준으로 robots·sitemap·코드 생성 OG 이미지·JSON-LD(Organization·WebSite)·페이지별 canonical·타이틀 템플릿을 전부 파생시켰다.
- 분석·미리보기·API 경로는 색인에서 제외했다.
웹폰트 self-host로 기기별 깨짐 해결
- next/font로 본문·제목 서체를 self-host해 기기마다 폰트와 굵기가 다르게 그려지던 문제를 잡았다.
- 알림은 공통 모달 프로바이더로 통일하고, 배경 스크롤 잠금은 참조 카운터 훅으로 중첩 상황까지 처리했다.