bakgrunnseffekt

Firebase Local Emulators Suite with Flutter

Eirik Årdal

Seniorkonsulent

portrait image decoration

Publisert Søndag 25. april 2021
Sist oppdatert Fredag 8. oktober 2021

One of the latest great additions to the Firebase stack is the expansion and revamp of the emulator tools. There was always a headless Firestore emulator in Firebase CLI (or Firebase Tools as it's also known) but the Firebase team has doubled down on developer productivity and launched the Emulator Suite which contain emulators for:

  • Firebase Hosting Emulator
  • Cloud Functions Emulator
  • Realtime Database Emulator
  • Cloud Firestore Emulator
  • Auth Emulator
  • Cloud Pub/Sub Emulator

These emulators will make it possible to use these products locally and safely on your computer. The most sought-after use case for my part is the ability to finally be able to work with local-only Firestore data and have actual Cloud Functions trigger locally only for me, and to develop Cloud Functions without having to deploy them to test them properly.

And to navigate everything there is a separate administration console UI complete with the Firestore and Realtime Database views that we know from the live production console.

Full overview of all the installed and running emulators

The local admin console. Full overview of all the installed and running emulators

Setup

Installing and running the emulator suite

The below steps is explained in more detailed in the official guide.

  • Install Firebase CLI.
  • Run firebase init in your project and choose which emulators to use.
  • Run firebase emulators:start to boot everything up.
  • Open the administration UI at localhost:4000 (default).

Connect to the Firestore Emulator in Flutter

main.dart
    
  

Note #1: The Android emulator needs the special IP 10.0.2.2 for referencing localhost.

Note #2: The port 8080 must match the firestore entry in firebase.json (based on your `firebase init` setup earlier).

You might also need to set the following in ./android/app/src/profile/AndroidManifest.xml if you get any network related errors in the terminal. Unfortunately, I don't have the exact error message anymore.

AndroidManifest.xml
    
  

You should also completely restart the Android Emulator and re-build the app if it was running while you set this up.

Finally, my very own data <3

The local Firestore viewer. Finally, my very own data <3