Firebase Google Login and Notes App in JavaScript

Firebase Google Login and Realtime Notes Implementation

import { initializeApp } from "https://www.gstatic.com/firebasejs/10.7.2/firebase-app.js";
import { getAuth, signInWithRedirect, getRedirectResult, GoogleAuthProvider } from "https://www.gstatic.com/firebasejs/10.7.2/firebase-auth.js";
import { getDatabase, ref, set, onChildAdded, onChildChanged } from 'https://www.gstatic.com/firebasejs/10.7.2/firebase-database.js';

Firebase Configuration and Initialization

const firebaseConfig = {
    apiKey, authDomain, databaseURL, projectId, storageBucket, messagingSenderId, appId
};
const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getDatabase(app);
let user = null;
let note_ref = null;
document.addEventListener('deviceready', onDeviceReady, false);

Displaying Notes

function getNotas(note_ref) {
    if (note_ref != null) {
        document.getElementById('page-main-notes').innerHTML = "

Notas:

";
        onChildAdded(note_ref, (data) => {
            document.getElementById('page-main-notes').innerHTML += "

";
        });
    }
}

Google Login and User Setup

function onDeviceReady() {
    document.querySelector('#button-login-google').addEventListener('click', function () {
        const provider = new GoogleAuthProvider(auth); [OAuthProvider('microsoft.com'); GithubAuthProvider]
        signInWithRedirect(auth, provider);
    });
    getRedirectResult(auth).then((result) => {
        const credential = GoogleAuthProvider.credentialFromResult(result);
        const token = credential.accessToken;
        const user_info = result.user;
        user = user_info.email.slice(0, user_info.email.indexOf('@')).replace(".", "");
        var name = user_info.displayName;
        document.getElementById('page-login').style.display = 'none';
        document.getElementById('page-main').style.display = 'block';
        document.getElementById('page-main-welcome').innerHTML += 'Bienvenido ' + name + "
";
        document.getElementById('profile-photo').src = user_info.photoURL;
        let root_ref = ref(db, 'users/' + user);
        set(root_ref, { nombre: name, usuario: user, email: user_info.email, foto: user_info.photoURL, tel: user_info.phoneNumber });
        note_ref = ref(db, 'notas/' + user);
        getNotas(note_ref);
    }).catch((error) => {
        console.log(error);
    });

Adding New Notes

document.getElementById('button-add').addEventListener('click', function () {
    let titulo = document.getElementById('title').value;
    let nota = document.getElementById('note').value;
    if (titulo != "" && nota != "") {
        let root_ref = ref(db, 'notas/' + user + '/' + titulo);
        set(root_ref, { titulo: titulo, nota: nota });
    }
    document.getElementById('title').value = '';
    document.getElementById('note').value = '';
    getNotas(note_ref);
});