책 리뷰

실전에서 바로 쓰는 Next.js

SSR부터 SEO, 배포까지 확장성 높은 풀스택 서비스 구축 가이드

미셸 리바 저/박수현 역

한빛미디어

Real-World Next.js

실전에서 바로 쓰는 Next.js

유지보수가 쉬운 풀스택 애플리케이션을 개발하려는 사람을 위한 책

◎ 추천 포인트

  1. 초급수준의 사람들도 이해하기 쉬울정도의 자세하고 친절한 설명
  2. Next.js의 렌더링 전략에 대한 자세한 설명
  3. 따라가며 실습이 가능한 구성

누가 이 책을 읽어야할까?

이 책은 확장과 유지보수가 쉬운 풀스택 애플리케이션을 개발하려는 사람을 위해 만들어졌으며, 그에 따라 중급 수준 이상의 ES6+, 리액트, Node.js, REST 지식을 어느정도 갖춘 사람들에게 가장 효과적일 것 같다.

Next.js 를 공부하는 근본적인 이유

Next.js는 리액트를 위해 만든 오픈소스 자바스크립트 웹 프레임워크로, 리액트에 없는 서버 사이드 렌더링(SSR), 정적사이트생성(SSG), 증분 정적 재생성(ISR)과 같은 다양하고 풍부한 기능을 제공하고 있다.
그렇기 때문에 이 기능들을 사용하는것만으로도 기존 바닐라 리액트 애플리케이션의 단점을 커버할 수 있으며, 많은 문제를 해결할 수 있다.

그에 맞게 이 책은 웹 애플리케이션을 웹 브라우저에 제공하는 방법을 의미 Next.js의 렌더링 전략에 대해서부터 자세히 설명하고 있다.

서버사이드 렌더링이란 서버에서 HTML 페이지를 동적으로 렌더링하고 웹 브라우저에 전송하는것을 밀한다.
리액트 하이드레이션덕분에 웹 앱은 싱글페이지어플리케이션(SPA)처럼 동작할 수 있고, 클라이언트 사이드 렌더링과 SSR의 장점을 모두 갖습니다.
또한, 페이지를 서버에서 렌더링한다는 것은 쿠키관리, 주요 API, 데이터 검증 등과 같은 작업을 서버에서 처리한다는 뜻이며, 중요한 데이터를 클라이언트에 노출할 필요가 없기 때문에 더 안전하다고 할수 있다.
또한 클라이언트에서 서버가 렌더링한 HTML콘텐츠를 받기때문에 봇이나 웹 크롤러 같은 검색 엔진 웹 문서 수집기가 페이지를 렌더링할 필요가 없어 웹애플리케이션의 SEO점수가 높아지는 장점이 있다.

클라이언트 사이드 렌더링은 표준 리액트 앱서버에서 자바스크립트 번들을 클라이언트로 전송한다.
웹앱이 렌더링을 시작하기 전에 웹 브라우저 화면이 비어있는것 처럼 보이는 이유는, 서버가 웹 애플리케이션이 필요로하는 스크립트와 스타일만 포함된 기본 HTML마크업만 전송하기 때문이다.
클라이언트 사이드 렌더링은 네이티브 어플리케이션처러 느껴지는 속도감과, 쉬운 페이지 전환, 지연된 로딩과 성능, 서버 부하 감소가 큰 장점이라고 할 수 있다.

마무리하며

처음에 중급이상 수준의 개발 실력을 갖고있는 사람들이 이해하기 쉽다고 했는데, 사실 초급수준의 사람들도 이해하기 쉬울정도로 책이 설명이 아주 잘되어있고, 예시코드들이 가시성있게 잘 만들어 따라하기 쉽운 편이다.
Part2만 보아도 실전에서 사용하는 코드구성부터 시작해서 커스텀 서버와 테스트코드 배포까지 실전에서 쓸수 있는 다양한 내용들을 배울수 있다.
또한, 실전에서 사용할수 있도록 예제용 프로젝트들을 보고 연습 프로젝트로 직접 구현해 볼수 있도록 제공하고 있다. 이 책 하나만 으로도 Next.js를 실전에서 쓸수있을 정도의 책이라고 생각하며, Next.js를 실무에 적용하길 검토한다면 꼭 읽어보길 권한다.

한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다.