diff --git a/app/src/lib/components/menu/LogoButton.svelte b/app/src/lib/components/menu/LogoButton.svelte
index c3d5b28..9b8394b 100644
--- a/app/src/lib/components/menu/LogoButton.svelte
+++ b/app/src/lib/components/menu/LogoButton.svelte
@@ -1,11 +1,15 @@
 <script>
     import logo from '$lib/assets/logo512.png'
+    import { resolve } from '$app/paths'
 
     /** @type {{appName: any}} */
     let { appName } = $props()
 </script>
 
-<a href="/" class="rounded-box mb-4 flex items-center hover:scale-[1.02] active:scale-[0.98]">
+<a
+    href={resolve('/')}
+    class="rounded-box mb-4 flex items-center hover:scale-[1.02] active:scale-[0.98]"
+>
     <img src={logo} alt="Logo" class="h-12 w-12" />
     <h1 class="px-4 text-2xl font-bold">{appName}</h1>
 </a>
diff --git a/app/src/lib/components/statusbar/TopBar.svelte b/app/src/lib/components/statusbar/TopBar.svelte
index b08b9b7..9815d4d 100644
--- a/app/src/lib/components/statusbar/TopBar.svelte
+++ b/app/src/lib/components/statusbar/TopBar.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
     import { Hamburger } from '../icons'
+    import { resolve } from '$app/paths'
 </script>
 
 <div class="topbar absolute left-0 top-0 w-full z-20 flex justify-between bg-zinc-800">
     <div class="flex gap-2 p-2">
-        <a href="/">
+        <a href={resolve('/')}>
             <Hamburger class="h-8 w-8" />
         </a>
     </div>
diff --git a/app/src/routes/+error.svelte b/app/src/routes/+error.svelte
index 062a73c..83ed269 100644
--- a/app/src/routes/+error.svelte
+++ b/app/src/routes/+error.svelte
@@ -1,8 +1,9 @@
 <script lang="ts">
     import { page } from '$app/state'
+    import { resolve } from '$app/paths'
 </script>
 
 <div class="flex justify-center items-center w-full h-full">
     <h1>{page.status} {page.error?.message}</h1>
-    <span>Go to <a class="btn btn-primary" href="/">Home page</a></span>
+    <span>Go to <a class="btn btn-primary" href={resolve('/')}>Home page</a></span>
 </div>
diff --git a/app/src/routes/+page.svelte b/app/src/routes/+page.svelte
index 0533f9d..2136364 100644
--- a/app/src/routes/+page.svelte
+++ b/app/src/routes/+page.svelte
@@ -3,11 +3,12 @@
     import Visualization from '$lib/components/Visualization.svelte'
     import { socket } from '$lib/stores'
     import { onMount } from 'svelte'
+    import { resolve } from '$app/paths'
 
     onMount(() => {
         socket.subscribe(isConnected => {
             if (isConnected) {
-                goto('/controller')
+                goto(resolve('/controller'))
             }
         })
     })
@@ -21,7 +22,7 @@
         <div class="card-body w-80">
             <h2 class="card-title text-center text-2xl">Begin you journey</h2>
             <p class="py-6 text-center"></p>
-            <a class="btn btn-primary" href={$socket ? '/controller' : '/connection'}>
+            <a class="btn btn-primary" href={resolve($socket ? '/controller' : '/connection')}>
                 Add Robot Dog
             </a>
         </div>
diff --git a/app/src/routes/peripherals/+page.ts b/app/src/routes/peripherals/+page.ts
index ac6fbc7..c717ca9 100644
--- a/app/src/routes/peripherals/+page.ts
+++ b/app/src/routes/peripherals/+page.ts
@@ -1,7 +1,8 @@
 import type { PageLoad } from './$types'
 import { goto } from '$app/navigation'
+import { resolve } from '$app/paths'
 
 export const load = (async () => {
-    goto('/')
+    goto(resolve('/'))
     return
 }) satisfies PageLoad
diff --git a/app/src/routes/system/+page.ts b/app/src/routes/system/+page.ts
index ac6fbc7..c717ca9 100644
--- a/app/src/routes/system/+page.ts
+++ b/app/src/routes/system/+page.ts
@@ -1,7 +1,8 @@
 import type { PageLoad } from './$types'
 import { goto } from '$app/navigation'
+import { resolve } from '$app/paths'
 
 export const load = (async () => {
-    goto('/')
+    goto(resolve('/'))
     return
 }) satisfies PageLoad
diff --git a/app/src/routes/wifi/+page.ts b/app/src/routes/wifi/+page.ts
index ac6fbc7..c717ca9 100644
--- a/app/src/routes/wifi/+page.ts
+++ b/app/src/routes/wifi/+page.ts
@@ -1,7 +1,8 @@
 import type { PageLoad } from './$types'
 import { goto } from '$app/navigation'
+import { resolve } from '$app/paths'
 
 export const load = (async () => {
-    goto('/')
+    goto(resolve('/'))
     return
 }) satisfies PageLoad