nextJS란?

React + 서버 기능 + 라우팅 + SEO(검색엔진최적화) + 번들링 + 최적화

모두 한 번에 제공하는 통합 웹 프레임워크.

  1. 리액트(React) 기반의 웹 프레임워크로, 리액트로 만들기 어려운 기능들을 기본 제공하여 “풀스택 웹앱”을 쉽게 만들도록 도와주는 도구.

  2. nextJS는

  1. 페이지 자체는 SSR로 서버에서 먼저 HTML을 렌더링한다.
기능 SSR 설명
서버에서 fetch 정적 페이지에서 fetch를 당기는게 아니고, 서버형태로 당김 (안전)
DB 접근 next js에서 다이렉트로 DB연결 가능
API 키 노출 방지 서버에서 실행되므로 안전
SEO(검색엔진 최적화) 구글/네이버가 HTML 내용만 보고 크롤링할 수 있어서 서칭이 잘됨

1. Next.js 프로젝트 설치 (신규 생성)

# npx create-next-app 프로젝트명
npm create next-app 프로젝트명