Hello World! (Copy 7332)
✨ NOPPANUT KHAMMUEANG
<!DOCTYPE html> <html lang=en> <head> <script src=https://www.gstatic.com/firebasejs/8.3.1/firebase-app.js></script> <script src=https://www.gstatic.com/firebasejs/8.3.1/firebase-firestore.js></script> <script> // Helper script /** * * Main Runtime * * ? Anything which related to DOM should be run in this callback. */ const main = (callback) => { document.addEventListener("DOMContentLoaded", callback, { once: true }) }, /** * ? Shorten syntax for querying for element id */ id = (id) => { const reference = document.getElementById(id) return Object.assign(reference, { on: (event, callback) => { reference.addEventListener(event, callback) return () => reference.removeEventListener(event, callback) } }) } </script> <script defer> // Firebase Setup const firebaseConfig = { apiKey: "AIzaSyA4IXgz-ar5tINgkjCUqD0HLiybNkrurLw", authDomain: "toenteen-e7d8a.firebaseapp.com", projectId: "toenteen-e7d8a", storageBucket: "toenteen-e7d8a.appspot.com", messagingSenderId: "1048507904189", appId: "1:1048507904189:web:5181433087904c2f8407d4", measurementId: "G-B29DZ19W02" } firebase.initializeApp(firebaseConfig) const firestore = firebase.firestore() /** * * Main Runtime * * ? Anything which related to DOM should be run here. */ main(() => { /** * ? When element with id "read" is clicked. * ? The function will run. * */ id("read").on("click", () => { id("title").textContent = "Clicked" firestore .collection('user') .doc('Toen') .get() .then(doc => { const data = doc.data() id('title').textContent = data.Age id('title1').textContent = data.Faculty id('title2').textContent = data.colleage id('title3').textContent = doc.id }) }) }) document.body.onkeyup = function(e){ if(e.key == "Enter"){ add() add_start_to_end() } } </script> <style> h1{ display:inline-block; } </style> </head> <body> <h1 id=title>---</h1> <h1 id=title1>---</h1> <h1 id=title2>---</h1> <h1 id=title3>---</h1> <button id=read>Read</button> </body> </html>