seo-masterlisted

# SEO Master Next.js App Router 프로젝트의 SEO 최적화 점검 스킬 --- ## Quick Checklist ### 새 페이지 생성 시 - [ ] metadata 또는 generateMetadata 설정 - [ ] Open Graph 이미지 (1200x630) - [ ] 페이지별 고유한 title, description - [ ] sitemap.ts에 페이지 추가 ### 배포 전 점검 - [ ] /sitemap.xml 접근 가능 - [ ] /robots.txt 접근 가능 - [ ] OG 이미지 미리보기 테스트 - [ ] Core Web Vitals (INP, LCP, CLS) 점수 확인 --- ## Workflow ### Step 1: 기본 설정 확인 ```bash # metadataBase 확인 grep -n "metadataBase" app/layout.tsx # sitemap, robots 존재 확인 ls app/sitemap.ts app/robots.ts 2>/dev/null ``` ### Step 2: OG 이미지 확인 ```bash # OG 이미지 파일 확인 ls public/og.png 2>/dev/null || ls app/opengraph-image.* 2>/dev/null # openGraph 설정 확인 grep -n "openGraph" app/layout.tsx ``` ### Step 3: 구조화 데이터 확인 ```bash # JSON-LD 사용 여부 grep -rn "application/ld+json" --include="*.tsx" | wc -l ``` ### Step 4: favicon 확인 ```bash ls app/icon.tsx public/favicon.ico 2>/dev/null ``` ### Step 5: I/O 및 캐싱 최적화 점검 SEO 성능에 직결되는 캐싱 전략을 확인합니다. **체크리스트:** - [ ] 데이터 페칭 시 `next: { revalidate }` 또는 `cache: 'force-cache'` 사용 - [ ] 불필요한 `cache: 'no-store'` 남용 여부 - [ ] On-Demand Revalidation (`revalidateTag`, `revalidatePath`) 구현 - [ ] 병렬 데이터 페칭 (`Promise.all`) 적용 - [ ] `loading.tsx` 및 `<Suspense>` 활용 ```bash # no-store 남용 확인 grep -rn "no-store\|force-dynamic" --include="*.tsx" --include="*.ts" | wc -l # loading.tsx 존재 확인 find app -name "loading.tsx" | wc -l # revalidate 설정 확인 grep -rn "revalidate" --include="*.tsx" --include="*.ts" | head -10 ``` ### Step 6: 고급 SEO 및 구조화 데이터 점검 리