Checkpoint

./views/index.html:334152/235 ./public/client.js:334152/160

Checkpoint
./views/index.html:334152/235 ./public/client.js:334152/160
Glitch (hello-express)
Showing 2 changed files with 42 additions and 46 deletions
public/client.js
views/index.html
--- a/public/client.js
View file @3b18fda
+++ b/public/client.js
View file @3b18fda
 // client-side js
 // run by the browser each time your view template is loaded

-(function(){
-  console.log('hello world :o');
-  
-  // our default array of dreams
-  const dreams = [
-    'Find and count some sheep',
-    'Climb a really tall mountain',
-    'Wash the dishes'
-  ];
-  
-  // define variables that reference elements on our page
-  const dreamsList = document.getElementById('dreams');
-  const dreamsForm = document.forms[0];
-  const dreamInput = dreamsForm.elements['dream'];
-  
-  // a helper function that creates a list item for a given dream
-  const appendNewDream = function(dream) {
-    const newListItem = document.createElement('li');
-    newListItem.innerHTML = dream;
-    dreamsList.appendChild(newListItem);
-  }
-  
-  // iterate through every dream and add it to our page
-  dreams.forEach( function(dream) {
-    appendNewDream(dream);
-  });
-  
-  // listen for the form to be submitted and add a new dream when it is
-  dreamsForm.onsubmit = function(event) {
-    // stop our form submission from refreshing the page
-    event.preventDefault();
-    
-    // get dream value and add it to the list
-    dreams.push(dreamInput.value);
-    appendNewDream(dreamInput.value);
-  
-    // reset form 
-    dreamInput.value = '';
-    dreamInput.focus();
-  };
-  
-})()
\ No newline at end of file
+console.log('hello world :o');
+
+// our default array of dreams
+const dreams = [
+  'Find and count some sheep',
+  'Climb a really tall mountain',
+  'Wash the dishes'
+];
+
+// define variables that reference elements on our page
+const dreamsList = document.getElementById('dreams');
+const dreamsForm = document.forms[0];
+const dreamInput = dreamsForm.elements['dream'];
+
+// a helper function that creates a list item for a given dream
+const appendNewDream = function(dream) {
+  const newListItem = document.createElement('li');
+  newListItem.innerHTML = dream;
+  dreamsList.appendChild(newListItem);
+}
+
+// iterate through every dream and add it to our page
+dreams.forEach( function(dream) {
+  appendNewDream(dream);
+});
+
+// listen for the form to be submitted and add a new dream when it is
+dreamsForm.onsubmit = function(event) {
+  // stop our form submission from refreshing the page
+  event.preventDefault();
+
+  // get dream value and add it to the list
+  dreams.push(dreamInput.value);
+  appendNewDream(dreamInput.value);
+
+  // reset form 
+  dreamInput.value = '';
+  dreamInput.focus();
+};
--- a/views/index.html
View file @3b18fda
+++ b/views/index.html
View file @3b18fda
@@ -19,6 +19,9 @@

    <!-- import the webpage's stylesheet -->
    <link rel="stylesheet" href="/style.css">
+    
+    <!-- import the webpage's client-side javascript file -->
+    <script src="/client.js" defer></script>
  </head>
  <body>
    <header>
@@ -45,10 +48,6 @@
    <footer>
      Made with <a href="https://glitch.com">Glitch</a>!
    </footer>
-    
-    
-    <!-- import the webpage's client-side javascript file -->
-    <script src="/client.js"></script>

    <!-- include the Glitch button to show what the webpage is about and
          to make it easier for folks to view source and remix -->