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 vote250 views1 answer
How to clear all the dropdown elements in jquery
TypeScript
0 vote288 views1 answer
What are the used of curly brackets in react functions
TypeScript
3 votes262 views1 answer
Checking if a substring exists in a string r
TypeScript
0 vote238 views1 answer
When to test analysis
TypeScript
2 votes271 views1 answer
Eslint prettier typescript
TypeScript
0 vote257 views1 answer
Non-abstract class does not implement inherited abstract member typescript
TypeScript
1 vote255 views2 answers
Append to lists python
TypeScript
0 vote245 views1 answer
Pnpjs get items from list
TypeScript
0 vote246 views1 answer
Npm run scripts does not work
TypeScript
0 vote253 views1 answer
Conditional statements in ti-82
TypeScript