I am working on nextjs and i have "blog" list and after click on blog,page redirect to "blog detail page" And current url is like
"http://localhost:3001/29"
Which is working fine,But i want my url should be like
http://localhost:3001/slug/posttitle
My current code for "Link" is which is working fine
<Link href={{pathname: "/[id]",query: { id: post.id },}}>
But for change "id" to "slug" in url,i tried with following code
<Link href={{pathname: "/[slug]",query: { title: post.title },}}>
But my url convert to "http://localhost:3001/[slug]?id=myslug"
Since your root page "/" is already your blog section which contains the list of all your blog posts previews, you could create a folder called article inside the pages folder for example, and then inside that folder create your dynamic post page based on the post's slug: [slug].js. So the route would be: example.com/article/your-post-slug.
Inside your [slug].js page, you need to use getStaticPaths and getStaticProps to pre-render all the paths for each individual post and also, the content for each one.
Of course, in your main page you also have to use getStaticProps to fetch all your posts.
In your main page, wrap each post preview with a Link that points to: /article/${slug}. Hope that helps.