Nextjs는 무엇인가?

NextJS 공식 도스를 기반으로 작성 했습니다.

Next.js] 공식문서 : How Next.js Works

Vercel이라는 미국 회사에서 리액트에서 사용되는 라이브러리입니다.

왜 굳이 사용하는 것일까?

server-side rendering의 유행

server-side rendering이라는 것은 서버에서 html을 미리 만들어서 브라우저로 보낸후 화면에 표시하는 기법을 말합니다.

server-side rendering 장점

  1. 검색엔진 최적화 (SEO)가능 합니다.
  2. 미리만든 것을 브라우저로 보내주기 때문에 빠른 페이지 랜더링이 가능합니다.

server-side rendering 단점

좋은 측면이 있으면 나쁜 측면도 있습니다.

  1. 프로젝트의 복잡도가 있습니다.
  2. 서버 랜더링에 따른 부하가 발생될수 있습니다.
  3. 불필요한 인터넷 자원이 소모가 될수 있습니다
페이지를 요청할떄 마다 페이지를 새로고침이 발생한다.

Next.js의 주요 특징

Next.js의 주요 기능 중 일부는 다음과 같습니다.

특징 설명
라우팅 레이아웃, 중첩 라우팅, 로딩 상태, 오류 처리 등을 지원하는 서버 구성 요소 위에 구축된 파일 시스템 기반 라우터입니다.
렌더링 클라이언트 및 서버 구성 요소를 사용한 클라이언트 측 및 서버 측 렌더링. Next.js를 사용하여 서버에서 정적 및 동적 렌더링으로 더욱 최적화되었습니다. Edge 및 Node.js 런타임에서 스트리밍합니다.
데이터 가져오기 서버 구성 요소의 async/await를 사용하여 데이터 가져오기를 단순화하고 fetch요청 메모, 데이터 캐싱 및 재검증을 위한 확장된 API를 제공합니다.
스타일링 CSS 모듈, Tailwind CSS, CSS-in-JS 등 선호하는 스타일 지정 방법 지원합니다.
최적화 애플리케이션의 핵심 웹 바이탈 및 사용자 경험을 개선하기 위한 이미지, 글꼴 및 스크립트 최적화.
타입스크립트 더 나은 유형 검사, 더 효율적인 컴파일, 사용자 정의 TypeScript 플러그인 및 유형 검사기를 통해 TypeScript에 대한 지원이 향상되었습니다.