Crashlytics In Flutter - How to Integrate Firebase Crashlytics In Your Flutter Apps

July 07, 2021 Publish By : EXPERT APP DEVS 3 min read Viewed By : 795
Crashlytics In Flutter

As an app developer, developing and deploying apps at the Google play store or Apple store does now no longer mean that you have completed the mobile applications development cycle.

The mobile application development cycle includes keeping track of app performance, crash documents and solving stability issues.

At the end of this blog, you may learn the best approach on how to integrate Firebase Crashlytics in your Flutter apps.

What is Firebase Crashlytics ?

Firebase Crashlytics is a lightweight, realtime crash reporting approach that allows you to track, prioritize, and solve stability issues that erode app quality, in real time.

To integrate firebase Crashlytics on your flutter app, you want to follow these easy steps below.

Create a Project in Firebase

For creating a new project in firebase , please click on firebase console.

You will see the below screen in firebase project. Just press the create project button.
 

Create a Project in Firebase

By clicking on the Create project, you will navigate to create the project page like below. Just enter the project name and accept the terms and conditions then press the continue button.

Crashlytics project name define

You will navigate to the next page . in which you have to enable analytics toggle switch  and press the continue button.
 

Enable Google Analytics for Firebase Console Data


Just select the Account for firebase analytics and press the Create project Button.


After that firebase will create a project and you will navigate to Firebase dashboard.


 

Configure Google Analytics for Firebase


Setup Android Application to use firebase

Click on Android button to configure firebase for Android application.

 

Setup Android Application to use firebase



 

Add Firebase to your Android app

 

Add your application package name or sha1(Optional) and click on the Register app button like above Image.
 

download config file google-services json


 

After that download the google-services.json file and place it into the app folder in android like the above image.

Add below dependencies in android/build.gradle file.

buildscript {
repositories {
 
  google()
}
dependencies {
  ...
  // Add this line
  classpath 'com.google.gms:google-services:4.3.3'
  // Add the Firebase Crashlytics Gradle plugin.
  classpath 'com.google.firebase:firebase-crashlytics-gradle:2.0.0-beta02
}
}
allprojects {
repositories {   google()  // Google's Maven repository
}}


Add below dependencies in android/app/build.gradle 

File.

apply plugin: 'com.android.application'
apply plugin: 'com.google.firebase.crashlytics'


 

dependencies {
// Add the Firebase Crashlytics SDK.
implementation 'com.google.firebase:firebase-crashlytics:17.0.0-beta01'
}


Setup iOS Application to use firebase

Click on iOS button to configure firebase for iOS application.

 

Setup iOS Application to use firebase

 

Add Firebase to your iOS app

After that download the GoogleService-Info.plist file and place it into the Runner/Runner folder in your flutter app like the below image.


 

GoogleService-Info plist file place into the Runner


Implement firebase crashlytics plugin in flutter

Add below package dependency in pubspack.yaml like below.

 

firebase_crashlytics: "^0.2.0"

Use below code to add firebase crashlytics instance and get crash report.

 

void main() {

Crashlytics.instance.enableInDevMode = true;


FlutterError.onError = Crashlytics.instance.recordFlutterError;
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]).then((_) {
  SharedPreferences.getInstance().then((prefs) {
    var darkModeOn = prefs.getBool('appmode') ?? true;
    runZoned(() {
      runApp(ChangeNotifierProvider<ThemeNotifier>(
        create: (_) => ThemeNotifier(darkModeOn == true ? darkTheme : lightTheme),
        child: MyApp(),
      ));
    }, onError: Crashlytics.instance.recordError);
  });
});
}

Congratulations !! you successfully implemented firebase crashlytics in flutter.

You find the crashlytics option in the firebase dashboard side menu’s  report and monitor section under and click on it.you are able to see the firebase crashlytics report.

Need a consultation?

Drop us a line! We are here to answer your questions 24/7.