Is real?

frontend/static/css/index.css

@@ -1,37 +1,9 @@
 body {
-    --nav-width: 200px;
-    margin: 0 0 0 var(--nav-width);
+    margin: 10;
     font-family: 'Quicksand', sans-serif;
     font-size: 18px;
 }
 
-.nav {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: var(--nav-width);
-    height: 100vh;
-    background: #222222;
-}
-
-.nav__link {
-    display: block;
-    padding: 12px 18px;
-    text-decoration: none;
-    color: #eeeeee;
-    font-weight: 500;
-}
-
-.nav__link:hover {
-    background: rgba(255, 255, 255, 0.05);
-}
-
-#app {
-    margin: 2em;
-    line-height: 1.5;
-    font-weight: 500;
-}
-
 a {
     color: #009579;
-}
+}

frontend/static/js/index.js

@@ -2,6 +2,7 @@ import Dashboard from "./views/Dashboard.js";
 import Posts from "./views/Posts.js";
 import PostView from "./views/PostView.js";
 import Settings from "./views/Settings.js";
+import Chat from "./views/Chat.js";
 
 const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$");
 
@@ -24,7 +25,8 @@ const router = async () => {
         { path: "/", view: Dashboard },
         { path: "/posts", view: Posts },
         { path: "/posts/:id", view: PostView },
-        { path: "/settings", view: Settings }
+        { path: "/settings", view: Settings },
+        { path: "/chat", view: Chat },
     ];
 
     // Test each route for potential match
@@ -60,4 +62,4 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 
     router();
-});
+});

frontend/static/js/views/Chat.js

@@ -0,0 +1,21 @@
+import AbstractView from "./AbstractView.js";
+
+export default class extends AbstractView {
+    constructor(params) {
+        super(params);
+        this.setTitle("Chat");
+		let url = `ws://${window.location.host}/ws/socket-server/`
+
+		const chatSocket = new WebSocket(url)
+		chatSocket.onmessage = function(e) {
+			let data = JSON.parse(e.data)
+			console.log('Data:', data)
+		}
+    }
+
+    async getHtml() {
+        return `
+            <h1>Chat</h1>
+        `;
+    }
+}