Social login helps users to log in to the app without spending much time filling the forms, It’s a must feature in modern mobile applications. In this blog, I integrate Google login with the help of React Native Firebase,react-native-google-signin.
1.First install the firebase module
npm install — save @react-native-firebase/app
2.Then Create an ios project and download the configuration file GoogleService-Info.plist from firebase
URL: https://console.firebase.google.com/
3.Open Xcode and add the file to the project
4.Open AppDelegate.m
At the top of the file, import the Firebase SDK:
#import <Firebase.h>
Within your existing didFinishLaunchingWithOptions method, add the following to the top of the method:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
if ([FIRApp defaultApp] == nil) {
[FIRApp configure];}}
5.Enable google login within authentication in firebase
Goto firebase =>authentication=>sign in providers
Enable Google
6.Install authentication module
yarn add @react-native-firebase/auth
cd ios/ && pod install
7.Now open app.js
import auth from ‘@react-native-firebase/auth’;
// Set an initializing state with Firebase connects
const [initializing, setInitializing] = useState(true);
const [user, setUser] = useState();
// Handle user state changes
function onAuthStateChanged(user) {
setUser(user);
if (initializing) setInitializing(false);
}
useEffect(() => {
const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
return subscriber; // unsubscribe on unmount
}, []);
8.Install the google-login module
yarn add @react-native-google-signin/google-signin
9.install the Google Sign-in SDK with CocoaPods: add pod ‘GoogleSignIn’, ‘~> 5.0.2’ in your Podfile and run pod install
10.pod repo update
11.Configure URL types in the Info panel
import { GoogleSignin } from ‘@react-native-google-signin/google-signin’;
GoogleSignin.configure({webClientId: ‘’,});
import { GoogleSignin } from ‘@react-native-google-signin/google-signin’;
async function onGoogleButtonPress() {
// Get the users ID token
const { idToken } = await GoogleSignin.signIn();
// Create a Google credential with the token
const googleCredential = auth.GoogleAuthProvider.credential(idToken);
try {
let loginUser = await auth().signInWithCredential(googleCredential);
setGoogleLogin(true);
} catch (error) {
setGoogleLogin(false);}}
12.install pod and run the app npx pod-install ,npx react-native run-ios
Github : https://github.com/Ajithmanali/react-native-google-login.git