<aside> 💡 Next.js는 새로운 React 기능을 추가하고 빠른 빌드를 위해 Rust 기반의 강력한 JavaScript 도구를 사용하여 풀스택 웹 애플리케이션을 생성하는 데 도움을 줍니다.
</aside>
Next.js는 전체 스택 웹 애플리케이션을 구축하기 위한 React 프레임워크입니다. React 컴포넌트를 사용하여 사용자 인터페이스를 구축하고, Next.js는 추가 기능과 최적화를 제공합니다.
Next.js는 React에 필요한 번들링, 컴파일 등의 도구를 추상화하고 자동으로 구성합니다. 이를 통해 구성에 시간을 소비하는 대신 애플리케이션 개발에 집중할 수 있습니다.
개인 개발자이든 대규모 팀의 일원이든, Next.js를 사용하여 인터랙티브하고 동적이며 빠른 React 애플리케이션을 구축할 수 있습니다.
Next.js의 주요 기능 중 일부는 다음과 같습니다.
| 특징 | 설명 |
|---|---|
| 라우팅 | 레이아웃, 중첩 라우팅, 로딩 상태, 오류 처리 등을 지원하는 서버 구성 요소 위에 구축된 파일 시스템 기반 라우터입니다. |
| 표현 | 클라이언트 및 서버 구성 요소를 사용한 클라이언트 측 및 서버 측 렌더링. Next.js를 사용하여 서버에서 정적 및 동적 렌더링으로 더욱 최적화되었습니다. Edge 및 Node.js 런타임에서 스트리밍합니다. |
| 데이터 가져오기 | 서버 구성 요소의 async/await를 사용하여 데이터 가져오기를 단순화하고 fetch요청 메모, 데이터 캐싱 및 재검증을 위한 확장된 API를 제공합니다. |
| 스타일링 | CSS 모듈, Tailwind CSS, CSS-in-JS 등 선호하는 스타일 지정 방법 지원 |
| 최적화 | 애플리케이션의 핵심 웹 바이탈 및 사용자 경험을 개선하기 위한 이미지, 글꼴 및 스크립트 최적화. |
| 타입스크립트 | 더 나은 유형 검사, 더 효율적인 컴파일, 사용자 정의 TypeScript 플러그인 및 유형 검사기를 통해 TypeScript에 대한 지원이 향상되었습니다. |
Next.js에는 두 가지 다른 라우터가 있습니다: App Router와 Pages Router입니다. App Router는 React의 최신 기능인 Server Components와 Streaming과 같은 기능을 사용할 수 있는 더 최신의 라우터입니다. Pages Router는 원래의 Next.js 라우터로, 서버 렌더링된 React 애플리케이션을 구축할 수 있도록 하였으며 이전 버전의 Next.js 애플리케이션에 대해서도 계속 지원됩니다.