next.js SSG with dynamic routing
Unanswered
Common carp posted this in #help-forum
Common carpOP
I have a file like this app/[id]/page.tsx , The purpose is that when the user enters the ID, my page can be dynamically configured.
its work when i run npm run dev , but if i run npm run build for the static file , the page is return 404.
how can i use nextjs SSG with dynamic routing ?
its work when i run npm run dev , but if i run npm run build for the static file , the page is return 404.
how can i use nextjs SSG with dynamic routing ?
3 Replies
@Common carp I have a file like this app/[id]/page.tsx , The purpose is that when the user enters the ID, my page can be dynamically configured.
its work when i run npm run dev , but if i run npm run build for the static file , the page is return 404.
how can i use nextjs SSG with dynamic routing ?
you can use
generateStaticParams to generate static paths. Like that the page will be generated during build time and should be accessable after thatCommon carpOP
i check the document , it suggest me to use like :
but where can i get those id , my orignal design is for app/[id]/page.tsx , need to base on the id to configure my webpage?
and evan i setup the above generateStaticParams() , i serve the export out , input localhost:3000/3 <--- it also return 404
export function generateStaticParams() {
return [{ id: "1" }, { id: "2" }, { id: "3" }];
}but where can i get those id , my orignal design is for app/[id]/page.tsx , need to base on the id to configure my webpage?
and evan i setup the above generateStaticParams() , i serve the export out , input localhost:3000/3 <--- it also return 404
@Common carp i check the document , it suggest me to use like :
export function generateStaticParams() {
return [{ id: "1" }, { id: "2" }, { id: "3" }];
}
but where can i get those id , my orignal design is for app/[id]/page.tsx , need to base on the id to configure my webpage?
and evan i setup the above generateStaticParams() , i serve the export out , input localhost:3000/3 <--- it also return 404
The id is the dynamic part of your url. You can make database requests inside that function as well if you saved your ids inside your database