NextJS란

ProductionNext.js

Next.js는 React의 SSR(Server Side Rendering)을 쉽게 구현할 수 있게 도와주는 간단한 프레임워크입니다. React도 SSR을 고려하여 설계되었기 때문에 자체적으로도 구현이 가능하긴 하지만, 개발환경을 만들기 위해서는 생각보다 복잡합니다. 그래서 이러한 문제를 해결한 Next가 나왔고, 사용법도 꽤 간편합니다.

 

 

SSR은 무엇인가요?

SSR은 Server Side Rendering 약자로 처음 클라이언트가 접속했을때 브라우저에서 자바스크립트 코드를 다운로드 받아 해석 할 때까지 기다리지 않고 서버에서 보여질 HTML을 미리 준비해 클라이언트한테 응답해주는 방식을 서버 사이드 랜더링이라고 합니다. 줄여서 SSR이라고 표현합니다.

SPA에서 SSR을 구현하면 아래와 같은 매커니즘으로 작동합니다.

사실 SSR 은 그다지 새로운 개념이 아닙니다. 지금에야 와서는 React, Angular, Vue, Svelte 등등의 CSR 위주의 프레임워크나 라이브러리가
대중화 되었지만 전통적인 웹페이지의 응답은 SSR 이 기본이었습니다.

Client 요청 > Server 는 요청받은 데이터를 넣어, 응답할 HTML 을 만들어줌 > Client 로 전달