Getserversideprops

Next js getserversideprops

export async function getServerSideProps(context) {
  return {
    props: {}, // will be passed to the page component as props
  }
}

Source: nextjs.org

Getserversideprops

export async function getStaticPaths() {
  const res = await fetch(`${baseUrl}/wp-json/wp/v2/posts`)
  const posts = await res.json()
  //paths is array of objects which is contains one params property with id or slug
  const paths = posts.map(({ slug }) => ({ params: { slug: `${slug}` } }))

  return {
    paths,
    //fallback true mean there is no slug in build time then it will not shown 404 error 
    // and fetch data from server and show it
    fallback: true,
  }
}

Getserversideprops vs getstaticprops

use getServersideProps when data will change after time like wordpress post
which will be changing when new we add new post.
Use getStaticProps when it is static content using it make it cache in.nextjs
so it will load fast.
//Note if you use getStaticProps in dynamic content section then content which 
//is added after deployment will not shown cause it also shown content from cache.

Similar codes

1 vote267 views1 answer
Stored procedure that selects in to a table
TypeScript
1 vote303 views2 answers
No type arguments expected for interface Callback
TypeScript
0 vote297 views1 answer
Convert given seconds to space age on all planets of our solar system
TypeScript
0 vote267 views1 answer
Using method parameters in a guard nestjs
TypeScript
5 votes280 views1 answer
Vscode change comments color
TypeScript
1 vote277 views1 answer
Typescript array of react elements
TypeScript
-1 vote272 views1 answer
Insert if not exists mysql
TypeScript
0 vote299 views1 answer
Property does not exist on type 'DefaultRootState'
TypeScript
0 vote277 views1 answer
How to send attachments to node mailer file not found
TypeScript
14 votes297 views6 answers
How to install bootstrap in angular 11
TypeScript