firebase

What is firebase?

The firebase npm package is a comprehensive app development platform provided by Google that offers a variety of services such as real-time databases, authentication, cloud storage, hosting, and more. It is designed to help developers build and manage apps more efficiently.

What are firebase's main functionalities?

Realtime Database

Firebase Realtime Database allows you to store and sync data between your users in real-time. This is a NoSQL database that lets you build rich, collaborative applications by allowing secure access to the database directly from client-side code.

const { initializeApp } = require('firebase/app');
const { getDatabase, ref, set } = require('firebase/database');

// Initialize Firebase
const app = initializeApp({ /* your config */ });
const database = getDatabase(app);

// Write data to your database
set(ref(database, 'users/1'), {
  username: 'example',
  email: '[e-mail]'
});

Authentication

Firebase Authentication provides backend services to help authenticate users, including simple sign-in functionality as well as third-party providers like Google, Facebook, and Twitter.

const { initializeApp } = require('firebase/app');
const { getAuth, createUserWithEmailAndPassword } = require('firebase/auth');

// Initialize Firebase
const app = initializeApp({ /* your config */ });
const auth = getAuth(app);

// Create a new user
createUserWithEmailAndPassword(auth, '[e-mail]', 'password')
  .then((userCredential) => {
    // Signed in
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    // Error handling
    const errorCode = error.code;
    const errorMessage = error.message;
    // ...
  });

Cloud Firestore

Cloud Firestore is a flexible, scalable database for mobile, web, and server development. It keeps your data in sync across client apps through real-time listeners and offers offline support.

const { initializeApp } = require('firebase/app');
const { getFirestore, collection, addDoc } = require('firebase/firestore');

// Initialize Firebase
const app = initializeApp({ /* your config */ });
const db = getFirestore(app);

// Add a new document with a generated id
addDoc(collection(db, 'users'), {
  first: 'Ada',
  last: 'Lovelace',
  born: 1815
});

Cloud Storage

Firebase Cloud Storage is built for app developers who need to store and serve user-generated content, such as photos or videos.

const { initializeApp } = require('firebase/app');
const { getStorage, ref, uploadBytes } = require('firebase/storage');

// Initialize Firebase
const app = initializeApp({ /* your config */ });
const storage = getStorage(app);

// Create a storage reference from our storage service
const storageRef = ref(storage, 'some-child');

// Upload file
uploadBytes(storageRef, file).then((snapshot) => {
  console.log('Uploaded a blob or file!');
});

Hosting

Firebase Hosting provides fast and secure hosting for your web app, static and dynamic content, and microservices.

const { initializeApp } = require('firebase/app');
const { getAuth } = require('firebase/auth');
const { getFirestore } = require('firebase/firestore');
const { getStorage } = require('firebase/storage');

// Initialize Firebase
// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

// The rest of your web app's Firebase initialization and setup goes here...
// For example, you might set up Firebase Authentication, Firestore, and Storage as shown above.

Other packages similar to firebase

parse-server

Parse Server is an open-source version of the Parse backend that can be deployed to any infrastructure that can run Node.js. It offers many of the same features as Firebase, such as a real-time database, file storage, and user authentication. However, being open-source, it provides more flexibility and control over the backend infrastructure.

aws-amplify

AWS Amplify is a development platform for building secure, scalable mobile and web applications. It provides a similar range of services as Firebase, including authentication, data storage, and hosting. Amplify is tightly integrated with AWS services, which can be a benefit if you are already using AWS in your stack.

realm

Realm is a mobile database and synchronization platform that can be used for building offline-first, reactive mobile experiences. It offers real-time synchronization and data storage capabilities similar to Firebase's Realtime Database and Firestore. Realm is known for its smooth integration with mobile development and its fast performance on mobile devices.

README

Firebase - App success made simple

Upgrade to Version 9

Version 9 has a redesigned API that supports tree-shaking. Read the Upgrade Guide to learn more.

Overview

Firebase provides the tools and infrastructure you need to develop, grow, and earn money from your app. This package supports web (browser), mobile-web, and server (Node.js) clients.

For more information, visit:

• Firebase Realtime Database - The Firebase Realtime Database lets you store and query user data, and makes it available between users in realtime.
• Cloud Firestore - Cloud Firestore is a flexible, scalable database for mobile, web, and server development from Firebase and Google Cloud Platform.
• Firebase Storage - Firebase Storage lets you upload and store user generated content, such as files, and images.
• Cloud Functions for Firebase - Cloud Functions for Firebase is a serverless framework that lets you automatically run backend code in response to events triggered by Firebase features and HTTPS requests.
• Firebase Cloud Messaging - Firebase Cloud Messaging is a cross-platform messaging solution that lets you reliably deliver messages at no cost.
• Firebase Performance Monitoring - Firebase Performance Monitoring helps you gain insight into your app's performance issues.
• Google Analytics - Google Analytics is a free app measurement solution that provides insight on app usage and user engagement.
• Remote Config - Firebase Remote Config is a cloud service that lets you change the behavior and appearance of your app without requiring users to reload your app.
• App Check - App Check helps protect your backend resources from abuse, such as billing fraud and phishing. It works with both Firebase services and your own backends to keep your resources safe.
• Create and setup your account - Get started using Firebase for free.

This SDK is intended for end-user client access from environments such as the Web, mobile Web (e.g. React Native, Ionic), Node.js desktop (e.g. Electron), or IoT devices running Node.js. If you are instead interested in using a Node.js SDK which grants you admin access from a privileged environment (like a server), you should use the Firebase Admin Node.js SDK.

Install the SDK

Install the Firebase NPM module:

$ npm init
$ npm install --save firebase

Use Firebase in your app

1. Initialize Firebase in your app and create a Firebase App object:

import { initializeApp } from 'firebase/app';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

1. Access Firebase services in your app

Firebase services (like Cloud Firestore, Authentication, Realtime Database, Remote Config, and more) are available to import within individual sub-packages.

The example below shows how you could use the Cloud Firestore Lite SDK to retrieve a list of data.

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore/lite';
// Follow this pattern to import other Firebase services
// import { } from 'firebase/<service>';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// Get a list of cities from your database
async function getCities(db) {
  const citiesCol = collection(db, 'cities');
  const citySnapshot = await getDocs(citiesCol);
  const cityList = citySnapshot.docs.map(doc => doc.data());
  return cityList;
}

Use a module bundler for size reduction

The Firebase Web SDK is designed to work with module bundlers to remove any unused code (tree-shaking). We strongly recommend using this approach for production apps. Tools such as the Angular CLI, Next.js, Vue CLI, or Create React App automatically handle module bundling for libraries installed through npm and imported into your codebase.

See Using module bundlers with Firebase for more information.

Script include

You can also load Firebase packages as script modules in browsers that support native ES modules.

<!-- use script module by specifying type="module" -->
<script type="module">
    import { initializeApp } from 'https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-app.js';
    import { getFirestore, collection, getDocs } from 'https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-firestore-lite.js';
    // Follow this pattern to import other Firebase services
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-analytics.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-app-check.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-auth.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-functions.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-firestore.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-storage.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-performance.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-remote-config.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-messaging.js";
    // import {} from "https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-database.js";
    
    // TODO: Replace the following with your app's Firebase project configuration
    const firebaseConfig = {
    //...
    };

    const app = initializeApp(firebaseConfig);
    const db = getFirestore(app);

    // Get a list of cities from your database
    async function getCities(db) {
    const citiesCol = collection(db, 'cities');
    const citySnapshot = await getDocs(citiesCol);
    const cityList = citySnapshot.docs.map(doc => doc.data());
    return cityList;
    }
</script>

Note: To get a filled in version of the above code snippet, go to the Firebase console for your app and click on "Add Firebase to your web app".

Get the code (Node.js - server and command line)

Install the SDK

While you can write entire Firebase applications without any backend code, many developers want to write server applications or command-line utilities using the Node.js JavaScript runtime.

You can use the same npm module to use Firebase in the Node.js runtime (on a server or running from the command line):

$ npm init
$ npm install --save firebase

In your code, you can access Firebase using:

const { initializeApp } = require('firebase/app');
const { getFirestore, collection, getDocs } = require('firebase/firestore');
// ...

If you are using native ES6 module with --experimental-modules flag (or Node 12+) you should do:

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore';
// ...

Please see Environment Support for which packages are available in Node.js.

Compat packages

Version 9 provides a set of compat packages that are API compatible with Version 8. They are intended to be used to make the upgrade to the modular API easier by allowing you to upgrade your app piece by piece. See the Upgrade Guide for more detail.

To access the compat packages, use the subpath compat like so:

// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

Changelog

The Firebase changelog can be found at firebase.google.com.

Browser/environment compatibility

Please see Environment Support.