インクリメンタル静的再生成(ISR)

Next.js の静的サイト生成(SSG)機能を使って、データを定期的に更新できます。getStaticProps関数のrevalidateオプションを設定することで、ISR を実現できます。これにより、ビルド時に生成されたページをキャッシュし、一定期間経過後に再生成することができます。

例:

import { GetStaticProps } from 'next'

export const getStaticProps: GetStaticProps = async () => {
  const response = await fetch('https://api.example.com/data')
  const data = await response.json()

  return {
    props: {
      data,
    },
    revalidate: 60, // 60秒ごとに再生成
  }
}

function HomePage({ data }) {
  return (
    <div>
      <h1>Data:</h1>
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  )
}

export default HomePage