Firebase cannot retrieve data from database "db.collection is not a function"

Question

Cannot get anything from the firebase database. It is showing an error of:

Uncaught TypeError: db.collection is not a function

I have the script setup here as shown:

var config = {
  apiKey: "*****",
  authDomain: "*****",
  databaseURL: "*****",
  projectId: "*****",
  storageBucket: "*****",
  messagingSenderId: "*****"
};
firebase.initializeApp(config);
const db = firebase.database();

const firstName = document.querySelector('#firstName').value;
const mainButton = document.querySelector('#mainButton');

mainButton.addEventListener('click', () => {
  db.collection("users").doc().set({
      first: firstName,
  })
  .then(function() {
      console.log("Document successfully written!");
  })
  .catch(function(error) {
      console.error("Error writing document: ", error);
  });
});

<input id="firstName" type="text" name="first-name" required>
<button id="mainButton" type="button">Submit</button>

What am I missing here?

Answer 1

Change this:

const db = firebase.database();

into this:

const db = firebase.firestore();

Since you are using firestore and not realtime database.

more info here:

https://firebase.google.com/docs/firestore/quickstart#initialize