EN 모드에서 시리즈명이 한국어 그대로 — SERIES_MAP 이중 관리의 함정
SERIES_MAP을 두 군데서 따로 관리하다 한 쪽을 빠뜨렸다.
증상
Archive 페이지를 EN 모드로 전환했더니 시리즈 목록에 이런 게 보였다.
- Prompt Guide ✅
- SQL Mastery ✅
- GA4 완전 정복 ← 이것만 한국어
뭔가 이상하다 싶었다. GA4 시리즈는 분명히 번역 스크립트를 돌렸는데.
원인
알고 보니 SERIES_MAP이 프로젝트 안에 두 군데 따로 존재했다.
| 파일 | 역할 |
|---|---|
scripts/translate.ts | 번역 실행 시 .en.md frontmatter의 series 필드 값 결정 |
src/components/archive/BookArchive.tsx | UI에서 언어 전환 시 시리즈명을 한↔영 매핑 |
GA4 완전 정복 시리즈를 추가할 때 translate.ts에만 추가했다. 덕분에 .en.md 파일 안의 frontmatter에는 series: "GA4 Mastery"가 정상적으로 들어갔다.
문제는 BookArchive.tsx였다. 이 컴포넌트는 KO 포스트의 시리즈명(GA4 완전 정복)을 기준으로 EN 표시명을 찾는데, 자기 SERIES_MAP에 GA4 항목이 없으니 그냥 한국어 원문을 그대로 노출했다.
번역 스크립트에도 오류가 있었다
시리즈명 문제 이전에, 번역 스크립트 자체에도 버그가 있었다.
gray-matter의 matter.stringify()로 frontmatter를 생성하는 방식을 쓰고 있었는데, 번역된 description에 콜론(:)이나 콤마(,)가 들어가면 YAML 따옴표 처리를 못해서 파일이 깨졌다.
# 따옴표 없이 생성되어 YAML 파싱 오류 발생
description: From data collection, to reports: a complete guide
이걸 해결하려고 buildFrontmatter() 함수를 직접 만들었다. JSON.stringify()로 모든 문자열 필드를 강제로 따옴표 처리하도록 바꿨더니 더 이상 깨지지 않았다.
해결 및 관리 방법
당장의 수정은 간단했다. BookArchive.tsx의 SERIES_MAP에 GA4 항목을 추가하면 끝.
근본 문제는 같은 데이터를 두 군데서 따로 관리하는 구조 자체다. 언젠가는 하나의 상수 파일로 합치는 게 맞다. 지금은 새 시리즈를 추가할 때 두 파일을 반드시 동시에 업데이트하는 것으로 관리한다. CLAUDE.md에 명시해뒀다.
같은 데이터가 두 군데 있으면 반드시 한 쪽이 빠진다는걸 이번에 다시 깨달았다. 얼른 수정해봐야지...
