diff --git a/.github/workflows/frontend-react-cd.yml b/.github/workflows/frontend-react-cd.yml
index 2319b19..c93f282 100644
--- a/.github/workflows/frontend-react-cd.yml
+++ b/.github/workflows/frontend-react-cd.yml
@@ -10,6 +10,7 @@ on:
 
 jobs:
   deploy:
+    if: false
     runs-on: ubuntu-latest
     defaults:
       run:
diff --git a/frontend/react/src/App.jsx b/frontend/react/src/Customer.jsx
similarity index 98%
rename from frontend/react/src/App.jsx
rename to frontend/react/src/Customer.jsx
index 415f898..8ba2a8b 100644
--- a/frontend/react/src/App.jsx
+++ b/frontend/react/src/Customer.jsx
@@ -11,7 +11,7 @@ import CardWithImage from "./components/customer/CustomerCard.jsx";
 import CreateCustomerDrawer from "./components/customer/CreateCustomerDrawer.jsx";
 import {errorNotification} from "./services/notification.js";
 
-const App = () => {
+const Customer = () => {
 
     const [customers, setCustomers] = useState([]);
     const [loading, setLoading] = useState(false);
@@ -92,4 +92,4 @@ const App = () => {
     )
 }
 
-export default App;
\ No newline at end of file
+export default Customer;
\ No newline at end of file
diff --git a/frontend/react/src/Home.jsx b/frontend/react/src/Home.jsx
new file mode 100644
index 0000000..5d3407f
--- /dev/null
+++ b/frontend/react/src/Home.jsx
@@ -0,0 +1,13 @@
+import SidebarWithHeader from "./components/shared/SideBar.jsx";
+import {Text} from "@chakra-ui/react";
+
+const Home = () => {
+
+    return (
+        <SidebarWithHeader>
+            <Text fontSize={"6xl"}>Dashboard</Text>
+        </SidebarWithHeader>
+    )
+}
+
+export default Home;
\ No newline at end of file
diff --git a/frontend/react/src/components/login/Login.jsx b/frontend/react/src/components/login/Login.jsx
index 44abc3b..b308072 100644
--- a/frontend/react/src/components/login/Login.jsx
+++ b/frontend/react/src/components/login/Login.jsx
@@ -107,7 +107,7 @@ const Login = () => {
 
     useEffect(() => {
         if (customer) {
-            navigate("/dashboard");
+            navigate("/dashboard/customers");
         }
     })
 
diff --git a/frontend/react/src/components/shared/SideBar.jsx b/frontend/react/src/components/shared/SideBar.jsx
index 5bf71bb..e92b4c9 100644
--- a/frontend/react/src/components/shared/SideBar.jsx
+++ b/frontend/react/src/components/shared/SideBar.jsx
@@ -25,21 +25,17 @@ import {
 import {
     FiBell,
     FiChevronDown,
-    FiCompass,
     FiHome,
     FiMenu,
     FiSettings,
-    FiStar,
-    FiTrendingUp
+    FiUsers
 } from 'react-icons/fi';
 import {useAuth} from "../context/AuthContext.jsx";
 
 const LinkItems = [
-    {name: 'Home', icon: FiHome},
-    {name: 'Trending', icon: FiTrendingUp},
-    {name: 'Explore', icon: FiCompass},
-    {name: 'Favourites', icon: FiStar},
-    {name: 'Settings', icon: FiSettings},
+    {name: 'Home', route: '/dashboard', icon: FiHome},
+    {name: 'Customers', route: '/dashboard/customers',  icon: FiUsers},
+    {name: 'Settings', route: '/dashboard/settings', icon: FiSettings},
 ];
 
 export default function SidebarWithHeader({children}) {
@@ -95,7 +91,7 @@ const SidebarContent = ({onClose, ...rest}) => {
                 <CloseButton display={{base: 'flex', md: 'none'}} onClick={onClose}/>
             </Flex>
             {LinkItems.map((link) => (
-                <NavItem key={link.name} icon={link.icon}>
+                <NavItem key={link.name} route={link.route} icon={link.icon}>
                     {link.name}
                 </NavItem>
             ))}
@@ -103,9 +99,9 @@ const SidebarContent = ({onClose, ...rest}) => {
     );
 };
 
-const NavItem = ({icon, children, ...rest}) => {
+const NavItem = ({icon, route, children, ...rest}) => {
     return (
-        // <Link href="frontend/react/src/components/shared#" style={{textDecoration: 'none'}} _focus={{boxShadow: 'none'}}>
+        <Link href={route} style={{textDecoration: 'none'}} _focus={{boxShadow: 'none'}}>
             <Flex
                 align="center"
                 p="4"
@@ -130,7 +126,7 @@ const NavItem = ({icon, children, ...rest}) => {
                 )}
                 {children}
             </Flex>
-        // </Link>
+        </Link>
     );
 };
 
diff --git a/frontend/react/src/components/signup/Signup.jsx b/frontend/react/src/components/signup/Signup.jsx
index 63937a0..622190e 100644
--- a/frontend/react/src/components/signup/Signup.jsx
+++ b/frontend/react/src/components/signup/Signup.jsx
@@ -10,7 +10,7 @@ const Signup = () => {
 
     useEffect(() => {
         if (customer) {
-            navigate("/dashboard");
+            navigate("/dashboard/customers");
         }
     })
 
diff --git a/frontend/react/src/main.jsx b/frontend/react/src/main.jsx
index 9078928..1e72769 100644
--- a/frontend/react/src/main.jsx
+++ b/frontend/react/src/main.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
-import App from './App'
-import {ChakraProvider} from '@chakra-ui/react'
+import Customer from './Customer.jsx'
+import {ChakraProvider, Text} from '@chakra-ui/react'
 import { createStandaloneToast } from '@chakra-ui/toast'
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 import Login from "./components/login/Login.jsx";
@@ -9,6 +9,7 @@ import Signup from "./components/signup/Signup";
 import AuthProvider from "./components/context/AuthContext.jsx";
 import ProtectedRoute from "./components/shared/ProtectedRoute.jsx";
 import './index.css'
+import Home from "./Home.jsx";
 
 const { ToastContainer } = createStandaloneToast();
 
@@ -23,7 +24,11 @@ const router = createBrowserRouter([
     },
     {
         path: "dashboard",
-        element: <ProtectedRoute><App /></ProtectedRoute>
+        element: <ProtectedRoute><Home/></ProtectedRoute>
+    },
+    {
+        path: "dashboard/customers",
+        element: <ProtectedRoute><Customer /></ProtectedRoute>
     }
 ])