프론트엔드 개발자 엄성준 블로그

  • 홈
  • 태그

react-helmet 1

React SPA에서 메타 태그 중복 문제, 라이브러리 제작으로 해결하기 (feat. react-head-safe)

안녕하세요, 프론트엔드 개발자 엄성준입니다. React 기반 SPA 환경에서 SEO 최적화를 위해 react-helmet이나 react-helmet-async는 사실상 표준처럼 사용되어 왔습니다. 저 역시 개인 프로젝트와 사내 서비스에서 이 라이브러리들을 꾸준히 활용해 왔습니다. 하지만 실제 서비스 환경을 운영하며, index.html에 정의한 초기 메타 태그와 페이지 이동 시 동적으로 생성되는 메타 태그가 중복되는 문제를 발견했습니다. 이 글에서는 기존 라이브러리의 한계와 이를 해결하기 위해 직접 react-head-safe를 개발하게 된 과정을 공유합니다.1. SPA 환경에서 SEO가 여전히 까다로운 이유React SPA는 초기 로딩 시 서버로부터 빈 HTML(root div만 존재하는)을 전달받습니..

지식 정리 📝 2026.01.09
이전
1
다음
더보기
프로필사진

꾸준함을 강점으로 삼고 있는 프론트엔드 개발자 엄성준 블로그입니다.

250x250
  • 카테고리 📂 (396)
    • 코딩 테스트 풀이 🛠 (232)
    • 지식 정리 📝 (92)
    • zero-base 프론트엔드 스쿨 ⛪️ (20)
    • 3월 협업 프로젝트(1석 4조) 👨‍👩‍👧‍👦 (19)

Tag

프론트엔드 개발자, autowini, react, forEach(), 제로베이스 프론트엔드 스쿨, join(), 프론트엔드 개발자 엄성준, String(), Number(), split(), 프론트엔드 스쿨, next.js, WiniLogis, 제로베이스, 프론트엔드, 오토위니, 엄성준, exceljs, sort(), 프로그래머스,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

방문자수Total

  • Today :
  • Yesterday :

꾸준함이 강점이자 자랑인 프론트엔드 개발자 엄성준 입니다.

  • Github
  • 📷 Instar
  • 🎨Portfolio

티스토리툴바