React Redux OAuth Login Using Google API

I. Introduction

In this blog, we will demonstrate how we can integrate Google API Library to provide an OAuth login form in a react project. The state of whether a user is currently logged or not is stored in redux so that it will be easily accessible to the rest of the components.

II. Get your API Credentials from Google Console

1.) Create a new project in https://console.developers.google.com/.

2.) Create a new OAuth consent screen.

3) Create a new OAuth credential.

Leave all the default parameters and only change the Authorized JavaScript origins value and set to http://localhost:3000 as this is where our react project is running.

4.) Clone the project from https://github.com/czetsuya/google-oauth-react-redux.

5.) Learn how this project works by watching the Youtube video above.