diff --git a/_frontend/index.html b/_frontend/index.html
index a402098..8d9fab0 100644
--- a/_frontend/index.html
+++ b/_frontend/index.html
@@ -14,7 +14,46 @@
     <link rel="stylesheet" href="/styles/main.scss">
 </head>
 <body>
-    <main></main>
-    <script type="module" src="/src/home.jsx"></script>
+    <main>
+        <div class="sidebar">
+            <div class="logo">Storage</div>
+            <div class="items">
+                <div class="item">
+                    <div class="label">
+                        Dashboard
+                    </div>
+                </div>
+                <div class="item">
+                    <div class="label">
+                        Buckets
+                    </div>
+                    <div class="children">
+                        <div class="item">
+                            <div class="label">Bucket 1</div>
+                        </div>
+                        <div class="item">
+                            <div class="label">Bucket 2</div>
+                        </div>
+                        <div class="item">
+                            <div class="label">Bucket 3</div>
+                        </div>
+                        <div class="item">
+                            <div class="label">Bucket 4</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="main-content">
+            <header>
+                <div class="group">
+                    <div class="label">Dashboard</div>
+                </div>
+                <div class="group">
+                    <div class="label">Login</div>
+                </div>
+            </header>
+        </div>
+    </main>
 </body>
 </html>
\ No newline at end of file
diff --git a/_frontend/server.js b/_frontend/server.js
index 1a288e0..c174802 100644
--- a/_frontend/server.js
+++ b/_frontend/server.js
@@ -2,6 +2,7 @@ import { dirname, resolve } from 'path'
 import express from 'express'
 import { createServer as createViteServer } from 'vite'
 import { fileURLToPath } from 'url'
+import { readFileSync } from 'fs'
 
 const __dirname = dirname(fileURLToPath(import.meta.url))
 
@@ -15,11 +16,15 @@ async function createServer(customHtmlRoutes) {
     })
 
     for (const [route, file] of Object.entries(customHtmlRoutes)) {
-        app.get(route, (req, res) => {
+        app.get(route, async (req, res) => {
             const filePath = resolve(__dirname, file)
             console.log(`Custom Route: %s`, req.url)
 
-            return res.sendFile(filePath)
+            let htmlFile = readFileSync(filePath, 'utf8')
+            htmlFile = await vite.transformIndexHtml(req.originalUrl, htmlFile)
+
+            res.setHeader('Content-Type', 'text/html')
+            return res.send(htmlFile)
         })
     }
 
diff --git a/_frontend/styles/main.scss b/_frontend/styles/main.scss
index 0ef923c..59bbdb5 100644
--- a/_frontend/styles/main.scss
+++ b/_frontend/styles/main.scss
@@ -9,9 +9,14 @@
     --bg-500: #f0f0f0;
     --bg-600: #e0e0e0;
 
+    --bg-2-400: #666;
+    --bg-2-500: #38383d;
+
     --fg-400: #3d3d3d;
     --fg-500: #333;
 
+    --fg-2-500: #ddd;
+
     --ft-sans: 'Open Sans', sans-serif;
 
     --ft-sans-wt-light: 300;
@@ -38,68 +43,86 @@ body {
 
 main {
     display: flex;
-    flex-direction: column;
 
-    align-items: center;
+    .sidebar {
+        display: flex;
+        flex-direction: column;
+
+        padding: 1rem;
+        min-height: 100vh;
+        min-width: 15rem;
+
+        color: var(--fg-2-500);
+        background: var(--bg-2-500);
+
+        font-size: 18px;
 
-    gap: 1rem;
+        z-index: -1;
+    }
 
-    header {
+    .main-content {
         width: 100%;
+        background: var(--bg-500);
+        box-shadow: 0 0 2rem 0 #00000022;
 
-        display: flex;
-        align-items: center;
-        justify-content: center;
+        header {
+            width: 100%;
+
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
 
-        padding: 0.5rem 1rem;
-        gap: 0.75rem;
+            padding: 1rem;
+            gap: 0.75rem;
 
-        background: var(--bg-100);
-        border-bottom: 1px solid var(--bg-600);
+            background: var(--bg-100);
+            border-bottom: 1px solid var(--bg-600);
 
-        color: var(--fg-400);
-        vertical-align: middle;
+            color: var(--fg-400);
 
-        .logo {
-            font-size: 32px;
-            font-weight: var(--ft-sans-wt-bold);
-        }
+            vertical-align: middle;
 
-        .machine {
-            font-size: 24px;
-            font-weight: var(--ft-sans-wt-normal);
+            .logo {
+                font-size: 32px;
+                font-weight: var(--ft-sans-wt-bold);
+            }
+
+            .machine {
+                font-size: 24px;
+                font-weight: var(--ft-sans-wt-normal);
+            }
         }
-    }
 
-    .widgets {
-        display: flex;
-        justify-content: center;
-        align-items: start;
+        .widgets {
+            display: flex;
+            justify-content: center;
+            align-items: start;
 
-        flex-wrap: wrap;
-        gap: 2rem;
+            flex-wrap: wrap;
+            gap: 2rem;
 
-        max-width: 120ch;
+            max-width: 120ch;
 
-        .widget {
-            background: var(--bg-100);
-            border: 1px solid var(--bg-600);
-            padding: 1rem;
+            .widget {
+                background: var(--bg-100);
+                border: 1px solid var(--bg-600);
+                padding: 1rem;
 
-            min-height: 10rem;
-            max-width: 50ch;
+                min-height: 10rem;
+                max-width: 50ch;
 
-            .title {
-                font-weight: var(--ft-sans-wt-bold);
+                .title {
+                    font-weight: var(--ft-sans-wt-bold);
 
-                code {
-                    font-weight: normal;
+                    code {
+                        font-weight: normal;
+                    }
                 }
-            }
 
-            &.todo {
-                width: 300px;
-                height: 200px;
+                &.todo {
+                    width: 300px;
+                    height: 200px;
+                }
             }
         }
     }
