Using Nextjs’s built in support for env. variables

Next.js has built-in support for loading environment variables from .env.local into process.env.

Tried, it worked!

Some mistakes I made:

  1. I named the file something.env.local - it didnt work - file should be on root with name .env.local. gitignore from nextjs also gives an idea of what this filename should be:
# local env files
.env*.local

Accessing user data (name, email)

Using session.user.email

in pages\index.js:

import NoteList from "../components/home/NoteList";
import DBManager from "../db/DBManager";
import { useSession } from "next-auth/react";

export default function Home(props) {
  const { data: session } = useSession();

  if (session) {
    console.log(`User: -- ${session.user.email}`);
    return <NoteList notes={props.notes} user={props.user} />;
  } else {
    return <h1>SignIn to continue</h1>;
  }
}

export async function getStaticProps() {
  const notesObj = await DBManager.getAllNotes();
  const notes = JSON.parse(JSON.stringify(notesObj));
  console.log(`This is original props, notes = ${JSON.stringify(notes)}`);
  return {
    props: {
      notes,
    },
  };
}

The console log prints on browser console! It Works!