diff --git a/vue-cli/src/Home.vue b/vue-cli/src/Home.vue
new file mode 100644
index 0000000..873975a
--- /dev/null
+++ b/vue-cli/src/Home.vue
@@ -0,0 +1,15 @@
+<template>
+  <div><app-server-status v-for="server in 5"></app-server-status></div>
+</template>
+
+<script>
+  import ServerStatus from './ServerStatus.vue'
+  import AppServerStatus from "./ServerStatus";
+  export default {
+      components: {
+        AppServerStatus,
+        'app-server-status': ServerStatus
+      }
+
+    }
+</script>
diff --git a/vue-cli/src/ServerStatus.vue b/vue-cli/src/ServerStatus.vue
new file mode 100644
index 0000000..64f5db9
--- /dev/null
+++ b/vue-cli/src/ServerStatus.vue
@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <p>Server Status: {{ status }}</p>
+    <hr>
+    <button @click="changeStatus">Change</button>
+  </div>
+</template>
+
+<script>
+  export default {
+    data(){
+      return {
+        status: 'critical'
+      }
+    },
+    methods: {
+      changeStatus(){
+        this.status = 'Normal'
+      }
+    }
+  }
+</script>