Integrating Firebase with React Native

Pradeep Sharma
3 min readAug 3, 2022

In this post, we’ll learn how to integrate Firebase in React Native

What is Firebase?

Firebase is a platform developed by Google for creating mobile and web applications, it’s a Backend-as-a-Service (Baas). It provides developers with a variety of tools and services to help them develop quality apps, grow their user base, and earn profit. It is built on Google’s infrastructure.

Create a New Firebase Project

For the integration of push notification, we need to create a firebase project first Click on Add project to create a project

When you click on Add Project Button it will ask you for your project name, fill your project name in the project name input box, accept their terms and condition and click on Create Project button

we need to create an Android app on Firebase. For that, we need a package name and certificate SHA-1 from our app

We can get the package name in android\app\src\main\AndroidManifest.xml

To Get SHA-1 for Windows:-

First, locate your JDK’s bin folder on your windows pc.

C:\Program Files\Java\jdk1.8.0_131\bin

  • Then open Command Prompt as Administrator mode on the same path and enter the command
keytool -genkeypair -v -storetype PKCS12 -keystore myKey.keystore -alias androiddebugkey -keyalg RSA -keysize 2048 -validity 10000
  • enter the store password: 123456
  • then enter this command
keytool -keystore myKey.keystore -list -v
  • then you get the SHA-1 key copy it and paste it into firebase

copy a debug. keystore file from java bin and paste it into android/app

Register the app

  • download the google-services.json file and paste it into the android/app

Step 2. Install dependencies for Firebase

Installation

Installing React Native Firebase requires a few steps; installing the NPM module, adding the Firebase config files & rebuilding your application.

1. The @react-native-firebase/app module must be installed before using any other Firebase service.

# Using npm
npm install --save @react-native-firebase/app
# Using Yarn
yarn add @react-native-firebase/app

2. Android Setup

To allow the Android app to securely connect to your Firebase project, a configuration file must be downloaded and added to your project.

  • First, add the google-services plugin as a dependency inside of your /android/build.gradle file:
buildscript {
dependencies {
// ... other dependencies
classpath 'com.google.gms:google-services:4.3.13'
// Add me --- /\
}
}
  • Lastly, execute the plugin by adding the following to your /android/app/build.gradle file:
apply plugin: 'com.android.application'
apply plugin: 'com.google.gms.google-services' // <- Add this line

That’s it Firebase is integrated now you can use any of its services. for that, you have to install their dependencies and packages first then u able to use any of it’s services

If you enjoyed this article, share it with your friends and colleagues!

--

--