4 replies

Next JS routing got me confused

Hey, I have this simple link in my component but im kinda confused with the routing.

<Link key={product.id}
data-type={product.type}
data-product={product.name}
href={`/shop/product/${product.name
.toLowerCase()
.replace(/\s+/g, '-')}`}
className={s.card}
>

<Link key={product.id}
data-type={product.type}
data-product={product.name}
href={`/shop/product/${product.name
.toLowerCase()
.replace(/\s+/g, '-')}`}
className={s.card}
>

<Link key={product.id}
data-type={product.type}
data-product={product.name}
href={`/shop/product/${product.name
.toLowerCase()
.replace(/\s+/g, '-')}`}
className={s.card}
>

<Link key={product.id}
data-type={product.type}
data-product={product.name}
href={`/shop/product/${product.name
.toLowerCase()
.replace(/\s+/g, '-')}`}
className={s.card}
>

What folder do I need to create and how do I match .toLowerCase and .replace methods in the folder name and shall I? I've read the docs in next js for this https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes but can't figure out what shall I do

Routing: Dynamic Routes | Next.js

Dynamic Routes can be used to programmatically generate route segments from dynamic data.

Next JS routing got me confused

Similar Threads

Similar Threads

Similar Threads