[chore] SEO 노출 개선 및 GA4·Vercel Analytics 연동

[You-Hyuk]

관련 이슈

Closes #140

---

변경 개요

"커밍" 검색 시 구글 등 검색엔진 노출을 개선하고, 사용자 수·트래픽·성능을 관측할 수 있는 분석 도구를 도입한다. index.html에 메타 설명·OG 태그가 없고 lang이 "en"으로 되어 있었으며, robots.txt/sitemap.xml도 없어 검색엔진이 서비스 맥락을 파악하기 어려운 상태였다.

변경사항

파일	변경 내용
index.html	title/description 구체화, OG·Twitter Card 태그 추가, lang="ko" 변경, 네이버 서치어드바이저 확인 태그 추가, CSP에 GA4·Vercel 도메인 허용
public/robots.txt	크롤링 허용 범위 명시 (관리자·마이페이지·인증 콜백 제외), sitemap 위치 명시
public/sitemap.xml	공개 라우트(홈/아티스트/공연/발매/캘린더/약관) 기준 sitemap 작성
src/utils/analytics.js	GA4 gtag 초기화 함수 (측정 ID 미설정 시 no-op)
src/main.jsx	부트스트랩 시점에 initGA 호출
src/App.jsx	Vercel Analytics·SpeedInsights 컴포넌트 추가
src/utils/structuredData.js	schema.org/Event JSON-LD 빌더 (공연 상태별 eventStatus 매핑, script 인젝션 방지 이스케이프)
src/pages/ConcertDetailPage.jsx	콘서트 상세 페이지에 Event 구조화 데이터 삽입
package.json / package-lock.json	@vercel/analytics, @vercel/speed-insights 의존성 추가
.env.example	VITE_GA_MEASUREMENT_ID 변수 추가

주요 구현 내용

• GA4는 VITE_GA_MEASUREMENT_ID 환경변수 미설정 시 아무 동작도 하지 않도록 가드 처리 (배포 환경별로 안전하게 on/off 가능)
• Event JSON-LD는 공연 상태(예정/진행/완료/취소)에 따라 eventStatus를 매핑하고, EXCLUDED 상태는 구조화 데이터를 생성하지 않음
• JSON-LD 문자열은 </script> 조기 종료를 통한 마크업 인젝션을 막기 위해 < 문자를 이스케이프
• CSP는 GA4·Vercel 스크립트 도메인만 최소 범위로 허용 (Vercel Analytics/Speed Insights는 프로덕션에서 동일 출처 라우트로 서빙되므로 추가 도메인은 로컬 개발 환경용)

---

테스트

• 로컬 실행 확인 (npm run lint, npm run build 통과)
• 단위 테스트 추가/수정 (프로젝트에 테스트 인프라 없음)
• 예외 케이스 확인 (GA 측정 ID 미설정 시 no-op, 공연 상태 EXCLUDED 시 JSON-LD 미생성)

리뷰어 참고사항

• 배포 후 Vercel 환경 변수에 VITE_GA_MEASUREMENT_ID 등록 필요 (코드에는 반영 완료, 실제 값은 대시보드에서 설정)
• 배포 후 Google Search Console에 sitemap 제출, 네이버 서치어드바이저 소유 확인 필요 (계정 작업, 코드와 무관)
• Google Rich Results Test로 콘서트 상세 페이지 구조화 데이터 검증 권장

---

코드 리뷰

변경사항 요약

SEO 메타 태그/robots/sitemap 정비, GA4·Vercel Analytics/Speed Insights 연동, 콘서트 상세 페이지 Event 구조화 데이터(JSON-LD) 추가. 총 11개 파일 변경, 신규 유틸 2개(analytics.js, structuredData.js) 추가.

---

검토 결과

🔵 suggestion

• public/sitemap.xml: lastmod 값이 고정 날짜(2026-08-10)로 하드코딩되어 있어 시간이 지나면 실제 갱신 시점과 무관하게 방치될 수 있음
  → 페이지 변경 빈도가 낮은 정적 라우트라 당장 문제는 아니지만, 추후 빌드 스크립트에서 자동 생성하는 방식으로 전환하면 유지보수 부담이 줄어듦
• index.html: og:url이 모든 라우트에서 홈 URL(https://comingg.com)로 고정되어 있어, 콘서트/아티스트 상세 페이지를 공유해도 OG 미리보기 URL은 홈으로 표시됨
  → SPA 특성상 페이지별 메타 태그 동적 삽입(react-helmet-async 등)이 필요한데 범위가 커서 이번 PR에서는 제외. 후속 이슈로 분리 권장

Summary by CodeRabbit

• New Features
  • Added Google Analytics, Vercel Analytics, and Speed Insights support.
  • Added enhanced concert event metadata for improved search and sharing previews.
  • Added SEO metadata, Open Graph, Twitter cards, sitemap, and crawler directives.
  • Updated the site language to Korean.
• Improvements
  • Expanded security permissions to support analytics services.
  • Analytics tracking remains optional and activates only when configured.

[coderabbitai]

Important

Review skipped

Review was skipped due to path filters

⛔ Files ignored due to path filters (1)

• package-lock.json is excluded by !**/package-lock.json

CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including **/dist/** will override the default block on the dist directory, by removing the pattern from both the lists.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Free

Run ID: ff82d3e3-8f87-4989-8ebc-edc36bc05938

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

The application adds optional Google Analytics 4 initialization, Vercel Analytics, Speed Insights, crawler metadata, social metadata, and concert event JSON-LD. The HTML language and Content Security Policy are also updated.

Changes

Web discovery and observability

Layer / File(s)	Summary
Analytics initialization and telemetry .env.example, src/utils/analytics.js, src/main.jsx, package.json, src/App.jsx, index.html	Google Analytics initializes only when a measurement ID is configured. Vercel Analytics and Speed Insights render in the root layout. The CSP allows the required analytics services.
Crawler and sharing metadata index.html, public/robots.txt, public/sitemap.xml	The document includes Korean, verification, Open Graph, and Twitter metadata. Crawler rules and sitemap entries describe the public site routes.
Concert event JSON-LD src/utils/structuredData.js, src/pages/ConcertDetailPage.jsx	Concert data maps to Schema.org event JSON-LD. Unsupported statuses return no data, and serialized JSON escapes < characters before rendering.

---

Note

🎁 Summarized by CodeRabbit Free

Your organization is on the Free plan. CodeRabbit will generate a high-level summary and a walkthrough for each pull request. For a comprehensive line-by-line review, please upgrade your subscription to CodeRabbit Pro by visiting https://app.coderabbit.ai/login.

_{Comment @coderabbitai help to get the list of available commands.}