[React] Next.js 시작하기 전 알아야 할 기본 개념

Next.js

개념

Next.js는 서버 사이드 렌더링, 정적 웹 페이지 생성 등 웹을 위한 React 프레임워크이다.

Next.js를 사용해야 하는 이유

• 사전 렌더링(Pre-Rendering)
• 자동 코드 분할(Code-Splitting)
• API Routes
• 자동 최적화(Built-in Optimization)
• 미들웨어(Middleware)
• Routing & Layout

SSR

Server Side Rendering의 약어로, 요청이 올 때마다 해당 HTML 문서를 생성하여 반환한다. 사이트에 접속할 때 미리 렌더링된 HTML 파일을 불러온다.

SSG

Static Site Generation의 약어로, 빌드 타임에 각 HTML 페이지를 미리 생성 요청하면 미리 생성된 페이지를 반환한다.

SEO

Search Engine Optimization의 약어로, 내 사이트를 검색 엔진 결과에 잘 노출 시킬 수 있도록 최적화 하는 것을 의미한다.

라우팅

어떤 네트워크 안에서 통신 데이터를 보낼 때 최적의 경로를 선택하는 과정(출처: 위키백과)으로, Next.js에서는 파일 시스템(pages) 기반 라우팅을 사용한다.