diff --git a/web/src/router/routes.ts b/web/src/router/index.ts
similarity index 60%
rename from web/src/router/routes.ts
rename to web/src/router/index.ts
index 09d2df1..64e2aa1 100644
--- a/web/src/router/routes.ts
+++ b/web/src/router/index.ts
@@ -1,19 +1,22 @@
 import { createRouter, createWebHistory } from 'vue-router'
-import BudgetSidebar from '../pages/BudgetSidebar.vue';
+import DashboardCard from '../components/Card.vue';
 import Dashboard from '../pages/Dashboard.vue';
 import Login from '../pages/Login.vue';
 import Index from '../pages/Index.vue';
 import Register from '../pages/Register.vue';
-import Account from '../pages/Account.vue';
+import Account from '@/pages/Account.vue';
 import Settings from '../pages/Settings.vue';
+import Budgeting from '../pages/Budgeting.vue';
+import BudgetSidebar from '../pages/BudgetSidebar.vue';
 
 const routes = [
   { path: '/', name: 'Index', component: Index },
   { path: '/dashboard', name: 'Dashboard', component: Dashboard },
   { path: '/login', name: 'Login', component: Login },
   { path: '/register', name: 'Register', component: Register },
-  { path: '/budget/:budgetid',  name: 'Budget', components: { default: Dashboard, sidebar: BudgetSidebar }, props: true },
-  { path: '/budget/:budgetid/Settings',  name: 'Budget Settings', components: { default: Settings, sidebar: BudgetSidebar }, props: true },
+  { path: '/budget/:budgetid', name: 'Budget', components: { default: Budgeting, sidebar: BudgetSidebar }, props: true },
+  { path: '/budget/:budgetid/:year/:month', name: 'Budget', components: { default: Budgeting, sidebar: BudgetSidebar }, props: true },
+  { path: '/budget/:budgetid/Settings', name: 'Budget Settings', components: { default: Settings, sidebar: BudgetSidebar }, props: true },
   { path: '/budget/:budgetid/account/:accountid', name: 'Account', components: { default: Account, sidebar: BudgetSidebar }, props: true },
 ]