In this article i will explain you step by step how you can add google and facebook authentication with firebase in your react native android application

Step 1: Create a new project

• Go to this link https://console.firebase.google.com/u/0/ and create a new project

• Once project is created on dashboard you will see the following screen click on android icon to create new android app

  

• You will see below screen

  

• You can find the package name in the AndroidManifest.xml file which is located in android/app/src/main/.

• You will also need the Debug signing certificate SHA-1. You can get that by running the following command in the project directory.

   cd android && ./gradlew signingReport

  Copy the SHA1 value and paste it into the Firebase console.

• Now, proceeding to the next step, you will have to download the google-services.json file. You should place this file in the android/app directory.

  

• After adding the file, proceed to the next step. It will ask you to add some configurations to Root-level (project-level) Gradle file (/build.gradle).

buildscript {
  repositories {
    // Make sure that you have the following two repositories
    google()  // Google's Maven repository
    mavenCentral()  // Maven Central repository

  }
  dependencies {
    ...
    // Add the dependency for the Google services Gradle plugin
    classpath 'com.google.gms:google-services:4.3.13'

  }
}

allprojects {
  ...
  repositories {
    // Make sure that you have the following two repositories
    google()  // Google's Maven repository
    mavenCentral()  // Maven Central repository

  }
}

• Add the configuration to the Module (app-level) Gradle file (//build.gradle):

plugins {
  id 'com.android.application'

  // Add the Google services Gradle plugin
  id 'com.google.gms.google-services'

  ...
}

dependencies {
  // Add these lines
  implementation platform('com.google.firebase:firebase-bom:30.4.1')
  implementation 'com.google.firebase:firebase-auth'
}

• As a next step install the following package in your application

npm install @react-native-firebase/app

Step 2: Setting up firebase google authentication

• Go to the Authentication section in the dashboard and click on the Get Started button. This will enable the authentication module in your project.

• Next, you should enable google authentication in the sign-in methods. Once you’ve enabled it, press Save.

• Install the @react-native-firebase/auth and google signin package in your project.

  npm install @react-native-firebase/auth --save
  npm install @react-native-community/google-signin --save

Step 3: Google signin in our react native application

• Go to App.js of your react native application and configure the GoogleSignIn using webClientId which you can find in found in the google-services.json file in android/app as the client/oauth_client/client_id property.

  //Inside App.js file
  
  import auth from "@react-native-firebase/auth";
  import { GoogleSignin } from "@react-native-community/google-signin";
  
  GoogleSignin.configure({
    webClientId:
      "260759292128-4h94uja4bu3ad9ci5qqagubi6k1m0jfv.apps.googleusercontent.com",
  });

• You can add following piece of code inside function in any component your prefer to have Google SignIn working

import auth from "@react-native-firebase/auth";
import { GoogleSignin } from "@react-native-community/google-signin";
async function onGoogleButtonPress() {
  const { idToken } = await GoogleSignin.signIn();
  const googleCredential = auth.GoogleAuthProvider.credential(idToken);
  return auth().signInWithCredential(googleCredential);
}

• Once you are authenticated you can check whether user is authenticated by following piece of code

import auth from "@react-native-firebase/auth";

auth().onAuthStateChanged((user) => {
  if (user) {
    console.log("Authenticated");
  } else {
    console.log("Not authenticated");
  }
});

• You can logout from your application using following code

import auth from "@react-native-firebase/auth";

auth().signOut();