refactor: went to router-view instead of hard loading

src/App.vue

@@ -1,18 +1,12 @@
 <template>
-  <Login />
-  <LoggedinPage />
+  <div id="app">
+    <router-view />
+  </div>
 </template>
 
 <script>
-import Login from './components/UserLogin.vue';
-import LoggedinPage from './components/LoggedinPage.vue';
-
 export default {
-  name: 'App',
-  components: {
-    Login,
-    LoggedinPage
-  }
+  name: 'App'
 }
 </script>
 
@@ -23,6 +17,5 @@ export default {
   -moz-osx-font-smoothing: grayscale;
   text-align: center;
   color: #2c3e50;
-  margin-top: 60px;
 }
-</style>
+</style>

src/router/index.js

@@ -1,11 +1,24 @@
 import { createRouter, createWebHistory } from 'vue-router';
-import Login from '../components/UserLogin.vue';
-import LoggedinPage from '@/components/LoggedinPage.vue';
 
+// Lazy load components for better performance
 const routes = [
-  { path: '/', component: Login },
-  { path: '/logged-in', component: LoggedinPage}
-  //{ path: '/dashboard', component: () => import('../components/Dashboard.vue') }, // Placeholder for a dashboard page
+  { 
+    path: '/', 
+    name: 'Home',
+    component: () => import('../components/Home.vue') 
+  },
+  { 
+    path: '/login', 
+    name: 'Login',
+    component: () => import('../components/UserLogin.vue') 
+  },
+  { 
+    path: '/logged-in', 
+    name: 'LoggedIn',
+    component: () => import('../components/LoggedinPage.vue'),
+    // Optional: Add route guard to check if user is actually logged in
+    meta: { requiresAuth: true }
+  }
 ];
 
 const router = createRouter({
@@ -13,4 +26,18 @@ const router = createRouter({
   routes,
 });
 
-export default router;
+// Optional: Navigation guard example
+router.beforeEach((to, from, next) => {
+  // Check if route requires authentication
+  if (to.meta.requiresAuth) {
+    // Check if user is logged in (implement your auth logic)
+    const isLoggedIn = localStorage.getItem('user') || sessionStorage.getItem('user');
+    if (!isLoggedIn) {
+      next('/login');
+      return;
+    }
+  }
+  next();
+});
+
+export default router;