Installation

Firebase project

Learn how to set up a Firebase project for your TurboStarter mobile app.

For some features of your mobile app, you will need to set up a Firebase project. It's a requirement enforced by how these features are implemented under the hood and we cannot change it.

You would need a Firebase project to use the following features:

Here, we'll go through the steps to set up a Firebase project and link it to your mobile app.

Development build required

In development environment, the integration with Firebase is possible only when using a development build. It means that it won't work in the Expo Go app.

Create a Firebase project

First things first, you need to create a Firebase project. You can do this by going to the Firebase console and clicking on "Add Project":

Create a Firebase project

Name it as you want, and proceed to the dashboard.

Install Firebase SDK

To install React Native Firebase's base app module, run the following command in your mobile app directory:

npx expo install @react-native-firebase/app

Configure Firebase modules

The recommended approach to configure React Native Firebase is to use Expo Config Plugins.

To enable Firebase on the native Android and iOS platforms, create and download Service Account files for each platform from your Firebase project.

You can find them in the dashboard under the Firebase project settings:

Download Service Account files

For Android, it will be a google-services.json file, and for iOS it will be a GoogleService-Info.plist file.

Then provide paths to the downloaded files in the following app.config.ts fields: android.googleServicesFile and ios.googleServicesFile. This is how an example configuration looks like:

app.config.ts
export default ({ config }: ConfigContext): ExpoConfig => ({
  ...config,
  ios: {
    googleServicesFile: "./GoogleService-Info.plist",
  },
  android: {
    googleServicesFile: "./google-services.json",
  },
  plugins: [
    "@react-native-firebase/app",
    [
      "expo-build-properties",
      {
        ios: {
          useFrameworks: "static",
        },
      },
    ],
  ],
});

For iOS only, since firebase-ios-sdk requires use_frameworks you need to configure expo-build-properties by adding "useFrameworks": "static".

Listing a module in the Config Plugins (the plugins array in the config above) is only required for React Native Firebase modules that involve native installation steps - e.g. modifying the Xcode project, Podfile, build.gradle, AndroidManifest.xml etc. React Native Firebase modules without native steps will work out of the box.

Generate native code

If you are compiling your app locally, you'll need to regenerate the native code for the platforms to pick up the changes:

npx expo prebuild --clean

Then, you could follow the same steps as in the development environment setup guide to run the app locally or build a production version of your app.

Et voilà! You've set up and linked your Firebase project to your mobile app 🎉

You can learn more about the Firebase integration and it's possibilities in the official documentation.

Last updated on

On this page

Ship your startup everywhere. In minutes.Get TurboStarter