📄 웹 포트폴리오

프론트엔드 개발자 김종연의 포트폴리오 웹사이트입니다. 인터랙티브한 요소들과 반응형 디자인을 통해 개발 기술과 프로젝트들을 효과적으로 보여주고자 직접 Next.js로 개발했습니다.
🔗 사이트 바로가기

✨ 주요 기능

• 🎨 인터랙티브한 UI/UX
• 📱 모든 디바이스를 위한 반응형 디자인
• 🔍 프로젝트 상세 정보 제공
• 📊 기술 스택 시각화
• 💫 스크롤 기반 애니메이션 효과

🛠 기술 스택

• Frontend: Next.js, TypeScript, Styled Components
• 상태 관리: Recoil
• 데이터베이스: MongoDB
• 배포: Vercel

💡 핵심 기능 설명

인터랙티브 디자인

• 스크롤 기반의 섹션별 애니메이션 효과
• 부드러운 페이지 전환 애니메이션
• 호버 효과를 통한 사용자 상호작용
• 사용자 경험을 고려한 모션 디자인

반응형 레이아웃

• 모든 디바이스에 최적화된 레이아웃
• 화면 크기에 따른 동적 컴포넌트 조정
• 유동적인 그리드 시스템

성능 최적화

• 이미지 최적화: Next.js Image 컴포넌트를 활용한 이미지 최적화
• 스크롤 성능: Intersection Observer를 활용한 효율적인 스크롤 이벤트 처리
• 렌더링 최적화: 불필요한 리렌더링 방지를 위한 상태 관리