diff --git a/frontend/consumers.py b/frontend/consumers.py
new file mode 100644
index 0000000..307fdb9
--- /dev/null
+++ b/frontend/consumers.py
@@ -0,0 +1,15 @@
+import json
+from channels.generic.websocket import WebsocketConsumer
+
+class ChatConsumer(WebsocketConsumer):
+	def connect(self):
+		self.accept()
+
+		self.send(text_data=json.dumps({
+			'type':'connection_established',
+			'message':'Your are now connected',
+		}))
+
+	def receive():
+
+	def disconnect():
diff --git a/frontend/rounting.py b/frontend/rounting.py
new file mode 100644
index 0000000..5df8609
--- /dev/null
+++ b/frontend/rounting.py
@@ -0,0 +1,6 @@
+from django.urls import re_path
+from . import consumers
+
+websocket_urlpatterns = [
+	re_path(r'ws/socket-server/', consumers.ChatConsumer.as_asgi())
+]
diff --git a/frontend/static/css/index.css b/frontend/static/css/index.css
index 9416823..db15e14 100644
--- a/frontend/static/css/index.css
+++ b/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;
-}
\ No newline at end of file
+}
diff --git a/frontend/static/js/.index.js.swp b/frontend/static/js/.index.js.swp
new file mode 100644
index 0000000..5a97216
Binary files /dev/null and b/frontend/static/js/.index.js.swp differ
diff --git a/frontend/static/js/index.js b/frontend/static/js/index.js
index f63c27c..f93a21e 100644
--- a/frontend/static/js/index.js
+++ b/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 GeneralChat from "./views/GeneralChat.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: "/generalchat", view: GeneralChat },
     ];
 
     // Test each route for potential match
@@ -60,4 +62,4 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 
     router();
-});
\ No newline at end of file
+});
diff --git a/frontend/static/js/views/AbstractView.js b/frontend/static/js/views/AbstractView.js
index 18bf83f..4b0f939 100644
--- a/frontend/static/js/views/AbstractView.js
+++ b/frontend/static/js/views/AbstractView.js
@@ -10,4 +10,4 @@ export default class {
     async getHtml() {
         return "";
     }
-}
\ No newline at end of file
+}
diff --git a/frontend/static/js/views/Dashboard.js b/frontend/static/js/views/Dashboard.js
index e2f4409..eb3c2f3 100644
--- a/frontend/static/js/views/Dashboard.js
+++ b/frontend/static/js/views/Dashboard.js
@@ -17,4 +17,4 @@ export default class extends AbstractView {
             </p>
         `;
     }
-}
\ No newline at end of file
+}
diff --git a/frontend/static/js/views/GeneralChat.js b/frontend/static/js/views/GeneralChat.js
new file mode 100644
index 0000000..fc0af98
--- /dev/null
+++ b/frontend/static/js/views/GeneralChat.js
@@ -0,0 +1,22 @@
+import AbstractView from "./AbstractView.js";
+
+export default class extends AbstractView {
+    constructor(params) {
+        super(params);
+        this.setTitle("General 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>General Chat</h1>
+
+        `;
+    }
+}
diff --git a/frontend/templates/index.html b/frontend/templates/index.html
index 6fcaec3..d511259 100644
--- a/frontend/templates/index.html
+++ b/frontend/templates/index.html
@@ -11,6 +11,7 @@
     <nav class="nav">
         <a href="/" class="nav__link" data-link>Dashboard</a>
         <a href="/posts" class="nav__link" data-link>Posts</a>
+        <a href="/generalchat" class="nav__link" data-link>General Chat</a>
         <a href="/settings" class="nav__link" data-link>Settings</a>
     </nav>
     <div id="app"></div>
diff --git a/trancendence/asgi.py b/trancendence/asgi.py
index eaaad8a..8856b08 100644
--- a/trancendence/asgi.py
+++ b/trancendence/asgi.py
@@ -10,7 +10,17 @@ https://docs.djangoproject.com/en/4.2/howto/deployment/asgi/
 import os
 
 from django.core.asgi import get_asgi_application
+from channels.routing import ProtocolTypeRouter, URLRouter
+from channels.auth import AuthMiddlewareStack
+import chat.routing
 
 os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'trancendence.settings')
 
-application = get_asgi_application()
+application = ProtocolTypeRouter({
+	'http':get_asgi_application(),
+	'websocket':AuthMiddlewareStack(
+		URLRouter(
+			chat.routing.websocket_urlpatterns
+		)
+	),
+})
diff --git a/trancendence/settings.py b/trancendence/settings.py
index a8d3760..21d7952 100644
--- a/trancendence/settings.py
+++ b/trancendence/settings.py
@@ -38,6 +38,9 @@ CORS_ORIGIN_WHITELIST = (
 # Application definition
 
 INSTALLED_APPS = [
+
+    'channels',
+
     'accounts.apps.AccountsConfig',
     'profiles.apps.ProfilesConfig',
     'frontend.apps.FrontendConfig',
@@ -52,6 +55,8 @@ INSTALLED_APPS = [
     'django.contrib.staticfiles',
 ]
 
+ASGI_APPLICATION = 'trancendence.asgi.application'
+
 MIDDLEWARE = [
     'corsheaders.middleware.CorsMiddleware',
     'django.middleware.common.CommonMiddleware',