Based in

Nairobi

Loading article…

Based in

Nairobi

Postfirebaseemulator, firebase, firebasecli, localdevelopment

Firebase emulator setup

Firebase is cool and all but you'll run through your free allowance fast if you choose to develop...

Date published

May 21, 2022

More posts

PostAug 16, 2026

Tanstack DB in action

The team at TanStack, makers of TanStack Query (aka react-query), partnered with the ElectricSQL team...

react
tanstackdb
webdev

PostJul 28, 2026

Reasons to Still Use Next.js from a TanStack Start Enjoyer

Why You Might Still Pick Next.js Over TanStack Start From a TanStack Start...

nextjs
tanstack
react

PostJul 25, 2025

🎨 TanStack Start SSR-Friendly Theme Provider

A complete theme management system for React applications with SSR support! ✨ 🌟...

tanstackstart
jamstack
react

Full-stack TypeScript, warm interfaces, strict systems, and occasionally a creature feature.

© 2026 Dennis Waweru

Built from Nairobi with TypeScript

Firebase is cool and all but you'll run through your free allowance fast if you choose to develop while teasting on the live servers, because it's one accidental infinite loop away from making one too many requests. That's why they developed firebase emulator a local testing tool which simulates firestore,authentication ,functions, storage and hosting with more features in the works .

for the detailed insatllation process installation procedure

for the quic setup guide run

typescript

1npm install -g firebase-tools

to install the firebase cli then login by running

typescript

1firebase login

then check the firebase version

typescript

1firebase --version

in your projects root directory , start configuring by running

typescript

1firebase init

fire base init screen

In our case we need firestore ,functions and emulators , space bar to select then enter to confirm

firebase services we need

at this point you'll need to connect your existing firebase project or create one if you don't have one

select firebase project

now let's set up firebase , accept the defaults

emulator firestore setup

select javascript for functions and accept the defaults too and select the firestore,functions and authentication emulators

select emulators

select emulators

then select localhost ports for the services ,the defaults willbe good too . also select to enable the emulator UI

select emulator ports

then allow download of the emulators and finally strt up te emulators

typescript

1firebase emulators:start
2

firestore also lets you import production data for firestore when you start the emulators for that you'll need:

the gcloud cli download
your project needs to be on at least the blaze plan

the run

typescript

1gcloud projects list

then select your project of choice project id

typescript

1gcloud config set project production-c33c5

then export the data by running

typescript

1gcloud firestore export gs://"your project id here".appspot.com/save

then copy these files to your local device current directory

typescript

1 gsutil -m cp -r gs://production-c33c5.appspot.com/save  .

to launch the emulator with the data run

typescript

1firebase emulators:start --import ./save

you can save any changes you make by before closing the session

first run

typescript

1firebase emulators:export ./save

to connect your app to the emulator import

typescript

1import { connectAuthEmulator } from "firebase/auth";
2import {connectFirestoreEmulator} from "firebase/firestore"
3import { connectFunctionsEmulator } from "firebase/functions";

add these to the firebaseConfig.ts at the bottom

typescript

1connectFirestoreEmulator(db, 'localhost', 8080);
2connectAuthEmulator(auth, "http://localhost:9099");
3connectFunctionsEmulator(functions, "localhost", 5001);

another nice tip is how to run it on your lan network , which is helpfull if you're testing on multiple devices on the > same network.

typescript

1ipconfig

and grab the ipv4 value

ipv4 local address

in the firebase.json file , change the configuration and add the host value as the ipv4 address we git from ipv4

typescript

1  "emulators": {
2    "firestore": {
3      "port": 8080,
4      "host":"192.168.43.238"
5  
6    },
7    "hosting": {
8      "port": 5000
9    },
10    "ui": {
11      "enabled": true
12    },
13    "auth": {
14      "port": 9099
15    }
16  }

and also in the firebaseConfig , change the connectFirebaseEmulator to:

typescript

1connectFirestoreEmulator(db, '192.168.0.109', 8080);

or for auth

typescript

1connectAuthEmulator(auth, "http://192.168.43.238:9099");

emulator started

emulator UI

last thing to watch out for is port conflict , you can change the port if it's already taken or run

typescript

1npx kill-port "port-number"

Happy coding