Sub-step 1: Create .env file

Follow these steps to create a .env file:

1. Run cp .env.example .env in your project root.
2. Open the .env file and fill in the required information.

Sub-step 2: Obtain Google API credentials

Retrieve Google API credentials for your app:

1. Go to the Google Cloud Console and navigate to APIs & Services > Credentials.
2. Under OAuth 2.0 Client IDs, download the credentials file.
3. Copy the Client ID and Client Secret into your .env file.

Sub-step 3: Configure Firebase settings

Set up Firebase credentials for your project:

1. Go to your Firebase project settings and navigate to Service accounts.
2. Generate a new private key and paste the keys into the .env file.
3. Format the private key correctly in the .env file.
4. Run cp firebase.ts.example firebase.ts in your project root.
5. Now, in the general project settings on firebase, scroll down to find the firebaseConfig. Copy that const firebaseConfig = ${...} and paste that in your firebase.ts file.

Sub-step 4: Enable Firebase Admin

Uncomment the Firebase Admin initialization in the firebase-admin.ts file.

Open firebase-admin.ts then push ctrl + a then ctrl + /then ctrl + s

Uncomment the FirebaseAuthProvider component wrapper in the layout.tsx file.

Open layout.tsx then uncomment line 28 and 31.

Turn this:
{/* <FirebaseAuthProvider> */}
<Header />
{children}
{/* </FirebaseAuthProvider> */}

To this:
<FirebaseAuthProvider>
<Header />
{children}
</FirebaseAuthProvider>

Sub-step 5: Test login

Save the changes and restart the development server to test the login functionality.