Next.js

Next.js는 React.js를 기반으로 만들어진 프레임워크
IoC:Inversion Of Control 제어의 역전
next 프레임워크가 제어한다는 소리이다. 원래 개발자가 yarn add ~ 하면서 설치해서 provider로 가져와서 ~ 다양한 라이브러리들을 설치해서 썼다면
next에서는 이런걸 다 제공해준다.
리액트는 라이브러리고, 넥스트는 프레임워크다.
넥스트가 그럼 어떤걸 제공해주냐...

1. 다양한 렌더링 기법
2. 라우팅: 파일(폴더) 기반 라우팅
3. route handler: 백엔드 가능(get,post,patch 등등)
4. 스타일링: CSS, Sass, CSS-in-JS
5. 최적화, 번들링 - 코드 스플리팅, 이미지 최적화, 웹팩 설정 등
6. Easy 배포
   • Vercel에서 제공하는 Next.js인 만큼 배포가 굉장히 쉽습니다.
   • Full Stack 애플리케이션의 배포 프로세스
     • 전통적인 방법
       • 프론트엔드 : vercel
       • 백엔드 : aws ec2
     • Next.js를 사용하면 : vercel로 일괄 배포

Next는 코드 스플리팅을 default로 지원한다.
코드 스플리팅이란 웹페이지 로딩시간을 줄이기 위한 방법.
큰 코드를 작은 단위로 잘라냄(사용자가 필요로 하는 부분만 우선 로딩)
나머지는 필요에 의해서만 로딩(ex.스크롤 이벤트, 마우스 움직임)
웹 페이지 로딩시간 - TTV
TTV(Time To View) - 사용자가 최초 View를 볼 수 있을 때까지의 시간
넥스트는 코드 스플리팅을 자동으로 해준다.