feat: add routing for home, login and notFound page

frontend/src/App.js

@@ -1,25 +1,12 @@
-import logo from './logo.svg';
 import './App.css';
+import { Outlet } from 'react-router-dom';
+import Header from './components/Header';
 
 const App = () => (
-  <div className="App">
-    <header className="App-header">
-      <img src={logo} className="App-logo" alt="logo" />
-      <p>
-        Edit
-        <code>src/App.js</code>
-        and save to reload.
-      </p>
-      <a
-        className="App-link"
-        href="https://reactjs.org"
-        target="_blank"
-        rel="noopener noreferrer"
-      >
-        Learn React
-      </a>
-    </header>
-  </div>
+  <>
+    <Header />
+    <Outlet />
+  </>
 );
 
 export default App;

frontend/src/components/Header.jsx

@@ -0,0 +1,7 @@
+const Header = () => (
+  <div>
+    Header
+  </div>
+);
+
+export default Header;

frontend/src/index.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-import App from './App';
+import { RouterProvider } from 'react-router-dom';
+import router from './router/router';
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
   <React.StrictMode>
-    <App />
+    <RouterProvider router={router} />
   </React.StrictMode>,
 );

frontend/src/pages/Home.jsx

@@ -0,0 +1,8 @@
+const Home = () => (
+  <div>
+    <h1>Home Page</h1>
+    <p>Welcome to the Home Page!</p>
+  </div>
+);
+
+export default Home;

frontend/src/pages/Login.jsx

@@ -0,0 +1,5 @@
+const Login = () => (
+  <h1>Login Page</h1>
+);
+
+export default Login;

frontend/src/pages/NotFound.jsx

@@ -0,0 +1,8 @@
+const NotFound = () => (
+  <div>
+    <h1>404 - Page Not Found</h1>
+    <p>The page you are looking for does not exist.</p>
+  </div>
+);
+
+export default NotFound;

frontend/src/router/router.js

@@ -0,0 +1,28 @@
+import { createBrowserRouter } from 'react-router-dom';
+import Home from '../pages/Home';
+import Login from '../pages/Login';
+import NotFound from '../pages/NotFound';
+import App from '../App';
+
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: <App />,
+    children: [
+      {
+        index: true,
+        element: <Home />,
+      },
+      {
+        path: 'login',
+        element: <Login />,
+      },
+      {
+        path: '*',
+        element: <NotFound />,
+      },
+    ],
+  },
+]);
+
+export default router;