Fumadocs 문서에 커스텀 배지 추가하여 최신 콘텐츠 강조하기

🤖 AI 추천

Fumadocs를 사용하여 문서를 관리하는 개발자 및 기술 작성자에게 유용합니다. 특히, 새로 추가되거나 업데이트된 문서를 시각적으로 강조하여 사용자에게 더 나은 경험을 제공하고자 하는 경우 도움이 될 것입니다.

🔖 주요 키워드

Fumadocs 문서에 커스텀 배지 추가하여 최신 콘텐츠 강조하기

핵심 기술: Fumadocs 문서에 커스텀 배지를 추가하여 최신 콘텐츠를 시각적으로 강조하는 방법을 설명합니다. 이를 위해 frontmatter 스키마를 확장하고, source.ts 파일에서 페이지 트리에 배지 정보를 연결하는 과정을 보여줍니다.

기술적 세부사항:
* frontmatter 스키마 확장: source.config.ts 파일에서 frontmatterSchema를 확장하여 new와 같은 커스텀 boolean 속성을 추가합니다.
* source.tsx 설정: lib/source.ts 파일을 lib/source.tsx로 변경하고, loader 함수 내 pageTree.attachFile 콜백을 사용하여 파일 데이터에서 new 속성을 읽어와 노드 이름에 배지를 추가합니다.
* frontmatter 적용: 문서의 YAML frontmatter에 new: true와 같이 커스텀 속성을 추가하여 배지가 표시되도록 합니다.
* 코드 예제: 스키마 확장, attachFile 함수 구현, frontmatter 적용 예시 등 구체적인 TypeScript 코드 스니펫을 제공합니다.

개발 임팩트: 새롭게 추가된 문서를 사용자에게 명확하게 인지시킴으로써 사용자 경험(UX)을 개선하고, 문서의 최신성을 효과적으로 전달할 수 있습니다. 이는 문서의 활용도를 높이는 데 기여합니다.

커뮤니티 반응: 별도의 커뮤니티 반응 언급은 없습니다.

📚 관련 자료