NextJS dynamimc routing question about slugs

user_8161086 0
Viewed 39

I have a doubt with nextjs..

I'm building my site like this

pages
   [slug]
      index.jsx
   index.jsx

so in my slug/index I'm doing this

export async function getStaticPaths() {
  const resProducts = await fetch(`${process.env.PRIVATE_ENDPOINT}/products`);
  const products = await resProducts.json();
  const paths = products.data.map((p) => ({
    params: {
      slugProduct: p.slug,
    },
  }));
  return {
    // this should be dynamic
    paths,
    fallback: true,
  };
}

My question is what happend if I add a new product in my back office?

Do I have to rebuild with next build?

next.js reactjs
1 Answers

My question is what happend if I add a new product in my back office? Do I have to rebuild with next build?

The short answer is NO. If the requested page have not been genereted at build time, Next.js will serve a "fallback" version of the page and will statically generate the requested path HTML and JSON on the background. When the statically generation completed, the browser receives the JSON for the generated path. Subsequent requests to the same path will serve the generated page, just like other pages pre-rendered at build time.

Don't forget to use router.isFallback to detect that request is on fallback.

You can see the good document here.

https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation

user_142687390
Related