NextJs Error - You can not use getStaticProps with getServerSideProps. To use SSG, please remove getServerSideProps

 

When page uses getServerSideProps nextjs will try to server side render the page . That is getServerSideProps  executes api fetch calls to get data & feed into the page and return the page html (all this is done on the server side).

getServerSideProps  gets triggered "at request time" aka when someone (browser) requests a page which has been marked as SSR . It gets triggered on each request.

getStaticPaths gets triggered "at build time" aka when the next build command is used. Pages which uses getStaticPaths gets data from the motioned sources and creates static html pages.

To fix issue first decide whether the current page should be a static html page !

If the answer is yes then remove the getServerSideProps and keep using getStaticProps . This will make the current page static html page.

If  the answer is no then remove the getStaticProps and keep using getServerSideProps . This will make the current page to be server side rendered . So on each request , the latest data is fetched and fed into the page template and a complete html page is returned with the latest version of data .

You might also encounter other errors when using the getServerSideProps :

• `undefined` cannot be serialized as JSON. Please use `null` or omit this value.
• Your `getServerSideProps` function did not return an object. Did you forget to add a `return`?
• You can not use getStaticProps with getServerSideProps. To use SSG, please remove getServerSideProps