🌐 Paicearea Intro Page

안녕하세요! 👋 이 프로젝트는 프론트엔드 개발자 Paicearea의 포트폴리오 및 자기소개 페이지입니다. Next.js 15의 App Router 구조를 기반으로 하여, 다양한 기술 스택과 깔끔한 UI를 통해 저를 소개하고 있어요.

✨ 주요 기능

• Profile Section: 기본 프로필 정보 제공
• ToggleDescriptionButton: 클릭 시 MDX 기반 자기소개 전체 내용 표시
• ResumeDownloadButton: PDF 이력서 다운로드 지원
• Skills Section: 기술 스택 소개
• Blog Section: Tistory RSS 피드를 활용한 최신 블로그 글 표시
• Dark Mode: 시스템 설정 감지

🎨 디자인 시스템 - 테마 컬러

이름	HEX 코드	용도 예시
White Base	#FFFFFF	라이트 모드 기본 배경색 (--background)
Dark Base	#0A0A0A	다크 모드 배경색 (--background)
Foreground Dark	#171717	라이트 모드 텍스트 색 (--foreground)
Foreground Light	#EDEDED	다크 모드 텍스트 색 (--foreground)
Gray 300	#D1D5DB	부드러운 회색 텍스트 (text-gray-300)
Gray 500	#6B7280	중간 강조 텍스트 (text-gray-500)
Gray 700	#374151	일반 본문 텍스트 (text-gray-700)

🛠 사용 기술

• Next.js 15 (App Router 기반)
• React 18
• TypeScript
• Tailwind CSS
• Framer Motion
• MDX
• gray-matter + next-mdx-remote
• Tistory RSS 파싱 (Fetch 기반)

📦 설치 및 실행

git clone https://github.com/paicearea/paicearea-intro-page.git
cd paicearea-intro-page
pnpm install
pnpm dev

🧠 하고 싶은 말

이 프로젝트는 단순한 소개 페이지라기보다, Next.js를 공부하고 다양한 기능을 경험해보기 위한 학습용 프로젝트입니다. 다크 모드, MDX 콘텐츠 렌더링, RSS 파싱 등 실무에서 자주 접할 수 있는 기능들을 직접 구현해보며 프론트엔드 개발자로서의 실력을 키워나가기 위한 작은 실험장이기도 해요.

함께 보고, 이야기하고 싶은 분은 언제든 연락 주세요! 😊

---

Made by Paicearea ❤️