ReactJS
- React는 CSR(Client Side Rendering)방식이다. 리액트는 자바스크립트르 이용해서 HTML을 구성하기 때문에 검색엔진SEO(Serch Engine Optimization)가 약하다. 검색 엔진 크롤러가 URL로 접근해도 자바스크립트를 받기 전까지 HTML내용을 알 수 없다.
NextJS
- NextJS는 React 라이브러리 이다 SSR(Server Side Rendering)방식으로 구현할 수 있다. SSR방식으로 사용하면 접속시 HTML문서를 바로 받아올 수 있어서 검색엔진에 노출이 된다. 자바스크립트를 이용해 HTML 문서를 만드는 것이 아니라 HTML을 미리 완성해서 클라이언트에 보내준다 Pre-rendering이라고 한다.
다만 사용자가 HTML 문서만 다운 받은 뒤 클릭 등의 조작을 하더라도 반응할 수 있도록
기본적인 인터렉션을 위한 자바스크립트의 내용이 미니멀하게 HTML 문서에 포함된다.
Static Generation
- NextJS에서 Pre-rendering을 두 가지 방식으로 할 수 있다 Static Generation은 대부분 사용되는 방식으로 빌드할 때 HTML 문서를 만들어 둔다 그리하여 사용자가 페이지를 요청할 때마다 이 HTML 문서를 보내주게 된다 만들어진 문서를 보내는 것이기 때문에 속도가 빠르므로 가능하다면 Static Generation을 사용해야 한다.
Server-side Rendering
- 사용자의 요청을 받았을 때마다 HTML 문서를 새로 생성해서 보내주는 방식이다 페이지의 내용이 매번 바뀌거나 자주 업데이트가 되는 경우 사용하자 물론 CSR을 이용하는 것도 방법이다.
rnrnrnr