💼🎋 Checkpoint

./views/index.html:530995/821
./package.json:530995/1294
./server.js:530995/1216
./views/index.handlebars:530995/43
./public/script.js:530995/1310
./views/room.handlebars:530995/874
This commit is contained in:
Glitch (hello-express)
2020-04-09 10:19:11 +00:00
parent 80a5f2f8d0
commit c2acb83882
7 changed files with 245 additions and 94 deletions

View File

@@ -1,41 +0,0 @@
// client-side js, loaded by index.html
// run by the browser each time the page is loaded
console.log("hello world :o");
// define variables that reference elements on our page
const dreamsList = document.getElementById("dreams");
const dreamsForm = document.querySelector("form");
// a helper function that creates a list item for a given dream
function appendNewDream(dream) {
const newListItem = document.createElement("li");
newListItem.innerText = dream;
dreamsList.appendChild(newListItem);
}
// fetch the initial list of dreams
fetch("/dreams")
.then(response => response.json()) // parse the JSON from the server
.then(dreams => {
// remove the loading text
dreamsList.firstElementChild.remove();
// iterate through every dream and add it to our page
dreams.forEach(appendNewDream);
// listen for the form to be submitted and add a new dream when it is
dreamsForm.addEventListener("submit", event => {
// stop our form submission from refreshing the page
event.preventDefault();
// get dream value and add it to the list
let newDream = dreamsForm.elements.dream.value;
dreams.push(newDream);
appendNewDream(newDream);
// reset form
dreamsForm.reset();
dreamsForm.elements.dream.focus();
});
});