working and dockerized

views/index.hbs

@@ -1,2 +1,23 @@
 <h1>{{title}}</h1>
 <p>Welcome to {{title}}</p>
+<button id="btn-pun">Pun Me!</button>
+<p id="pun"></p>
+<input type="text" id="rhyme-word" />
+<button id="btn-rhyme">Rhyme It!</button>
+<p id="rhymes"></p>
+<script>
+    document.querySelector('#btn-pun').addEventListener('click', () => {
+        fetch('/pun').then(response => response.text()).then(text => {
+            let textTag = document.querySelector('#pun');
+            textTag.innerHTML = text;
+        });
+    });
+
+    document.querySelector('#btn-rhyme').addEventListener('click', () => {
+        let word = document.querySelector('#rhyme-word').value;
+        fetch('/pun/query?word=' + encodeURIComponent(word)).then(response => response.json()).then(json => {
+            let textTag = document.querySelector('#rhymes');
+            textTag.innerHTML = json.join('</br>');
+        });
+    });
+</script>