How to deploy a next.js project in netlify?
1 min read
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
[[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"