Environment Setup

Setting up Google OAuth

1. We need to create an application in the Google Developer console. Open Google Developer's Console
2. Create a new project.
3. Before you can access the Credentials, you will have to Configure the OAuth consent screen in the APIs & Services section.
4. In the OAuth consent screen, select User Type as: External and click Create, Input your Application Name, User Support Email and Developer Contact information and click Save and Continue.
5. Now you will have to select the scope of the project. Click on Add or Remove scopes and make sure there are selected and then click on Update and then Save and Continue.

6. Add any test users to the application who can log into the application while it is in the testing phase and click on Save and Continue.

7. Check the Summary and click on Back to Dashboard.

8. Now, Click on Create credentials > OAuth client ID.

9. In the Create OAuth ID screen, select Application Type as: Web Application. In Authorized Javascript origins, add the address where you are going to use these services (eg: http://localhost:3000), same with Authorized redirect URIs (eg: http://localhost:3000) and click on create.

10. Note the client ID provided.

Frontend

1. Create a file called .env in the root directory of the project that follows a similar template to the .env.example file. This template is also shown below.

REACT_APP_CLIENT_ID=the client id obtained from Google Developer console.
REACT_APP_BACKEND_ENDPOINT=http://localhost:8080
REACT_APP_BACKEND_SOCKETIO=http://localhost:8081

2. Replace the value of REACT_APP_CLIENT_ID with the client ID retrieved after setting up OAuth above.

Backend

Setting up Google Cloud Platform client ID

As per Google's Developer Terms of Service, the Client ID should not be embedded in open-source software. Hence the Client ID used to call Google's API, in order to verify the Google ID token, is set as an environment variable in the login endpoint. You must create a Google account (as explained by the instructions above, get your client ID and set it as an environment variable. Here is how:

• First, create your Google account and then go to "APIs and services" > "Enabled APIs and services" > "Credentials" from the Cloud Console.

• Take your client ID from here and copy it.

• Then, go to IntelliJ and set it as an environment variable.

• That's it! The variable will be used in the code like so:

public static final String CLIENT_ID = System.getenv("CLIENT_ID");

An example can be seen in the UserController class.