The Complete Guide to Flutter/

...

/

Fireabse Analytics

Fireabse Analytics

Learn to measure your Flutter app’s usage and user engagement using Firebase Analytics.

We'll cover the following...

In this lesson, we will use Firebase Analytics to get insights into our app’s usage and user engagement. Analytics reports will help us clearly understand how our app’s users behave. Armed with this information, we’ll be able to make informed decisions about our app’s performance and marketing optimizations.

To use Firebase Analytics in our application, we’ll follow the steps below:

  1. Creating a project on Firebase Console
  2. Setting up the platform
  3. Installing the firebase_core and firebase_analytics packages
  4. Initializing Firebase
  5. Logging events
  6. Tracking events on the Firebase Analytics dashboard
<!DOCTYPE html>
<html>
<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

    This is a placeholder for base href that will be replaced by the value of
    the `--base-href` argument provided to `flutter build`.
  -->
  <base href="/">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="starter">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png"/>

  <title>starter</title>
  <link rel="manifest" href="manifest.json">

  <script>
    // The value below is injected by flutter build, do not touch.
    var serviceWorkerVersion = null;
  </script>
  <!-- This script adds the flutter initialization JS code -->
  <script src="flutter.js" defer></script>
</head>
<body>
  <script>
    window.addEventListener('load', function(ev) {
      // Download main.dart.js
      _flutter.loader.loadEntrypoint({
        serviceWorker: {
          serviceWorkerVersion: serviceWorkerVersion,
        },
        onEntrypointLoaded: function(engineInitializer) {
          engineInitializer.initializeEngine().then(function(appRunner) {
            appRunner.runApp();
          });
        }
      });
    });
  </script>
</body>
</html>
Firebase Analytics initial code

Creating a project on Firebase Console

If you haven’t already, use the instructions from the Setting Up a Firebase Project lesson to create a project and add your application to Firebase Console.

Adding the firebase_core and firebase_analytics packages

Within the pubspec.yaml, locate #TODO 3: Add firebase_core and firebase_analytics (line 13) and add the following lines:

firebase_analytics: ^9.1.2
firebase_core: ^1.13.1
...