move router to App.js

Author: tomvictor

src/App.js

@@ -1,39 +1,52 @@
-
+import 'bootstrap/dist/css/bootstrap.css';
+import '@floating-ui/react';
 import './App.css';
-import UserList from './components/userList';
-import Navbar from './components/navbar';
-import CreateUser from './components/userCreate';
+import Home from './routes/home';
+import UserLogin from './routes/login';
+import ErrorPage from "./routes/error-pages";
+import UserPage from './routes/users';
+
+import {
+    createBrowserRouter,
+    RouterProvider,
+} from "react-router-dom";
+import SkillPage from './routes/skills';
+import UserDetail from './routes/userDetail';
+
+
+const router = createBrowserRouter([
+
+    {
+        path: "/",
+        element: <Home />,
+        errorElement: <ErrorPage />,
+    },
+    {
+        path: "/users",
+        element: <UserPage />,
+        errorElement: <ErrorPage />,
+    },
+    {
+        path: "/users/:userId/",
+        element: <UserDetail />,
+        errorElement: <ErrorPage />,
+    },
+    {
+        path: "/skills",
+        element: <SkillPage />,
+        errorElement: <ErrorPage />,
+    },
+    {
+        path: "/login",
+        element: <UserLogin />,
+        errorElement: <ErrorPage />,
+    },
+]);
+
 
 function App() {
     return (
-
-        <div className="container-fluid">
-
-            <div className="row">
-                <div className="col gap-3">
-                    <Navbar />
-                </div>
-            </div>
-
-            <br />
-
-            <div className="row align-items-center">
-                <div className="col-4">
-                    <CreateUser />
-                </div>
-            </div>
-
-            <br />
-
-            <div className="row">
-                <div className="col">
-                    <UserList />
-                </div>
-            </div>
-
-            <br />
-
-        </div>
+        <RouterProvider router={router} />
     );
 }
 

src/index.js

@@ -1,59 +1,17 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-// import App from './App';
-// import './App.css';
+import App from './App';
+import './App.css';
 import 'bootstrap/dist/css/bootstrap.css';
 import '@floating-ui/react';
-import Home from './routes/home';
-import UserLogin from './routes/login';
 import reportWebVitals from './reportWebVitals';
-import ErrorPage from "./routes/error-pages";
-import UserPage from './routes/users';
-
-import {
-  createBrowserRouter,
-  RouterProvider,
-} from "react-router-dom";
-import SkillPage from './routes/skills';
-import UserDetail from './routes/userDetail';
-
-
-const router = createBrowserRouter([
-
-  {
-    path: "/",
-    element: <Home />,
-    errorElement: <ErrorPage />,
-  },
-  {
-    path: "/users",
-    element: <UserPage />,
-    errorElement: <ErrorPage />,
-  },
-
-  {
-    path: "/users/:userId/",
-    element: <UserDetail />,
-    errorElement: <ErrorPage />,
-  },
-  {
-    path: "/skills",
-    element: <SkillPage />,
-    errorElement: <ErrorPage />,
-  },
-  {
-    path: "/login",
-    element: <UserLogin />,
-    errorElement: <ErrorPage />,
-  },
-]);
 
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
   <React.StrictMode>
-    <RouterProvider router={router} />
+    <App />
   </React.StrictMode>
 );