generateStaticParams for Nested Segments
Medium · Static Generation
generateStaticParams tells Next.js which dynamic URLs to pre-render at build time. It returns an array of params objects, one per page. For a route with two dynamic segments, like app/shop/[category]/[product]/page.tsx, each object has **both** keys: { category: "shoes", product: "12" } becomes /shop/shoes/12.
Param values must be **strings**, even when your data uses numbers.
Implement generateStaticParams() for this route:
- Read the data with await getCatalog().
- Return one { category, product } object for every product with stock > 0. category is the category slug; product is the product id as a string.
- Keep the catalog order. Categories without in-stock products produce nothing.
(Another option in real apps: a generateStaticParams in [category]/layout.tsx returns the categories, and the child one receives { params: { category } } and returns only products. Here the page generates both at once.)
The driver buildParams(data) is already written.