[고도화] SEO 분석 패널 · 자동 태그 제안 · 발행 히스토리 개선

오늘은 어드민 패널의 콘텐츠 품질 관련 기능 세 가지를 집중적으로 개선했다. SEO 점수를 실시간으로 확인할 수 있는 분석 패널, AI 기반 해시태그 자동 제안, 그리고 발행 이력을 좀 더 편리하게 탐색할 수 있는 필터·페이지네이션까지 — 모두 블로그 운영 효율을 높이기 위한 작업이다.

---

1. SEO 분석 패널 (실시간)

미리보기 페이지(/admin/preview/[id])에 SEO 분석 패널을 추가했다. 글을 작성하면서 즉각적으로 SEO 점수(0~100점)와 세부 체크 항목을 확인할 수 있다.

점수 구성 (7개 항목)

• 제목 길이 20~60자 유지 → 20pt
• 요약 50~160자 → 20pt
• 본문 300자 이상 (700자 이상 만점) → 20pt
• H2 헤딩 1개 이상 포함 → 15pt
• 썸네일 이미지 설정 여부 → 10pt
• 슬러그 형식 (영숫자·하이픈) 유효성 → 5pt
• 키워드 밀도 0.5~3% (선택 입력 시) → 10pt 점수는 70점 이상 초록, 50점 이상 노랑, 미만 빨강으로 색상이 구분되며, 키워드를 입력하지 않은 경우 90점 만점을 100점으로 정규화해 표시한다. 예상 독서 시간과 단어 수도 함께 보여줘 가독성 파악에 도움을 준다.

핵심 파일: lib/seo-utils.ts (순수 유틸), components/admin/SeoAnalysisPanel.tsx (UI 컴포넌트)

---

2. AI 자동 태그 제안

미리보기 페이지 메타데이터 카드에 'AI 태그 제안' 버튼을 추가했다. 버튼을 누르면 제목·요약·본문을 OpenAI gpt-4o-mini에 전달해 SEO와 소셜 공유에 적합한 한국어 해시태그 5~10개를 자동으로 생성한다.

주요 동작

1. POST /api/blog/suggest-tags 호출 → 어드민 세션 인증 후 AI에 프롬프트 전달
2. 응답 JSON 배열에서 '#' 기호를 제거한 태그 칩(chip) UI로 표시
3. 개별 X 버튼으로 불필요한 태그 제거 가능
4. '본문 하단에 삽입' 버튼으로 에디터 본문 끝에 #태그 문자열 자동 추가 API 호출은 withRetry()로 감싸 5xx·429·타임아웃 오류 시 최대 3회 재시도한다. 본문은 마크다운을 제거한 순수 텍스트 최대 3,000자만 AI에 전달해 비용을 절감했다.

---

3. 발행 히스토리 개선

/admin/posts 페이지는 기존에 단순 목록과 제목 검색만 제공했다. 게시물이 쌓일수록 탐색이 불편해지는 문제를 해결하기 위해 아래 기능을 추가했다.

추가된 기능

• 언어 필터 (전체 / 한국어 KO / 영어 EN): 로케일별 분리 확인
• 기간 필터 (전체 / 최근 1개월 / 3개월 / 6개월 / 1년): 날짜 범위 좁히기
• 페이지네이션 (20건/페이지): 대량 게시물에서 쾌적한 탐색
• 헤더 KO/EN 카운트 표시: 현재 필터 결과에서 각 언어 건수 실시간 확인
• '블로그에서 보기' 버튼: ExternalLink 아이콘, 새 탭으로 실제 블로그 포스트 바로 열기 모든 필터링과 페이지네이션은 클라이언트에서 useMemo로 처리해 API 요청을 추가하지 않았다. 필터 변경 시 페이지 번호는 자동으로 1로 리셋된다.

---

마무리

세 기능 모두 기존 아키텍처(Next.js App Router, Notion CMS, shadcn/ui)와 자연스럽게 통합됐다. 외부 라이브러리 추가 없이 Date 내장 API로 기간 필터를 구현한 점, AI 태그 제안에서 마크다운 정제 후 3,000자 제한으로 토큰 비용을 관리한 점이 작은 포인트였다.

다음 단계로는 SEO 분석 결과를 Notion 게시물 메타데이터에 자동 저장하거나, 태그 히스토리를 누적해 자주 쓰는 태그를 추천하는 기능을 고려해볼 수 있다.