Write a Next.js blog post page that uses the getStaticProps API to pre-render the blog post based on the slug.

Question

Examine the following code for a blog page in Next.js:

// pages/blog/[slug].js
export async function getStaticProps({ params }) {
  const postData = getBlogPostBySlug(params.slug);
  return { props: { postData } };
}

export default function BlogPost({ postData }) {
  return <article>{postData.content}</article>;
}

What does the getStaticProps function do in this context?

{postData.content}

; } ``` What does the getStaticProps function do in this context?

Accepted Answer

It retrieves blog post data based on the slug for static pre-rendering.

Answer

It redirects users to different routes based on the slug.

Answer

It initializes the global state of the application.

Answer

It handles server-side data mutations for the blog post.

Question from the Next.js test

Write a Next.js blog post page that uses the getStaticProps API to pre-render the blog post based on the slug.