getStaticProps

export async function getStaticProps(context) {
  return {
    props: { message: `Next.js is awesome` }, // ページコンポーネントに props として渡されます
  }
}

// この関数はビルド時にサーバーサイドで呼び出されます。
// 再検証が有効で新しいリクエストがある場合、
// サーバーレス関数で再度呼び出される可能性があります
export async function getStaticProps() {
  const res = await fetch('https://.../posts')
  const posts = await res.json()

  return {
    props: {
      posts,
    },
    // Next.js はページの再生成を試みます：
    // - リクエストが来たとき
    // - 最大で10秒に1回
    revalidate: 10, // 秒単位
  }
}

export async function getStaticProps(context) {
  const res = await fetch(`https://.../data`)
  const data = await res.json()

  if (!data) {
    return {
      notFound: true,
    }
  }

  return {
    props: { data }, // ページコンポーネントに props として渡されます
  }
}

export async function getStaticProps(context) {
  const res = await fetch(`https://...`)
  const data = await res.json()

  if (!data) {
    return {
      redirect: {
        destination: '/',
        permanent: false,
        // statusCode: 301
      },
    }
  }

  return {
    props: { data }, // ページコンポーネントに props として渡されます
  }
}

import { promises as fs } from 'fs'
import path from 'path'

// posts は getStaticProps() によってビルド時に設定されます
function Blog({ posts }) {
  return (
    <ul>
      {posts.map((post) => (
        <li>
          <h3>{post.filename}</h3>
          <p>{post.content}</p>
        </li>
      ))}
    </ul>
  )
}

// この関数はビルド時にサーバーサイドで呼び出されます。
// クライアントサイドでは呼び出されないため、
// 直接データベースクエリを実行することもできます。
export async function getStaticProps() {
  const postsDirectory = path.join(process.cwd(), 'posts')
  const filenames = await fs.readdir(postsDirectory)

  const posts = filenames.map(async (filename) => {
    const filePath = path.join(postsDirectory, filename)
    const fileContents = await fs.readFile(filePath, 'utf8')

    // 一般的にはコンテンツを解析/変換します
    // 例えば、ここでマークダウンをHTMLに変換できます

    return {
      filename,
      content: fileContents,
    }
  })
  // { props: { posts } } を返すことで、Blog コンポーネントは
  // ビルド時に `posts` を props として受け取ります
  return {
    props: {
      posts: await Promise.all(posts),
    },
  }
}

export default Blog