1. Introduction

Tutorial's Goals

The main goal of this tutorial is to compare two of Firebase's powerful database options: Firestore and Realtime Database. We will explore the key differences, advantages, disadvantages, and ideal use cases for each.

Learning Outcomes

By the end of this tutorial, you will understand:
- The core concepts of Firestore and Realtime Database
- When to use Firestore or Realtime Database
- How to interact with both databases using code examples

Prerequisites

A basic understanding of Firebase, JavaScript and databases will be helpful for this tutorial.

2. Step-by-Step Guide

Firestore

Firestore is a NoSQL document database that lets you easily store, sync, and query data for your mobile and web apps at a global scale. It organizes data as collections of documents, and can even have nested sub-collections.

Key Features:

• Document-oriented: Data is saved in documents, which are organized into collections.
• Expressive querying: You can perform complex queries over your data.
• Offline support: Firestore caches data that your app is actively using, so the app can write, read, listen to, and query data even when offline.
• Scalability: Firestore scales automatically to handle your app's load.

Realtime Database

Realtime Database is Firebase's original database. It's a NoSQL database that stores data as JSON and synchronizes it in realtime to every connected client.

Key Features:

• Realtime: Realtime Database updates in real time. You don't have to refresh your browser to get the latest updates.
• Offline support: Like Firestore, it allows mobile and web apps to remain responsive even when offline.
• Scalability: While it can scale, it requires sharding to scale beyond 100,000 concurrent connections.

3. Code Examples

Firestore

// Initialize Firestore
const db = firebase.firestore();

// Add a new document
db.collection("users").add({
    first: "Alan",
    last: "Turing",
    born: 1912
})
.then((docRef) => {
    console.log("Document written with ID: ", docRef.id);
})
.catch((error) => {
    console.error("Error adding document: ", error);
});

Realtime Database

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

// Write new post
function writeNewPost(uid, username, picture, title, body) {
  const postData = {
    author: username,
    uid: uid,
    body: body,
    title: title,
    starCount: 0,
    authorPic: picture
  };

  const newPostKey = firebase.database().ref().child('posts').push().key;

  const updates = {};
  updates['/posts/' + newPostKey] = postData;
  updates['/user-posts/' + uid + '/' + newPostKey] = postData;

  return firebase.database().ref().update(updates);
}

4. Summary

In this tutorial, we compared Firestore and Realtime Database. Firestore is more scalable and provides more robust querying, but Realtime Database can be more straightforward for simple data needs.

Next steps for learning could include diving deeper into the Firebase platform and exploring other services it offers, like authentication and cloud functions.

5. Practice Exercises

1. Exercise: Create a Firestore database and write a function to add a new document to a collection.
2. Exercise: Create a Realtime Database and write a function to add a new child to a node.
3. Exercise: For both databases, write a function to retrieve data and display it in your app.

Remember, practice is the key to mastering any skill. Continue experimenting with Firestore and Realtime Database to understand their potential. Happy coding!