Next.js Discord

Discord Forum

Dynamic routing - Users can make own pages/objects/routing

Unanswered
Chub mackerel posted this in #help-forum
Open in Discord
Avatar
Chub mackerelOP
Hi!

Within our product, users could creates pages like:

/about-us
/another-page

and are able to create objects, for instance: blogs. And create entities within blogs which will then be handled as single posts. Routing would then look like:

/blogs
/blogs/single-post

To achieve this I have setup the following structure within the App dir:

app/
├── [rootSlug]/
│   ├── page.tsx      # Renders root page for /rootSlug
│   ├── [slug]/
│   │   ├── page.tsx  # Renders child page for /rootSlug/slug
│   ├── layout.tsx
└── layout.tsx


[rootSlug]/page.tsx
export const dynamicParams = false;

export async function generateStaticParams() {
  const response = await fetchAllPageSlugs();

  const rootSlugs = Object.keys(response);

  return rootSlugs.map((slug) => ({
    rootSlug: slug,
  }));
}


[rootSlug]/[slug]/page.tsx
export const dynamicParams = true;

export async function generateStaticParams() {
  
}


Now my quesitons:

1. How would I pass the rootslug as a param in the generateStaticParams function for the single page? Based on that rootslug I do want to generate the staticparams

2. Right now it does not show me a 404 if I go to random urls like: rootslug/a It does work when I remove the second param from the url, so all the problems are coming from how I have setup the [slug] folder within the [rootslug].

0 Replies