[Next.js] introduction

https://nextjs.org/docs 를 번역하였습니다.

Next.js란?

Next.js는 풀스택 웹앱을 만들기 위한 React 프레임워크이다.

Next.js는 React에 필요한 번들링, 컴파일링에 필요한 도구를 추상화 및 자동화하여 개발자가 프로젝트 구성보다는 개발에 집중할 수 있도록 한다.

Next.js는 빠르고, 동적이고, 인터랙티브한 React 앱을 만들 수 있도록 도와준다.

---

주요 기능

Routing

레이아웃, 계층적 라우팅(nested routing), 로딩 상태, 에러 핸들링 등을 지원하며 서버 컴포넌트의 최상위에 위치하는 파일시스템 기반 라우터

Renderinig

클라이언트 및 서버 컴포넌트를 통한 클라이언트사이드 및 서버사이드 렌더링. 서버에서의 정적 / 동적 렌더링을 통해 최적화된다.

Data Fetchinig

서버 컴포넌트 내부의 async/await를 통한 간소화된 데이타 패칭과, 요청  메모이제이션(memoization), 데이타 캐싱과 재평가를 위한 확장된 'fetch' API

Styling

CSS Modules, Tailwind CSS, CSS-in-JS 등 지원

Optimization

앱의 Cor Web Vitals, 유저 경험을 이미지 / 폰트 / 스크립트 최적화를 통해 개선

TypeScript

더 나은 타입 체크와 효율적인 컴파일을 통한 향상된 TypeScript 지원

---

App Router vs Pages Router

Next.js는 앱 라우터와 페이지 라우터를 갖는다. 앱 라우터는 서버 컴포넌트와 스트리밍과 같은 React의 최신 기능을 사용할 수 있도록 하는 최신 라우터이다. 페이지 라우터는 Next.js의 오리지날 라우터로서, server-rendered React 애플리케이션을 빌드할 수 있게 하고, 오래된 Next.js 앱을 지원한다.

 

(후략)