Hun's DEV

블로그 따로, 포트폴리오 따로, 스토어 따로?

개발자 블로그는 Jekyll, 포트폴리오는 Notion, 제품 판매는 Gumroad... 플랫폼이 분산되면 관리가 힘들어집니다. 콘텐츠 하나 올리려면 세 군데를 돌아다녀야 하죠.

Hun's DEV는 이 문제를 해결합니다. 블로그 + 프로젝트 쇼케이스 + 스토어를 하나의 플랫폼으로 합쳤습니다. 글 쓰고, 프로젝트 소개하고, 제품 판매까지 — 한 곳에서.

왜 직접 만들었나요?

기존 방식	Hun's DEV
정적 사이트 생성기 (Markdown 편집)	Novel WYSIWYG 에디터 — 쓰면서 바로 보이는 편집
블로그·포트폴리오·스토어 각각 다른 플랫폼	하나의 플랫폼에서 모든 콘텐츠 관리
SEO 직접 세팅 (sitemap, OG 이미지 등)	동적 OG 이미지, RSS, sitemap 자동 생성
수동 캐시 관리	1시간 서버 캐싱 + 수정 시 즉시 무효화

플랫폼 구성

• 📝 블로그 — Novel(Tiptap) 에디터로 즉시 작성. 카테고리·태그·시리즈 분류, 자동 목차(TOC), Slash 커맨드(/) 지원
• 🚀 프로젝트 쇼케이스 — 11개 프로젝트 등록. 상태(active/building/paused), 기술 스택, Remotion 소개 영상 임베드
• 🛒 스토어 — 디지털 제품 판매 준비 완료. 상품 등록·관리 기능 구현
• ⚙️ 관리자 패널 — /admin에서 모든 콘텐츠 통합 관리. Supabase RLS로 권한 분리
• 📧 뉴스레터 — Resend + React Email로 구독자 새 글 알림 발송

기술적 특징

• 🔐 Supabase 3-Tier 클라이언트 — Public(캐싱 읽기) / Server(인증 컨텍스트) / Admin(RLS 우회) 분리
• ⚡ 캐싱 전략 — unstable_cache 1시간 TTL + revalidateTag 즉시 무효화 + 외부 revalidate API
• 🖼️ 동적 OG 이미지 — /og/[slug]에서 글 제목·카테고리·날짜 포함 미리보기 자동 생성
• 🎬 Remotion 영상 — 프로젝트 소개 영상을 코드로 생성하고 페이지에 임베드

Hun's DEV 한눈에 보기

• 📌 60+ 커밋 — 지속적으로 기능 추가·개선 중
• 📌 11개 프로젝트 — 쇼케이스 등록 완료
• 📌 실서비스 운영 중 — huns-dev.kr
• 📌 풀스택 — 프론트엔드부터 DB, 인증, 이메일까지 직접 구현

기술 스택

• Next.js 15 — App Router + React 19 + Turbopack
• Supabase — PostgreSQL + Auth + Storage + RLS
• Tailwind CSS v4 — shadcn/ui + Radix UI
• Novel — Tiptap 기반 WYSIWYG 에디터
• Remotion — 프로젝트 소개 영상 생성
• Resend — 뉴스레터 + 트랜잭셔널 이메일
• Vercel — 배포 + Analytics

👉 huns-dev.kr에서 직접 확인하세요