Firebase tutorial
step 2 : setup firebse and paste the configuration code (configration code example given below Don't COPY THIS CONFIGRATION CODE IT'S UNIQUE FOR ALL) on html file below body tag (</.body>)
<script type="module"> // Import the functions you need from the SDKs you need import { initializeApp } from "https://www.gstatic.com/firebasejs/9.12.1/firebase-app.js"; // TODO: Add SDKs for Firebase products that you want to use // https://firebase.google.com/docs/web/setup#available-libraries // Your web app's Firebase configuration const firebaseConfig = { apiKey: "AIzaSyC_Acy3h5J5Egbj8Mc1CxAXCaS3M-hEWDs", authDomain: "fir-4b6c7.firebaseapp.com", projectId: "fir-4b6c7", storageBucket: "fir-4b6c7.appspot.com", messagingSenderId: "643012676626", appId: "1:643012676626:web:6cf897e4f8fc5df55e9ccb" }; // Initialize Firebase const app = initializeApp(firebaseConfig); </script>
import { getFirestore, addDoc, collection, getDocs } from 'https://www.gstatic.com/firebasejs/9.13.0/firebase-firestore.js'
step 4 : Paste the below code for initialize database (note highlighted area Figure 3:Database initilizing)
const db = getFirestore(app);
document.getElementById("submit-btn").onclick = async function (e) { e.preventDefault() const docRef = await addDoc(collection(db, "data"), { Name: document.getElementById('Name').value, Message: document.getElementById('Msg').value }); console.log("Document written with ID: ", docRef.id); alert("Form submitted") location.reload() };
window.onload = async function () { const querySnapshot = await getDocs(collection(db, "data")); querySnapshot.forEach((doc) => { const row = document.getElementById("tbody").insertRow(0); row.insertCell(0).innerHTML = doc.data().Name row.insertCell(-1).innerHTML = doc.data().Message }); }