Next.js Discord

Discord Forum

How can i create a page for each name in my database

Answered
Asiatic Lion posted this in #help-forum
Open in Discord
Asiatic LionOP
Hello guys
I have a question as im new to the Next routing,
I want to make a new page for each Page : Name in my database (Like /services/{name from database}
How is that possible? i tried doing it :
services/[name]/page.tsx
but i don't know what i should do in the code
Appreciate if you can help me :))
Answered by Stony gall
@Hackberry nipple gall parasitoid You could try to use generateStaticParams() which allows you to generate routes in build time. https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes#generating-static-params here is a docs about that
View full answer

9 Replies

Arinji
That's..correct @Asiatic Lion
Inside the [name] folder make a page.tsx
Stony gall
the name is passed into page.tsx as params and you can take the value of that, then you can show content based on the value or return NotFound or some error state if the name does not exist in your database
@Arinji Inside the [name] folder make a page.tsx
Asiatic LionOP
What i have to put in it?
Golden paper wasp
const NamePage = async ({ params }: { params: { name: string } }) => {
const userName = params.name

const nameData = await db.query.name.findFirst({
  where: eq(names.name, userName)
}

return <></>
Hackberry nipple gall parasitoid
@Stony gall how can we statically generate the page for each name, I have the same problem, I'm trying to statically generate each page on my website with locales, i.e [locale]/about/page.tsx for example. How can I generate the whole site pages on build time ?
Answer
Stony gall
like here for example 
export async function generateStaticParams() {
  return [{ lang: 'en-US' }, { lang: 'de' }]
}
 
export default function Root({ children, params }) {
  return (
    <html lang={params.lang}>
      <body>{children}</body>
    </html>
  )
}