Check out what’s new from Firebase at Google I/O 2022. Learn more

Installation & Setup in JavaScript

The Firebase Realtime Database is a cloud-hosted database. Data is stored as JSON and synchronized in realtime to every connected client. When you build cross-platform apps with our Android, Apple platforms, and JavaScript SDKs, all of your clients share one Realtime Database instance and automatically receive updates with the newest data.

Prerequisites

  1. Add and configure the Firebase JavaScript client SDK into your app.

Create a Database

  1. Navigate to the Realtime Database section of the Firebase console. You'll be prompted to select an existing Firebase project. Follow the database creation workflow.

  2. Select a starting mode for your Firebase Security Rules:

    Test mode

    Good for getting started with the mobile and web client libraries, but allows anyone to read and overwrite your data. After testing, make sure to review the Understand Firebase Realtime Database Rules section.

    To get started with the web, Apple, or Android SDK, select testmode.

    Locked mode

    Denies all reads and writes from mobile and web clients. Your authenticated application servers can still access your database.

  3. Choose a location for the database.

    Depending on the location of the database, the URL for the new database will be in one of the following forms:

    • DATABASE_NAME.firebaseio.com (for databases in us-central1)

    • DATABASE_NAME.REGION.firebasedatabase.app (for databases in all other locations)

  4. Click Done.

When you enable Realtime Database, it also enables the API in the Cloud API Manager.

Configure Realtime Database Rules

The Realtime Database provides a declarative rules language that allows you to define how your data should be structured, how it should be indexed, and when your data can be read from and written to.

Initialize the Realtime Database JavaScript SDK

You must specify your Realtime Database URL when initializing the JavaScript SDK.

You can find your Realtime Database URL in the Realtime Database section of the Firebase console. Depending on the location of the database, the database URL will be in one of the following forms:

  • https://DATABASE_NAME.firebaseio.com (for databases in us-central1)
  • https://DATABASE_NAME.REGION.firebasedatabase.app (for databases in all other locations)

Initialize the SDK using the following code snippet:

Web version 9 

import { initializeApp } from 'firebase/app';
import { getDatabase } from "firebase/database";

// TODO: Replace with your app's Firebase project configuration
const firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  // The value of `databaseURL` depends on the location of the database
  databaseURL: "https://DATABASE_NAME.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.appspot.com",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
  measurementId: "G-MEASUREMENT_ID",
};

const app = initializeApp(firebaseConfig);

// Get a reference to the database service
const database = getDatabase(app);

Web version 8 

// TODO: Replace with your app's Firebase project configuration
var firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  // The value of `databaseURL` depends on the location of the database
  databaseURL: "https://DATABASE_NAME.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.appspot.com",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
  measurementId: "G-MEASUREMENT_ID",
};

firebase.initializeApp(firebaseConfig);

// Get a reference to the database service
var database = firebase.database();

You're ready to start using the Firebase Realtime Database!

Next Steps