재하의 개발 블로그

TIL 2026년 3월 22일 5분 소요

Mermaid 렌더링 안 되는 문제 — allowDangerousHtml 설정

Supabase 블로그 게시글의 Mermaid 다이어그램이 렌더링되지 않는 문제를 발견했다. remarkRehype의 allowDangerousHtml 설정이 false로 되어 있어 HTML 노드가 제거되고 있었다.

mermaid remark rehype markdown troubleshooting

회고 2026년 3월 22일 13분 소요

블로그 개발일지 #7 — ISR과 Edge Function으로 실시간 배포 구현

Supabase에 게시글을 올리면 자동으로 사이트에 반영되는 시스템을 만들었다. Webhook payload 커스터마이즈 제약을 Edge Function으로 우회해서, 전체 재배포 없이 변경된 페이지만 재생성한다.

vercel isr supabase edge-function webhook astro

회고 2026년 3월 22일 21분 소요

블로그 개발일지 #6 — rehype-pretty-code로 코드 블록 업그레이드

기본 Shiki 하이라이팅에서 rehype-pretty-code로 전환하여 라인 번호, 라인 하이라이트, diff 표시, 복사 버튼, 언어 라벨까지 모든 기능을 갖춘 코드 블록을 구현한 과정. 정규식 패턴 설계부터 CSS 변수 기반 스타일링, 클라이언트 스크립트까지 — 3시간의 업그레이드 기록.

astro rehype-pretty-code shiki code-highlighting ux

회고 2026년 3월 21일 5분 소요