How to Deploy Next.js to Netlify Manually

Netlify's docs aren't that clear about how one can deploy a Next.js website to netlify manually. However, it's pretty simple.

Install netlify-cli and @netlify/plugin-nextjs

yarn add -D @netlify/plugin-nextjs
yarn add -D @netlify/plugin-nextjs

Docs:

Setup the netlify.toml file

Place the following in the root of your project:

netlify.toml

[[plugins]]
package = "@netlify/plugin-nextjs"

[build]
command = "yarn next build"
publish = ".next"

Docs:

Configure the NETLIFY_AUTH_TOKEN and NETLIFY_SITE_ID environment variables

How to generate NETLIFY_AUTH_TOKEN?

Generate the access token manually in your Netlify user settings for Personal access tokens:

  1. Under Personal access tokens, select New access token.
  2. Enter a description.
  3. Select Generate token.
  4. Copy the generated token to your clipboard. Once you navigate from the page, the token cannot be seen again.
  5. Save the token as a NETLIFY_AUTH_TOKEN environment variable in your terminal settings or in the UI of a Continuous Integration (CI) tool.

The above can alternatively be done via the command line

Docs:

How to find NETLIFY_SITE_ID?

This site ID can be found in the Netlify UI:

  1. Go to Site settings > General > Site details > Site information, and copy the value for API ID.
  2. Assign the ID to a NETLIFY_SITE_ID environment variable.

This can alternatively be done via the netlify link command.

Build and Deploy your Next.js application to Netlify

Deploying to production can be done via the following command:

netlify deploy --build --prod

Remember to add the build flag to the netlify deploy command. This doesn't work:

netlify build && netlify deploy --prod

Docs:

https://docs.netlify.com/cli/get-started/#run-builds-locally
https://docs.netlify.com/cli/get-started/#manual-deploys

Source

https://paulonteri.com/thoughts/how-to/deploy-nextjs-to-netlify-manually