[Next.js] Getting Started - Introduction

Next.js 로고

Next.js 문서 읽기

정의 

Next.js는 풀스택 웹 애플리케이션을 만드는 리액트 프레임워크이다. 

주요특징

Routing

• 파일시스템 기반 라우팅
• 중첩 라우팅 가능
• 로딩 상태, 에러 핸들링

Rendering

• Client-side와 Server-side 렌더링 가능
• Next.js 서버에서 정적 혹은 동적 렌더링 가능

Data Fetching

• 서버 컴포넌트에서 동기/비동기 데이터 fetching 가능
• 요청 메모화, 데이터 캐싱, 재검증을 위한 확장된 fetch API 사용 

Styling

• CSS 모듈, Tailwind CSS, CSS-in-JS을 포함한 스타일링 함수 지원

Optimizations

• 이미지, 글꼴, 스크립트 최적화

TypeScript

• 타입 체크, 효율적인 컴파일, 커스텀 플러그인 지원

App Router vs Pages Router

Sidebar 맨 위 dropdown 메뉴에서 각 Router를 선택하면 개별적인 특징의 메뉴로 변경 됨

App Router

• React의 새로운 특징을 활용한 Router
• Server Component, Streaming에서 사용

Pages Router

• 기존 Next.js 기능
• 서버 렌더 리액트 컴포넌트

 

필요 사전 지식

• HTML, CSS, React
• React 스킬 숙지를 위한 Next.js Foundations Course

 

Next.js Getting Started Introduction

 

Docs | Next.js