How can I run Next.js on localhost through HTTPS?

Next.js supports generating self-signed certificates for use with local development when running next dev. This guide will show how to use Next.js with HTTPS on localhost.

Ensure you are on the latest version of Next.js (npm i next@latest). If you do not already have a Next.js project created, you can get started with npx create-next-app@latest.

For certain features, it may be required to use HTTPS to have a secure environment on localhost. Next.js supports generated self-signed certificates for use with next dev as follows:

next dev --experimental-https

This will start the Next.js development server with HTTPS enabled on https://localhost:3000.

• These self-signed certificates should only be used for local development. In production, use properly issued certificates from trusted authorities. When deploying to Vercel, HTTPS is automatically configured for your Next.js application with zero additional work.
• For specific testing scenarios, you might need to use real certificates and actual domains. This can be achieved by modifying the /etc/hosts file to map domain names to 127.0.0.1.

Next.js has built-in support for securely running your application on localhost with HTTPS. You can get started by running next dev --experimental-https.