MERN Stack: Implementing “Sign in with Google” Made Easy
Having the option to register your users using Google has many advantages. Not only is it safer, but it also saves you a lot of time.
In this article, I will show you how you can use passport-google-oauth20 to register a new user and save this user in your database. I am assuming that you already have a basic understanding of working with the MERN stack.
Starting setup.
Backend
At the root of my application, I have a folder named “backend”. In this folder live my “server.js” file and a .env file.
Frontend
In my components folder, I have a component named “Authentication.js” which is called in my “App.js” file.
My server is running on port 4000 and my React app on port 3000.
Setting up the database.
Install mongoose using npm.
npm i mongoose At the top of your “server.js” file import mongoose:
const mongoose = require('mongoose');Now we can connect to a new database. I am naming mine “projectDB”. Also, don’t forget to set “useCreateIndex” to true. We will be needing this later down the line.
