Next.js는 풀스택 React 프레임워크입니다. React 자체는 단지 UI 라이브러리일 뿐이라서 컴포넌트를 렌더링하지만, routing, 데이터 페칭, 서버 렌더링, 빌드 도구는 여러분의 몫으로 남겨 둡니다. Next.js는 이 모든 것을 기본으로 제공하며, 여기에 서버 런타임까지 더해 줍니다.
React만으로는 빠지는 부분 (그리고 Next.js가 더하는 것)
text
React (라이브러리) → Next.js (프레임워크)가 더하는 것:
──────────────────────────────────────────────────
UI 렌더링만 담당 → 파일 기반 routing (폴더 = 라우트)
클라이언트 렌더링 → 서버 렌더링(SSR), 정적 생성(SSG), ISR
데이터 페칭 직접 연결 → 내장 데이터 페칭 + 캐싱
백엔드 없음 → API 라우트 / Route Handler (풀스택)
수동 번들링 → 무설정 빌드, 코드 스플리팅, 최적화
수동 <img> → next/image (자동 최적화 이미지), next/font
구체적인 예시: 라우트는 그저 파일 하나
tsx
() {
;
}