Reworking old js ....

YTManager/frontend/src/components/Hello.vue

@@ -0,0 +1,45 @@
+<template>
+    <div>
+        <div class="greeting">Hello {{name}}{{exclamationMarks}} :D</div>
+        <button @click="decrement">-</button>
+        <button @click="increment">+</button>
+    </div>
+</template>
+
+<script lang="ts">
+import Vue from "vue";
+import Axios from "axios";
+
+export default Vue.extend({
+    props: ['name', 'initialEnthusiasm'],
+    data() {
+        return {
+            enthusiasm: this.initialEnthusiasm,
+        }
+    },
+    methods: {
+        increment() { this.enthusiasm++; },
+        decrement() {
+            if (this.enthusiasm > 1) {
+                this.enthusiasm--;
+            }
+            Axios.get("https://jsonplaceholder.typicode.com/posts/1").then(resp => {
+                if (resp == null) {} else {
+                console.log(resp.data);
+            }}).catch(() => console.log("Uh ohhh"));
+            
+        },
+    },
+    computed: {
+        exclamationMarks(): string {
+            return Array(this.enthusiasm + 1).join('!');
+        }
+    }
+});
+</script>
+
+<style>
+.greeting {
+    font-size: 20px;
+}
+</style>