I need to create a dynamic path in Next.js like 'courses-demo-[dynamic_name]'. I created nested folders like this:
This folder structure just support path as /courses-demo/a, /courses-demo/b/c, etc. But I want to have a URL like this: /courses-demo-photograpy, courses-demo-web-development, and another many dynamic names. How could I do this?
You could just make a file called [slug].js in your /pages directory and use the javascript to extract the actual slug to fetch the content. Since both the static and dynamic parts can have hyphens, you can't just split on hyphens, so you could do something like this to get the appropriate static and dynamic part, something like this:
// You will obviously get this from the URL, not hard-coded like here
let params = {
slug: 'courses-demo-photography'
}
// List all of your possible categories
let categories = [
'courses-demo',
'courses-paid'
];
let category = categories.reduce(cat => params.slug.startsWith(cat) && cat)
let dynamicPart = params.slug.substring(category.length + 1)
console.log(category)
console.log(dynamicPart)