Next.js시작하기
Next.js는 웹 앱을 제작하고 배포하는 데 강력한 도구로 웹 앱을 빠르고 효율적으로 구축할 수 있게 하는 Next.js는 현재 넷플릭스, 나이키, 틱톡 등의 기업에서도 활발히 사용되고 있다.
- 리액트에 익숙해지기
- Next.js는 리액트 베이스 어플리케이션을 만드는 프레임 워크이므로 리액트에 대한 이해가 필수!
- Server-side rendering(SSR) 에 대해 공부
- Next.js 는 SSR 을 쉽고 직관적으로 만들 수 있게 디자인 되어 있습니다. 그래서 SSR의 기본을 이해하는 것이 중요
Server-side rendering은 서버에서 렌더링 된 html을 넘겨줘서 화면에 나타내는 방식이다 서버에서 index.html을 렌더링/클라이언트는 index.html을 다운로드하여 화면에 띄움/bundle.js를 다운로드하여 앱을 살아있는 상태로 만듬
App Router
Next는 줄곧 Pages Router를 사용해왔는데, Next가 13 버전으로 업데이트 됨에 따라 App Router라는 새로운 패러다임을 제시하게 되었다.
공식문서에 따르면, Next.js 개발자들은 새로운 앱을 만들 때에는 App Router를 쓰기를 권장하는 바. 다만 아래와 같은 이유로 Pages Router와 App Router를 둘 다 배우는 것을 목표하기.
- 기존 코드의 수정을 위함: 현재 existing applications, 즉 상용화된 대부분의 앱은 Pages Router를 따르고 있고 이는 마치 React에서 Class Component에서 Function Component로 넘어가는 시점, 과도기인 2~3년간 리액트 개발자는 Function Component 뿐 아니라 Class Component도 알아야 하는 것과 비슷하다.
- 아직은 불안정한 App Router와 부족한 정보들: Next.js는 6년간 Pages Router로 구축되어 왔고, 아직은 App Router의 정보를 쉽게 찾기 힘들며 정적 사이트 배포의 경우 에러가 나는 등 알려지지 않은 문제들도 많다. 그럼에도 불구하고 App Router는 앞으로 점점 중요해지리라는 것도 사실.
