회고 21분 소요
블로그 개발일지 #6 — rehype-pretty-code로 코드 블록 업그레이드
기본 Shiki 하이라이팅에서 rehype-pretty-code로 전환하여 라인 번호, 라인 하이라이트, diff 표시, 복사 버튼, 언어 라벨까지 모든 기능을 갖춘 코드 블록을 구현한 과정. 정규식 패턴 설계부터 CSS 변수 기반 스타일링, 클라이언트 스크립트까지 — 3시간의 업그레이드 기록.
#code-highlighting
1 개의 글
IntersectionObserver ai alb animation api-gateway architecture astro aws backend blog bug-fix claude-code code-highlighting cost-tracking custom-elements db-design debugging decision-making developer-experience devops dx ecr ecs edge-function firelens flow-logs fluent-bit frontend gemini gfm-alerts git github grafana guestbook http-streaming hydration image-optimization infra islands-architecture isr json-rpc kakao-map llm logging loki lqip markdown mcp mdx mermaid mobile-first mobile-ux mongodb networking nextjs nodejs nvm private-endpoint privatelink protocol react regex rehype rehype-pretty-code remark remix requestIdleCallback retrospective scroll-snap serialization shiki side-project sse ssh subnet supabase tailwindcss tooling transport troubleshooting typescript user-feedback ux vercel vite volta vpc vpc-endpoint web-performance webhook webp wedding-invitation
아직 작성된 글이 없습니다