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

If you haven't already, install the Firebase JS SDK and initialize Firebase.

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 Security 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.

Add the Realtime Database JS SDK and initialize Realtime Database

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 modular API 

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

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  // The value of `databaseURL` depends on the location of the database
  databaseURL: "https://DATABASE_NAME.firebaseio.com",
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Realtime Database and get a reference to the service
const database = getDatabase(app);

Web namespaced API 

import firebase from "firebase/app";
import "firebase/compat/database";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  // The value of `databaseURL` depends on the location of the database
  databaseURL: "https://DATABASE_NAME.firebaseio.com",
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Realtime Database and get a reference to the service
const database = firebase.database();

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

Next Steps