Blog

It's not something we like but app crashing is part and parcel of our job as a developer. This situation can always cause huge stress to the developer if the app is in production as users may instantly make a negative judgement on the app quality and leave a negative rating.

So any tool that makes handling this process convenient is always welcome and there is such a tool in Firebase Crashlytics.

Firebase Crashlytics is a lightweight, realtime crash reporter that helps you track, prioritize, and fix stability issues that erode your app quality.

Crashlytics saves you troubleshooting time by intelligently grouping crashes and highlighting the circumstances that lead up to them. For example you can figure out if a particular crash is impacting a lot of usersand get alerts when the issue suddenly increases in severity. You can even find out which lines of code are causing the crashes.

Firebase Crashlytics Example

We will look at a simple firebase crashlytics example. Here is the demo of the created project:

Step 1: Connect Your App

Start by adding Firebase to your app in the Firebase console.

Step 2: Install it

Install Firebase Crashlytics into your project. For us because we are using Flutter, this is very easy. Go to your pubspec.yaml and add both Firebase core and Firebase crashlytics under the dependencies, as follows:

dependencies:
  firebase_core: "0.5.0"
  firebase_crashlytics: "^0.2.1"

Step 3: Write Code

Start by adding imports:

import 'dart:async';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_crashlytics/firebase_crashlytics.dart';
import 'package:flutter/material.dart';

Create a CrashApp as a stateless widget:

class CrashApp extends StatelessWidget {

Override the build method and build a centalized column containing an elevated button:

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(

When this button is pressed instantiate the FirebaseCrashlytics using the instance property then invoke thelog() function, passing in the message:

              onPressed: () {
                //custom Crashlytics log message
                FirebaseCrashlytics.instance.log("It's a bug");

Then add anothe elevated button that when pressed causes the app to intentionally crash:

              },
              child: Text("Custom Log")),
          const SizedBox(height: 10),
          ElevatedButton(
            child: Text('Crash the app'),
            onPressed: () {
              FirebaseCrashlytics.instance.crash();
            },
          ),
        ],
      ),
    );
  }

Now create an app class as a statelesswidget:

class App extends StatelessWidget {

Here define an async method that will first initialize the firebase using the initializeApp() function, then subsequently the crashlytics using the setCrashlyticsCollectionEnabled(true) method:

  //initialise firebase and crashlytics
  Future<void> _initializeFirebase() async {
    await Firebase.initializeApp();
    await FirebaseCrashlytics.instance.setCrashlyticsCollectionEnabled(true);
  }

Now build and return a MaterialApp, setting the appbar and the title:

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Crash App"),
        ),

In the body of the MaterialApp, assign a FutureBuilder:

        body: FutureBuilder(

Initialize the Firebase by assigning the _initializeFirebase() function to the future:

          future: _initializeFirebase(),

If an error occurs show it in the textfield:

            if (snapshot.hasError) {
              return Center(
                child: Text("Unable to initialise Firebase"),
              );
            }

Otherwise deliberately crash the app:

            //firebase and crashlytics initialise complete
            if (snapshot.connectionState == ConnectionState.done) {
              return CrashApp();
            }

Here is the full code:

main.dart

import 'dart:async';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_crashlytics/firebase_crashlytics.dart';
import 'package:flutter/material.dart';
main() {
  WidgetsFlutterBinding.ensureInitialized();
  runZonedGuarded(() {
    runApp(App());
  }, (error, stackTrace) {
    // Pass all uncaught errors from the framework to Crashlytics.
    FirebaseCrashlytics.instance.recordError(error, stackTrace);
  });
}
class App extends StatelessWidget {
  //initialise firebase and crashlytics
  Future<void> _initializeFirebase() async {
    await Firebase.initializeApp();
    await FirebaseCrashlytics.instance.setCrashlyticsCollectionEnabled(true);
  }
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Crash App"),
        ),
        body: FutureBuilder(
          future: _initializeFirebase(),
          builder: (context, snapshot) {
            if (snapshot.hasError) {
              return Center(
                child: Text("Unable to initialise Firebase"),
              );
            }
            //firebase and crashlytics initialise complete
            if (snapshot.connectionState == ConnectionState.done) {
              return CrashApp();
            }
            return Center(
              child: Column(
                children: [
                  CircularProgressIndicator(),
                  Text("Initialising Firebase")
                ],
              ),
            );
          },
        ),
      ),
    );
  }
}
class CrashApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(
              onPressed: () {
                //custom Crashlytics log message
                FirebaseCrashlytics.instance.log("It's a bug");
              },
              child: Text("Custom Log")),
          const SizedBox(height: 10),
          ElevatedButton(
            child: Text('Crash the app'),
            onPressed: () {
              FirebaseCrashlytics.instance.crash();
            },
          ),
        ],
      ),
    );
  }
}

Step 4: Check reports

Go check the reporst in the Firebase console

You can Visit the Firebase console to track, prioritize, and fix issues in your app.

Reference

No.	Link
1.	Read more about Firebase Crashlytics
2.	Download code
3.	Follow code author