It works!

assets/App.vue

@@ -0,0 +1,17 @@
+<template lang="html">
+  <div>
+    <p>
+      <router-link to="/">Go back</router-link>      
+    </p>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "App"
+};
+</script>
+
+<style lang="css">
+</style>

assets/components/App.vue

@@ -1,31 +0,0 @@
-<template lang="html">
-  <div id="app">
-    <h1>Hello Parcel from Vue 📦 🚀</h1>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "app"
-};
-</script>
-
-<style lang="css">
-html,
-body {
-  height: 100%;
-}
-body {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
-#app {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-}
-h1 {
-  font-weight: 300;
-}
-</style>

assets/index.html

@@ -9,5 +9,4 @@
   <div id="app"></div>
   <script src="/main.js"></script>
 </body>
-
 </html>

assets/main.js

@@ -1,7 +1,27 @@
 import Vue from "vue";
-import App from "/components/App.vue";
+import VueRouter from "vue-router";
+Vue.use(VueRouter);
+
+import App from "./App.vue";
+import Index from "./pages/Index.vue";
+import Container from "./pages/Container.vue";
+
+const routes = [
+  { path: "/", component: Index },
+  {
+    path: "/container/:id",
+    component: Container,
+    name: "container",
+    props: true
+  }
+];
+
+const router = new VueRouter({
+  mode: "history",
+  routes
+});
 
 new Vue({
-  el: "#app",
+  router,
   render: h => h(App)
-});
+}).$mount("#app");

assets/pages/Container.vue

@@ -0,0 +1,34 @@
+<template lang="html">
+  <ul ref="logs">
+    
+  </ul>
+</template>
+
+<script>
+let ws;
+export default {
+  props: ["id"],
+  name: "Container",
+  mounted() {
+    ws = new WebSocket(`ws://${window.location.host}/api/logs?id=${this.id}`);
+    ws.onopen = e => console.log("Connection opened.");
+    ws.onclose = e => console.log("Connection closed.");
+    ws.onerror = e => console.error("Connection error: " + e.data);
+    ws.onmessage = e => {
+      const parent = this.$refs.logs;
+      const item = document.createElement("li");
+      item.innerHTML = e.data;
+      parent.appendChild(item);
+    };
+  }
+};
+</script>
+<style>
+ul {
+  padding: 0;
+  margin: 0;
+}
+ul li {
+  list-style-type: none;
+}
+</style>

assets/pages/Index.vue

@@ -0,0 +1,26 @@
+<template lang="html">
+  <div>
+    <ul>
+      <li v-for="item in containers">        
+        <router-link :to="{name: 'container', params: {id: item.Id}}">{{ item.Names[0] }} {{ item.Status}}</router-link>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Index",
+  data() {
+    return {
+      containers: []
+    };
+  },
+  async created() {
+    this.containers = await (await fetch(`/api/containers.json`)).json();
+  }
+};
+</script>
+
+<style lang="css">
+</style>