#Turning a server side page into static page in Next 13

19 messages · Page 1 of 1 (latest)

mossy badge
#

Hello, I have a page that contains a list of projects. I want to turn it into a static page instead of having the loader when a request is made to that page since the content doesn't change a lot.

Previously we would use getStaticProps to do so. I'm aware of generateStaticParams however it doesn't seem to be sending the data as props but as dynamic params, and this page has a fixed url.

Current page implementation is as follows:

const ProjectsPage = async () => {
  const projects = await getProjects()

  return (
    <div className="flex flex-col gap-20">
      <div className="flex items-center justify-between">
        <h1>Projects</h1>
        <ProjectsViewType />
      </div>
      <ProjectsList projects={projects} />
    </div>
  )
}

export default ProjectsPage
drowsy lightBOT
#
Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

wise crag
#

have you tried building it?

mossy badge
wise crag
#

did you use any of the (request-time)-specific features?

#

using headers() cookies(), will turn it into lambda

#

basically, i can't tell for sure since i don't know what you put in
getProjects and ProjectsViewType and ProejctsList

wise crag
mossy badge
#

i don't think so, here's getProjects

const getProjects = async () => {
  const prisma = new PrismaClient()
  const projects = await prisma.project.findMany({
    where: {
      isPublic: true,
    },
    orderBy: {
      createdAt: 'desc',
    },
  })
  return projects
}

ProjectsViewType is just a client component that allows a user to switch and store user preferences, and ProejctsList is the a display based on that preference

wise crag
#

hmm do you have link to repo?

mossy badge
#

i can't share it

wise crag
#

oh

#

well

#

you can force it using
export const dynamic = 'force-static'
or
export const dynamic = "error"

#

the former will try to make it static
the latter will throw an error if dynamic features are used when its meant to be a static route

fiery musk
#

@mossy badge Since you have zero control over how PrismaClient works, and Next assumes it makes the page dynamic, please feel free to use export const dynamic = 'force-static'

#

Personally, I prefer the declarative style of at least using error, because the Next guesses seem totally random

drowsy lightBOT
#
✅ Success!

This question has been marked as answered! If you have any other questions, feel free to create another post

Jump to answer

[Click here](#1152355707006496829 message)

#
✅ Success!

This question has been marked as answered! If you have any other questions, feel free to create another post

Jump to answer

[Click here](#1152355707006496829 message)