feat: 생성되는 마크다운을 git-style 링크로 감싸도록 변경

[anonymousRecords]

변경 사항

생성되는 마크다운 스니펫을 링크로 감싸도록 변경했습니다.

- ![GitStyle](https://git-style.vercel.app/api/USER/animation?...)
+ [![GitStyle](https://git-style.vercel.app/api/USER/animation?...)](https://git-style.vercel.app)

왜 필요한가

GitHub은 링크 없는 마크다운 이미지를 렌더링할 때 camo 프록시 URL을 가리키는 <a>로 자동으로 감쌉니다. 그 결과 사용자가 프로필에 붙인 배지를 클릭하면 프록시된 원본 PNG로 이동합니다.

GitHub Markdown API로 두 형태를 렌더링해 확인한 결과:

입력	생성되는 <a href>
	https://camo.githubusercontent.com/8d83... ← 현재
[](target)	target ← 명시한 링크가 보존됨

이 도구를 쓰는 모든 사용자가 동일하게 영향을 받고 있어 생성부에서 고치는 것이 맞다고 판단했습니다.

링크 타깃: https://git-style.vercel.app. 배지를 본 사람이 "나도 만들래"가 되는 지점이 서비스 페이지이므로, 유입에서 생성까지 한 번에 이어집니다.

구조 변경

마크다운 조립 로직이 PreviewCard 컴포넌트 본문에 인라인으로 있어 외부에서 검증할 수 없었습니다. 순수 함수로 lib/utils/markdown.ts에 추출한 뒤 동작을 변경했습니다. 테스트를 쓰기 위한 최소 조건이며, PreviewCard는 오히려 짧아졌습니다.

• buildAnimationPath() — 쿼리스트링 생성 (규칙 변경 없음)
• buildMarkdown() — 마크다운 스니펫 생성 (이번 변경 지점)

변경 유형

• 버그 수정 (기존 기능을 수정하는 non-breaking change)
• 새 기능 (기존 기능을 유지하면서 추가되는 non-breaking change)
• Breaking change (기존 기능에 영향을 주는 변경)
• 문서 업데이트

관련 이슈

없음

테스트 방법

테스트 프레임워크가 없어 검증 스크립트로 확인했습니다. 추출만 먼저 하고 실패를 확인한 뒤 동작을 변경했습니다 — 경로 3건이 통과한 것이 추출이 기존 동작을 정확히 보존했다는 증거입니다.

RED   ok   flower: 기본값 경로
      ok   flower: 타입과 색상 반영
      ok   hair: 색상과 곱슬기 반영
      FAIL markdown: 이미지가 SITE_URL 링크로 감싸진다
      FAIL markdown: hair 테마도 동일하게 감싸진다

GREEN 5건 전부 통과

로컬 dev 서버에서 실제 UI 확인 (username octocat):

[![GitStyle](https://git-style.vercel.app/api/octocat/animation?theme=flower&quality=low&flower=default&color=%23fbbf24)](https://git-style.vercel.app)

API 회귀 확인 — 생성된 경로가 그대로 200을 반환합니다:

경로	결과
?theme=flower&quality=low&flower=default	200 image/png
?theme=hair&quality=low&curliness=wavy	200 image/png

체크리스트

• 코드가 프로젝트 스타일 가이드를 따름
• 셀프 코드 리뷰 완료
• 필요한 경우 문서 업데이트
• pnpm lint 통과 (49개 파일)
• pnpm build 통과 (exit 0)

스크린샷 (UI 변경 시)

변경 전	변경 후
 — 클릭 시 camo 프록시로 이동	[](https://git-style.vercel.app) — 클릭 시 서비스로 이동

README.md의 예시 이미지들도 같은 camo 동작을 갖지만, 도구가 뱉는 출력과는 성격이 다른 문서 수정이라 이 PR에 포함하지 않았습니다.

🤖 Generated with Claude Code

https://claude.ai/code/session_01La1oXcrwEZycnLJGdkFn3y

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
git-style	Ready	Preview	Aug 29, 2026 8:56am