(Integrate Firebase PRO): Get data from Firestore and display on Wordpress

retrieve_firestore_data_for_wordpress.js

(function ($) {
    'use strict';
    $(document).ready(function () {
        const showFirestoreDatabase = () => {
            const db = firebase.firestore();
            const firestoreEl = jQuery('#custom-firebase');
        
            // You can get the collectionName and documentName from the shortcode attribute
            const collectionName = 'users';
            const documentName = ‘document-1'
        
            if (collectionName && documentName) {
                const docRef = db.collection(collectionName).doc(documentName);
        
                docRef.get().then(doc => {
                    if (doc.exists) {
                        // console.log('Document data:', doc.data());
                        let html = '<table>';
                        jQuery.each(doc.data(), function (key, value) {
                            // You can put condition to filter your value
                            // and it won't show on the frontend
                            html += '<tr>';
                            html += `<td> ${String(key)} </td>`;
                            html += '<td>' + value + '</td>';
                            html += '</tr>';
                        })
                        html += '</table>';
                        firestoreEl.append(html)
                    } else {
                        // doc.data() will be undefined in this case
                        console.error('Please check your collection and document name in the [firestore] shortcode!');
                    }
                }).catch(error => {
                    console.error('Please check your collection and document name in the [firestore] shortcode!', error);
                });
            } else {
                console.warn('Please check your collection and document name in the [firestore] shortcode!');
            }
        }
        
        showFirestoreDatabase()
    })
})(jQuery)