hot reloading

개발 중 저장되는 코드는 자동으로 새로고침 된다.

Automatic routing

NextJS에서는 app 폴더 하단에 폴더만 만들어주면 된다!

app > page folder > page.tsx file

여러 폴더가 중첩되면 url이 길어진다.

http://localhost:3000/about-us/compony/sales

Single file components

style.jsx 를 사용함으로써 컴포넌트 내부에 해당 컴포넌트만 스코프를 가지는 css를 만들 수 있다.

Global 스타일 적용 가능

global.css

Server landing

서버 렌더링을 한다.
CRS와 다르게 SSR을 한 페이지의 페이지 소스보기를 클릭하면 내부에 소스 有

Code split

dynamic import를 이용하면 코드 스플리팅이 가능하다.
코드 스플리팅이란, 내가 원하는 페이지에서 원하는 자바스크립트를 렌더링 하는 것이다.
모든 번들이 하나로 묶이지 않고 각각 나뉘어 조금 더 효율적으로 자바스크립트 로딩 시간을 개선할 수 있다.

typescript

타입스크립트 활용을 위해 webpack을 만지거나 babel을 만질 필요가 없다.

_document.tsx

meta 태그를 정의하거나, 전체 페이지에 관리하는 컴포넌트