Joshua L
Joshua L

Reputation: 23

Dynamic user profile templates in Next.js

I want to build a templating engine for user profiles. After picking a design, which might consist of HTML, CSS, and JS, I would like to be able to server-side/static render a users profile page using their chosen template.

I'm looking for a good place to start / for someone to point me in the right direction. Assuming there are templates already stored in a database, or saved as files to AWS, how might I dynamically load and render the template along with the users profile data using Next.js? What might be an optimal way of storing the templates?

Thank you,

Upvotes: 0

Views: 1301

Answers (1)

Try use nextjs GetStaticProps or GetStaticPatch

https://nextjs.org/docs/basic-features/data-fetching/get-server-side-props https://nextjs.org/docs/basic-features/data-fetching/get-static-props

write this function in some NextPage file

export async function getStaticProps(context) {
  //all logic done here will be rendered server-side.
  return {
    props: {}, // will be passed to the page component as props
  }
}

It can consume a database within this layer, do not want to use an external API, in some projects I use the ORM Prisma to facilitate the process.

https://www.prisma.io/nextjs

// Fetch all posts (in /pages/index.tsx)
export async function getStaticProps() {
  const prisma = new PrismaClient()
  const posts = await prisma.post.findMany()

  return {
    props : { posts }
  }
}

Upvotes: 0

Related Questions