TIL: Next.js SSR

• Dynamic Rendering이라고도 함
• 서버사이드렌더링 사용을 위해서는 getServerSideProps라는 async function을 export 해야함
• getServerSideProps 에서 리턴하는 것은 Page에 전달됨

export default function Page({ data }) {
  // Render data...
}
 
// This gets called on every request
export async function getServerSideProps() {
  // Fetch data from external API
  const res = await fetch(`https://.../data`)
  const data = await res.json()
 
  // Pass data to the page via props
  return { props: { data } }
}

• getStaticProps와 다른 점은 getServerSideProps는 빌드 타임에 한번만 실행되지 않고 매 요청마다 실행된다는 것