🧭 프로젝트 개요

Next.js 기반으로 제작한 개인 블로그 프로젝트입니다. 다크 모드, 마크다운 포스트, 태그 필터링 기능 등을 포함합니다.

💡 프로젝트 배경

개발 공부를 시작하며 매일 작성하던 TIL을 노션이 아닌 직접 만든 블로그에 기록하고 싶다는 생각에서 출발했습니다.
기술 블로그를 직접 개발해보며 다음을 경험하고자 했습니다:

• Next.js 프레임워크 구조 이해 및 활용
  • SEO, SSG, 빠른 초기 로딩 속도, 간단한 라우팅을 이유로 Next.js 선택
• 다크 모드, 검색 등 사용자 중심 기능 구현
• 검색 엔진 최적화(SEO)와 정적 페이지 구성
• 디자인부터 개발까지 전 과정을 직접 주도

Hi-fi 와이어프레임

• 클릭하면 피그마에서 확인하실 수 있습니다.

🔨 주요 기능

• 페이지별 정적 콘텐츠 구성 (Home, Blog, Project 등)
• mdx 기반 콘텐츠 작성 (글 내 JSX, 스타일 커스터마이징, 코드 블럭 하이라이팅 및 테이블, 인용구 등 지원)
• 카테고리 필터 및 키워드 기반 검색 기능
• 다크 모드 토글 기능 및 반응형 설계 (모바일 대응)

♻️ 리뉴얼

7월 포트폴리오 + 블로그를 목표로 구조를 리뉴얼하였습니다.

• 기존 TIL, Study 중심 구조 제거 -> Blog, Projects, Resume로 변경
• JavaScript → TypeScript로 점진적 전환
• 스타일 시스템 정비 및 반응형 디자인 개선
• 게시글 렌더링 구조 및 메타데이터 처리 개선

🔗 리뉴얼 이후 트러블슈팅 및 기술 적용 |

• Next.js 15에서 App Router의 params.slug 타입 버그
• Next.js 기반 블로그의 SEO 최적화 적용

💬 블로그 및 포트폴리오의 통합 운영을 목표로, 기능과 디자인을 계속 발전시키는 중입니다.