JAVASCRIPT

environment variable in nextjs

//process.env only work in server not in browser so it will show undefined 
//to fixed it use NEXT_PUBLIC_before APi key in .env.local or .env 
//this solution only work from version 9 of nextjs.
NEXT_PUBLIC_BACKEND_API="http://localhost:1337/graphql"

Next js environment variables

// .env.local
DB_HOST=localhost
DB_USER=myuser
DB_PASS=mypassword

// pages/index.js
export async function getStaticProps() {
  const db = await myDB.connect({
    host: process.env.DB_HOST,
    username: process.env.DB_USER,
    password: process.env.DB_PASS,
  })
  // ...
}