diff --git a/frontend/package.json b/frontend/package.json
index 258fd406..4e8be43f 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --host 0.0.0.0 --port 5173",
     "build": "vite build",
     "serve": "vite preview",
     "lint": "eslint --ext .js,.vue,.tx --ignore-path .gitignore --fix src"
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index 16cd3818..97fdd05c 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -6,11 +6,12 @@
         <div id="right"></div>
         <div id="top"></div>
         <div id="bottom"></div>
-        <b-navbar-item id="fontnavbar" class="title is-2">
-          Milligram
+        <b-navbar-item id="fontnavbar" class="title is-2" style="color: red">
+          Milligram 
         </b-navbar-item>
       </template>
     </b-navbar>
+
     <div class="container">
       <Profile />
       <ImageList />
diff --git a/frontend/vite.config.js b/frontend/vite.config.js
index 0385a686..3a51ac6e 100644
--- a/frontend/vite.config.js
+++ b/frontend/vite.config.js
@@ -4,9 +4,23 @@ import { defineConfig } from "vite";
 import { createVuePlugin as vue } from "vite-plugin-vue2";
 
 const path = require("path");
+const codespaceName = process.env['CODESPACE_NAME'];
+const codespaceDomain = process.env['GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN'];
+const hmrPort = 5173;
 
+const hmrRemoteHost = codespaceName ? `${codespaceName}-${hmrPort}.${codespaceDomain}` : 'localhost';
+const hmrRemotePort = codespaceName ? 443 : hmrPort;
+const hmrRemoteProtocol = codespaceName ? 'wss' : 'ws';
 // https://vitejs.dev/config/
 export default defineConfig({
+  server: {
+    hmr: {
+        protocol: hmrRemoteProtocol,
+        host: hmrRemoteHost,
+        port: hmrPort,
+        clientPort: hmrRemotePort
+    }
+  },
   plugins: [vue()],
   resolve: {
     alias: {