Im new to NextJS 14 and would like some information on the best approach to serve dynamic route pages. Currently Im looking at using ‘generateStaticParams’ which builds all the pages at build time on the server for SEO purposes. However, what would happen if a new route gets called when a new post was added after build time?. Would I have to rebuild nextjs again? Or would the new route be dynamically served? Is there some kind of setting to initiate a rebuild? Or some other approach?

Here is the page route structure:
posts/[id]/page

at build time:
posts/post1
posts/post2
.
.
.

after build time – a post added and new request too:
posts/post3

Would post3 render?

I have included some example code below but intend to use mongo that doesnt use fetch.

// Return a list of `params` to populate the [id] dynamic segment
export async function generateStaticParams() {
  const posts = await fetch('https://jsonplaceholder.typicode.com/posts').then((res) => res.json())
  
  return posts.map((post) => ({
    id: post.id.toString()
  }))
}
 
// Multiple versions of this page will be statically generated
// using the `params` returned by `generateStaticParams`
export default async function Page( { params: { id }}) {
  
  const response = await fetch(
    `https://jsonplaceholder.typicode.com/posts/${id}`,
  );

  const post = await response.json();

  console.log('Here is the post ', post )

  return (
    <div className="flex min-h-screen flex-col items-center justify-center bg-gray-100">
      <div className="w-1/2 rounded bg-white p-10 shadow-lg">
        <h1 className="mb-4 text-4xl font-bold text-blue-600">{post.title}</h1>
        <p className="text-gray-700">{post.body}</p>
      </div>
  
    </div>
  );
}