[Refactor] Next.js -> React 마이그레이션 #21

♻️ 리팩토링 목적

• 현재 서비스는 Next.js의 SSR, Image 최적화 등의 기능을 거의 사용하지 않는 순수 SPA에 가까운 구조입니다.
• 그럼에도 불구하고 Next.js를 사용함으로써 다음과 같은 문제 있습니다.
  • 상대적으로 긴 빌드/개발 서버 구동 시간
  • 복잡한 설정/구조
  • 사용하지 않는 의존성 코드
• 프로젝트 초기 단계에서 기능 구현이 아직 많지 않을 때, 보다 가벼운 React SPA 환경으로 전환하여 다음과 같은 이점을 챙기고자 합니다.
  • 개발 피드백(핫 리로드) 속도 향상
  • 빌드 시간 단축
  • 러닝 커브/개발 복잡도 감소

✅ 개선 방향

• Next.js 기반 구조를 React + Vite 기반 SPA 구조로 전환합니다.
  • Next 전용 의존성(next, eslint-config-next 등) 제거
  • vite, @vitejs/plugin-react-swc, react-router-dom 도입
• 라우팅:
  • app/ 또는 pages/ 디렉토리 구조를 src/pages/* + react-router-dom 기반 라우팅으로 이관
• 빌드 & 실행:
  • next dev/build/start 스크립트 제거
  • vite dev/build/preview 스크립트로 대체

📄 참고 사항 (선택사항)

• 유사 사례: Next.js에서 React로 마이그레이션
  • 빌드 시간: 3분 → 18초
  • 핫 리로드 시간: 200ms 이하로 개선
  • 개발자 만족도 및 생산성 향상 보고
  • 참고 아티클