How can I deploy a Next.js App to Netlify?

Question

I am currently facing an issue with my Next.js app deployment. After following a guide from netlify’s blog on how to create Server-side rendered App using netlify for Next.js, I was able to have a successful build but my site seems not to be working.

The site is currently at https://sleepy-murdock-8d5427.netlify.app/. The error message will be pasted below.

{
"errorType": "Runtime.UnhandledPromiseRejection",
"errorMessage": "FetchError: request to http://localhost:3000/api/notes failed, reason: connect ECONNREFUSED 127.0.0.1:3000",
"trace": [
"Runtime.UnhandledPromiseRejection: FetchError: request to http://localhost:3000/api/notes failed, reason: connect ECONNREFUSED 127.0.0.1:3000",
" at process.<anonymous> (/var/runtime/index.js:35:15)",
" at process.emit (events.js:315:20)",
" at processPromiseRejections (internal/process/promises.js:209:33)",
" at processTicksAndRejections (internal/process/task_queues.js:98:32)"
]
}

• Gokhan Sari: Netlify doesn't support server-side rendered next.js apps. Which guide did you follow?
• Mhd: netlify.com/blog/2020/06/10/… This one.

Answer 1

Netlify can serve only static webpages. I do not recommend serving ssr apps on netlify for this reason. -> It will create your ssr app to a static webpage. Because of this most of the next.js functions like getStaticProps and getStaticPaths would not work. You need to have functions for that.

To serve a serve-side-rendering app on netlify, you have to build and export every page.

To do that, I added these lines to my package.json file.

{
 "scripts": {
 "build: "next build",
 "export": "next export",
 "deploy": "npm run build && npm run export"
 }
}

You site should be live and rendered as a static application when you deploy it to netlify.