NextJs, getStaticProps, getStaticPaths, getServerSideProps

김재훈·2022년 6월 7일
0

NextJS

목록 보기
1/1

이전에는 data fetching을 getInitialProps를 사용했는데, 9.3부터는 getStaticProps, getStaticPaths, getServerSideProps으로 나뉩니다.

getStaticProps (Static Site Generation)

  • 빌드시 고정되며 빌드이후 변경이 불가능합니다
  • static data를 위해 fetching

getStaticPaths (Static Site Generation)

  • 동적라우팅(Dynamic routing)+getStaticProps일 때 무조건 사용해야합니다
  • getStaticPaths을 통해 빌드 타임 때 정적으로 렌더링할 경로를 설정해야합니다.
  • 여기서 정의하지 않은 하위 경로는 접근해도 렌더링이 되지 않기 때문에,
    동적라우팅 되는 경우의 수를 하나하나 추가해줘야 합니다.
  • path와 fallback을 return 해줘야 합니다.

getServerSideProps (Server-Side Rendering)

  • 빌드랑 상관없이 서버로부터 요청할 때마다 데이터를 가져옵니다.
  • ssr을 위해 fetching

Reference

profile
같이 협업하며 성장하고싶은, 좋은 개발자를 지향합니다 :)

0개의 댓글