SEO Jing
엄청난 피드백.
CLI 코드 리뷰에서 받은 피드백과 전체 코드 수정 계획을 정리했다.
SEO Jing
생각보다 어려웠던 댓글, 완독 로컬스토리지.
localStorage만으로 글 읽기 추적, 스크롤 진행률, 댓글 감지를 구현한 과정을 정리했다.
증상: 스토리북에서는 A2z/Paperlogy 폰트 정상인데, Next.js 메인 페이지에서는 폰트가 안 먹힘.
globals.css의 @theme에서 --font-sans: "A2z", var(--font-geist-sans), ...로 정의했는데, --font-geist-sans가 실제로 정의되지 않아서 CSS 변수 체인
전체가 실패 - body에 font-family: var(--font-sans)를 수동으로 지정했는데,
Tailwind v4는 @theme의 --font-sans를 html에 자동 매핑하므로 불필요 +
레이어 우선순위 충돌--font-sans에서 var(--font-geist-sans) 참조 제거 - body의
font-family 줄 제거증상: Hydration failed 에러, 서버는 / 클라이언트는
/frontend
원인: useState(getPathFromUrl) 초기값 함수에서 typeof window === "undefined" 분기로 서버/클라이언트 초기값이 다름.
수정: useState("/")로 고정하고, useEffect에서 마운트 후
URL 동기화.
Post Q&A
폰트는 왜 메인 페이지에서만 적용이 안되고 있었을까? 전체를 기준으로 질문과 피드백을 받아요.답을 본 뒤에는 이 내용을 댓글로 달아서 서징에게도 물어볼 수 있어요. 작성자가 직접 볼 수 있어요!
localStorage만으로 글 읽기 추적, 스크롤 진행률, 댓글 감지를 구현한 과정을 정리했다.