Implemented Google Sign-in/Log-in Functionality

[mismathh]

Resolves #5

Google API Integration

• Integrated OAuth 2.0 authentication with Google services using Google Cloud Console
  • *Need to acquire GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET from Google Developer Console and place it in .env

User Interface

• Implemented a button design to provide the option for users to login with their Google account on either the login or registration page

Backend Changes

• Created endpoints to handle Google requests
• Updated the Passport strategy in the auth.js file with a GoogleStrategy to verify and handle data sent by the Google API
  • If user is not found in the database based on the googleId, it will create a new account for the user

User Data Handling

• Added a googleId field to the UserSchema to store a unique identifier for a Google account.
  • If user logs/signs in with Google account, this googleId will be used to verify the user instead of name/password.
  • Additionally, the display name is pulled from the Google account to populate the name field in the database.

*Acquiring GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET

Step 3 from the article you provided from the issue was helpful, but doesn't provide all the steps needed to be done.
Prior to following steps outlined in the article head to Google Cloud Console and :

• Create a new project
• Set up OAuth consent screen
  • User type must be external unless you have a Google Workspace account
  • Set the app name, user support email and Developer contact information
• Add a scope
  • Select the ../auth/userinfo.profile scope to acquire profile information (contains profile id that will be stored in googleId)
• Add test users that will be able to access the app
  • App needs to be published to allow for more public users to access app

Now Step 3 outlined in the article can be followed to acquire the GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET

• One more step needs to be done while following Step 3
  • Step 3.3: Additionally, need to add http://localhost:3000 to the Authorised JavaScript origins section
    

Finally add values to .env file.

GOOGLE_CLIENT_ID=your-client-id
GOOGLE_CLIENT_SECRET=your-client-secret