Installing the Netlify Nextjs plugin

Netlify Nextjs plugin enables Next's dynamic features including dynamic routes, API routes, and Preview Mode, etc on the netlify functions platform.

The plugin installs automatically for new Next.js sites on Netlify. You can also install it manually like this:

yarn add @netlify/plugin-nextjs -D

...then add the plugin to your netlify.toml file:

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

The final netlify.toml file would look like, below

[build]
  # nextjs build command
  command = "next build"

  # nextjs output directory   
  publish = ".next" 

  # default ignore command
  ignore = "git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF ."  

[[plugins]]
# netlify nextjs plugin that helps nextjs ISR and SSR and API routes, etc
package = "@netlify/plugin-nextjs"

Deploy the nextjs project

-> Create a new Netlify site using the netlify dashbaord. UI. First, visit app.netlify.com/start in your browser.

-> Choose your preferred Git provider from the options and authorize Netlify to access the repository you want to deploy.

-> In the next screen, select your Next.js repo from the list. -> We can see that, it automatically picked up the build command and publish directory. -> Choose the owner and branch to deploy -> Click "Deploy Site"

Happy Netlifying!!