diff --git a/package-lock.json b/package-lock.json
index 2dc1d8d..e09e9b7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,6 +15,7 @@
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-map-gl": "^7.1.7",
+        "react-router-dom": "^6.24.0",
         "sass": "^1.76.0"
       },
       "devDependencies": {
@@ -1077,6 +1078,14 @@
         "url": "https://opencollective.com/popperjs"
       }
     },
+    "node_modules/@remix-run/router": {
+      "version": "1.17.0",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.17.0.tgz",
+      "integrity": "sha512-2D6XaHEVvkCn682XBnipbJjgZUU7xjLtA4dGJRBVUKpEaDYOZMENZoZjAOSb7qirxt5RupjzZxz4fK2FO+EFPw==",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/@rollup/rollup-android-arm-eabi": {
       "version": "4.17.2",
       "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.17.2.tgz",
@@ -3462,6 +3471,36 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-router": {
+      "version": "6.24.0",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.24.0.tgz",
+      "integrity": "sha512-sQrgJ5bXk7vbcC4BxQxeNa5UmboFm35we1AFK0VvQaz9g0LzxEIuLOhHIoZ8rnu9BO21ishGeL9no1WB76W/eg==",
+      "dependencies": {
+        "@remix-run/router": "1.17.0"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "6.24.0",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.24.0.tgz",
+      "integrity": "sha512-960sKuau6/yEwS8e+NVEidYQb1hNjAYM327gjEyXlc6r3Skf2vtwuJ2l7lssdegD2YjoKG5l8MsVyeTDlVeY8g==",
+      "dependencies": {
+        "@remix-run/router": "1.17.0",
+        "react-router": "6.24.0"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8",
+        "react-dom": ">=16.8"
+      }
+    },
     "node_modules/readable-stream": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
diff --git a/package.json b/package.json
index b7e0291..020a21a 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-map-gl": "^7.1.7",
+    "react-router-dom": "^6.24.0",
     "sass": "^1.76.0"
   },
   "devDependencies": {
@@ -37,5 +38,5 @@
     "typescript": "^5.2.2",
     "vite": "^5.2.0"
   },
-  "homepage": "./map/"
+  "homepage": "/map/"
 }
diff --git a/src/main.tsx b/src/main.tsx
index 4907391..fb53ba5 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -3,9 +3,21 @@ import ReactDOM from 'react-dom/client'
 import App from './App.tsx'
 import 'mapbox-gl/dist/mapbox-gl.css';
 import './index.scss'
+import { RouterProvider, createBrowserRouter } from 'react-router-dom';
+
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: (
+      <App />
+    )
+  },
+], {
+  basename: import.meta.env.VITE_BASEURL
+});
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
-    <App />
+    <RouterProvider router={router} />
   </React.StrictMode>
 )
diff --git a/vite.config.ts b/vite.config.ts
index 387f204..df17b6c 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -3,5 +3,6 @@ import react from '@vitejs/plugin-react'
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  // base: '/map/',
   plugins: [react()],
 })