React native Question posted in
The official React Native documentation can be found here.

React native – How to connect connect firebase to react-native app?

I’m new in react native, and I’m creating a simple test app. I followed the firebase documentation and inserted the dependencies and the google-services.json file. The problem is that now I would like to read the data from my realtime database, and following the documentation I did something like this:

...
import { firebase } from '@react-native-firebase/app';

const Categories = () => {
const reference = firebase
.app()
.database('https://testapp-app-default-rtdb.euorpe-west1.firebasedatabase.app/')
.ref('/categories');
...

But if I running the command from the terminal: npx expo start to test the application on my Android phone, the console gives me this error:

ERROR  Error: You attempted to use a firebase module that's not installed on your Android project by calling firebase.app().
Ensure you have:
1) imported the 'io.invertase.firebase.app.ReactNativeFirebaseAppPackage' module in your 'MainApplication.java' file.
2) Added the 'new ReactNativeFirebaseAppPackage()' line inside of the RN 'getPackages()' method list.

How can i solve this to test my app with db?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    For Anwer, this is my updated dependencies:

    "@react-native-firebase/app": "19.1.1",
"@react-native-firebase/database": "19.1.1",

    And this is my app.json:

        {
  "expo": {
    "name": "testapp",
    "slug": "testapp",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./src/assets/images/icon.png",
    "userInterfaceStyle": "light",
    "splash": {
      "image": "./src/assets/images/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "googleServicesFile": "./GoogleService-Info.plist",
      "bundleIdentifier": "it.myname.testapp",
      "supportsTablet": true
    },
    "android": {
      "googleServicesFile": "./google-services.json",
      "adaptiveIcon": {
        "foregroundImage": "./src/assets/images/adaptive-icon.png",
        "backgroundColor": "#ffffff"
      },
      "package": "it.myname.testapp"
    },
    "web": {
      "favicon": "./src/assets/images/favicon.png"
    },
    "plugins": [
      "@react-native-firebase/app",
      [
        "expo-build-properties",
        {
          "ios": {
            "useFrameworks": "static"
          }
        }
      ]
    ]
  }
}

    I also inserted the "google-services.json" file in my Android/app folder and the other part in build.gradle, app/build.gradle and the import in MainApplication.kt


  2. 0

    According to the documentation of React Native Firebase you are importing the the firebase module from @react-native-firebase/app instead of @react-native-firebase/database

    Once successfully linked and rebuilt, your application will be connected to Firebase using the @react-native-firebase/app module. This module does not provide much functionality, therefore to use other Firebase services, each of the modules for the individual Firebase services need installing separately.

    So you have to install the Realtime-Database module to read data. Install the module using the command npm install @react-native-firebase/database rebuild the app.
    Then simply import the database:

    import database from '@react-native-firebase/database';
const reference = database().ref('/categories');

    If the database is not ‘us-central1’, that is your case, you can import it as below:

    import { firebase } from '@react-native-firebase/database';

const reference = firebase
  .app()
  .database('https://testapp-app-default-rtdb.euorpe-west1.firebasedatabase.app/')
  .ref('/categories');
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search