getStaticPaths함수는 다음과 같은 필수 속성 이 있는 객체를 반환해야 합니다.(Paths , fallback)
paths 란?
사전 랜더링될 경로를 미리 정해놓는거 정적으로 생성되고 build 시에 먼저 html을 다 그리는 것
fallback 이란?
빌드 타임에 생성해놓지 않은 path로 요청이 들어온 경우 어떻게 할지 정하는 boolean 또는 'blocking' 값이다.
getStaticPaths fallback : false 일 경우
fallback이 false로 설정된 경우 getStaticPaths에 의해 반환되지 않는 경로는 404페이지가 됩니다.
쉽게 말해 getStaticPaths의 Paths가 가지고 있지 않은(사전에 빌드하지 않은)
다른 id의 요청이 들어올 경우엔 404 응답을 반환한다.
그럼 이걸 언제쓰는게 적당하냐 ??
-
false 값은 미리 설정할 경로가 적은 응용 프로그램인 경우에 가장 적합합니다.
-
새 페이지가 자주 추가되지 않는 경우
몇 개의 기사가 있는 블로그 사이트는 fallback을 false 로 쓰기에 적합합니다.
getStaticPaths fallback : true 일 경우
-
getStaticPaths가 반환한 path들은 빌드 타임에
HTML로 렌더링된다 -
빌드시 생성되지 않은 경로에 404 페이지를 생성하지 않는다.
(대신 NextJs는 이러한 경로에 대한
"첫번째 요청”에서 페이지의 대체 버전을 제공함) : fallback 버전
이건 말이 어려워서 그렇지 사실 로딩을 걸어놨으면 로딩창이 보여지는 그 순간을 풀백 버전이라고 하는거임
-
fallback이 보여지는 동안에 백그라운드에서
nextJs가 요청한 path에 대해서
getStatic 함수를 이용하여 HTML파일과 JSON 파일을 만들어낸다. -
백그라운드 작업이 끝나면, 요청된 path에 해당하는 JSON파일을 받아서 새롭게 페이지를 랜더링한다.
fallball >요청된 데이터로 랜더링 된다는거임 -
새롭게 생성된 페이지를 기존의 빌드시 프리렌더링된 페이지 리스트에 추가한다.
같은 path로 온 이후 요청들에 대해서는
이때 생성한 페이지를 반환하게 된다.
getStaticPaths fallback : bloking 일 경우
fallback이 'blocking'인 경우 true일때와 비슷하지만,
페이지 생성중에 사용자에게 fallback 버전의 페이지를 보여주지 않고,
ssr처럼 동작해서 아무것도 미리 보여주지 않게된다.
사용자가 빌드되지 않은 paths를 요청하는 경우 해당 시간동안
브라우저의 로딩 상태를 보게 된다.
true인 경우와 같이 로딩 이후의 paths로의 접근은 빠르게 가능하다
