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

0 vote199 views1 answer
Typescript array of empty objects
TypeScript
1 vote206 views1 answer
Getstaticpaths in nextjs
TypeScript
0 vote188 views1 answer
Create and return a merged list of all the elements in sorted order
TypeScript
0 vote194 views1 answer
Is there somone controlling the puppets in peppermint park
TypeScript
3 votes192 views6 answers
Get multiple inputs in python
TypeScript
0 vote334 views1 answer
Typescript import variable from another file
TypeScript
3 votes179 views1 answer
Sort list of lists by first element
TypeScript
0 vote181 views2 answers
Typescript key value loop
TypeScript
1 vote191 views1 answer
Rscript arguments input
TypeScript
13 votes206 views4 answers
Ionic generate resources
TypeScript