📚 Next.js의 등장배경으로 알아보는 Next.js의 강력함
웹 개발의 세계는 끊임없이 진화하고 있다. 그 중, 최근에 React 기반의 웹 개발에서 큰 변화의 바람이 불고 있는데, 그 중심에는 Next.js가 있다.
이에, 이번 글을 통해 Next.js의 등장 배경을 알아보며, Next.js가 왜 요즘 뜨고 있는지에 대해 알아보자.
📌 Next.js의 등장 배경
React는 CSR(Client Side Rendering), 즉 화면을 구성하는 렌더링이 클라이언트에서 발생한다. 하지만 CRS 방식의 한 가지 문제점이 있다. 바로, 첫 페이지의 로딩속도가 느리다는 단점을 지니고 있다.
React의 CSR 방식을 간략하게 따라가보면, React에서는 텅 빈 HTML 코드를 다운 받아서 텅 빈 화면을 보여주고, JS를 다운받아서 실행하면, React가 이 안에 HTML을 만들어주는 방식으로 렌더링이 진행된다. 따라서, 첫 페이지의 로딩속도가 느려지는 단점이 존재하는 것이다.
또한, CSR은 검색 엔진에 제공할 수 있는 정보가 작다는 단점 또한 지니고 있다. 즉, 검색 엔진 최적화(SEO) 측면에서도 이를 최적화하기 위해 많은 과정이 필요하다.
이러한 단점을 극복하기 위해서 Pre-rendering(프리렌더링)이라는 개념이 등장하였는데, 미리 렌더링해서 보여줄 HTML을 저장하거나, 서버가 그때그때 HTML을 만들어서 보내주는 렌더링 방식이다.
이러한 방식을 사용하면, HTML을 다운받자마자 렌더링 된 화면을 띄울 수 있게 된다. React에서도 Pre-rendering이 가능하나, 여러 가지 할 일들이 필요하다.
이 모든 걸 한 방에 해결하고자 등장한 것이 바로 Next.js이다. Next.js에서는 프리랜더링을 알아서 진행해주며, Vercel이라는 서비스를 통해 굉장히 쉽고 최적화된 서버 호스팅이 가능해진다. 또한 파일 시스템 기반 라우팅을 제공하여 React보다 편리하게 라우팅이 가능하다.
그래서 요즘 React기반으로 웹 서비스를 제작할 때, Next.js를 많이 사용하는 것이 바로 이러한 이유 때문이다.
Outro
Next.js의 등장배경과, 그 장점들을 알아보며 Next.js가 왜 강력한지에 대해 알아보았다. 이러한 배경과 강력함으로 유추해보았을 때, 현대 웹 개발의 트렌드에서 Next.js의 중요성은 계속해서 증가할 것으로 예상된다.
Next.js에 대해 꾸준히 공부하고, 또 관련 내용들을 글로 정리하며, Next.js를 자유자재로 다루는 개발자로 나아가보자 🔥
