그동안 코드캠프의 일정을 소화하느라 뒤로 미뤄두었던 것들을 차근차근 정리하고 프로젝트를 완성 및 보수하는 과정을 정리하기로 했다.
기본적인 cs개념들이 부족한 부분이 많다고 생각되어서 그 부분에 대한 공부와 정리를 하고 학원에서 시작한 프로젝트도 보완하고 미니 프로젝트들을 계속해서 진행하면서 감을 잃지 않도록 해야겠다.
오늘은 next.js가 무엇인지 next.js를 왜 사용했는 지에 대해서 알아보았다.
일단 next.js는 react로 만드는 ssr 프레임워크이다.
react는 spa이기 때문에 기본적으로 csr을 사용하게 된다.
(물론 spa라고 무조건 csr을 하는 것은 아니다.)
csr방식은 최초 요청시에 HTML을 비롯한 각종 리소스를 받아오고 이후에는 서버에 데이터만 요청하고 자바스크립트로 뷰를 컨트롤 한다.
초기 요청이 많은 csr의 특성상 처음 랜더링 시의 속도가 아무래도 느리기 때문에 사용자의 체감속도를 떨어질 수 있다.
또한 보통 csr방식의 경우 SEO(Search Engine Optimization)문제가 있어서 다양한 사용자들에게 노출되어야 하는 경우라면 ssr방식을 고려하는 것이 좋다.
(최근에는 구글을 비롯해 네이버등에서도 크롤러 안에 자바스크립트 엔진이 들어있어서 문제가 없다고 한다. 아마도 시간이 지날 수록 이러한 단점은 csr방식에서 단점이 아니게 될 것 같다.)
어찌됐든 이러한 csr방식의 단점들을 보완할 수 있게 해주는 것이 next.js이다.
spa인 리액트에서 ssr방식을 사용할 수 있도록 도와준다.
수업을 때는 그저 동적라우팅을 포함한 페이지 기반 라우팅을 편하게 해주는 정도라고 생각했는데 그밖에도 다양한 기능들을 제공하고 있었다.