This content originally appeared on DEV Community and was authored by Aya Bouchiha
Hi I'm Aya Bouchiha, I decided to share with you my favorite react library for providing logging in and logging out with google functionalities in my react apps which is react-google-login.
react-google-login
installation
npm i react-google-login
yarn add react-google-login
Login code
If you don't have a client Id, please check this article: how to get google client id and client secret.
import GoogleLogin from 'react-google-login';
const Login = () => {
const handleSuccess = (response) => {
console.log(response);
alert("you're logged in successfully!");
};
const handleFailure = () => {
alert('something went wrong');
};
return (
<>
<GoogleLogin
// you client Id
clientId={process.env.CLIENT_ID}
buttonText='Login'
onSuccess={handleSuccess}
onFailure={handleFailure}
// for calling onSuccess callback when the page load to keep the user logged in.
isSignedIn={true}
/>
</>
);
};
Logout code
import { GoogleLogout } from 'react-google-login';
const Logout = () => {
const handleLogout = () => {
alert("you're logged out!!!");
};
return (
<GoogleLogout
clientId={process.env.CLIENT_ID}
buttonText='Logout'
onLogoutSuccess={handleLogout}>
</GoogleLogout>
);
};
Have a nice day
This content originally appeared on DEV Community and was authored by Aya Bouchiha

Aya Bouchiha | Sciencx (2021-09-04T00:40:53+00:00) My Favourite Library For Providing Logging In & Logging Out With Google Functionalities In My React Apps. Retrieved from https://www.scien.cx/2021/09/04/my-favourite-library-for-providing-logging-in-logging-out-with-google-functionalities-in-my-react-apps/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.