What is `getStaticProps` and when should you use it?

getStaticProps fetches data at build time for static generation:

export async function getStaticProps() {
  const res = await fetch('https://api.example.com/posts');
  const posts = await res.json();
  
  return {
    props: {
      posts,
    },
    revalidate: 3600, // ISR: revalidate every hour
  };
}

function Blog({ posts }) {
  return (
    <div>
      {posts.map(post => (
        <article key={post.id}>{post.title}</article>
      ))}
    </div>
  );
}

Use when: Content is static or changes infrequently, for better performance and SEO.