React Next.js and nested slugs

🆘 Support
1

Hi,

I’m building my site structure in React like this:

projects/project-category/project-detail

And this is my query:

allProjects {
    slug
    projectCategoryParent {
      slug
    }
    genericPageParent {
      slug
    }
}

…can someone please point me in the right direction showing how to use getStaticPaths and getStaticProps in such a way that Project pages can be reached by joining all of the slugs together?

Thank you!

2

hello @steven maybe have a look at our site’s code: https://github.com/datocms/new-website/

you can hopefully find some good inspiration! :slight_smile:

3

Wow thank you. There’s a lot I can learn from this code!

I’ve now managed to solve my question by using a first level dynamic folder [category] with category.js; and a second level dynamic folder [project] and project.js Then params: { category: content.slug } and params: { category: content.projectCategoryParent.projectcategory, project: content.slug } respectively to query the relevant slugs

1 Like