[test] : Added Basic Layout

TusharSSurve · Apr 14, 2024 · cbe34c1 · cbe34c1
1 parent a75efda
commit cbe34c1
Show file tree

Hide file tree

Showing 10 changed files with 168 additions and 23 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,6 +10,8 @@
     "gh-pages": "^6.1.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-helmet": "^6.1.0",
+    "react-router-dom": "^6.22.3",
     "react-scripts": "^3.0.1",
     "sass": "^1.70.0",
     "web-vitals": "^2.1.4"
@@ -39,4 +41,4 @@
       "last 1 safari version"
     ]
   }
-}
+}
diff --git a/public/index.html b/public/index.html
@@ -5,9 +5,10 @@
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
+    <meta name="author" content="Tushar Surve">
     <meta
       name="description"
-      content="Web site created using create-react-app"
+      content="Tushar Surve's Portfolio"
     />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <!--
@@ -24,7 +25,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>Tushar Surve</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/public/sitemap.xml b/public/sitemap.xml
diff --git a/src/App.js b/src/App.js
@@ -1,25 +1,22 @@
-import './App.css';
-
-import React from 'react';
+import "./App.css";
+import React from "react";
+import { createBrowserRouter, RouterProvider } from "react-router-dom";
+import ErrorPage from "./pages/ErrorPage";
+import Homepage from "./pages/Homepage";
+import Root from "./pages/Root";
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: <Root />,
+    errorElement: <ErrorPage />,
+    children: [
+      { path: '/', element: <Homepage /> },
+    ],
+  }
+]);
 
 function App() {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <p>
-          Hello
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
+  return <RouterProvider router={router} />;
 }
 
 export default App;
diff --git a/src/pages/ErrorPage.js b/src/pages/ErrorPage.js
@@ -0,0 +1,10 @@
+import React from "react";
+
+function ErrorPage() {
+  return (
+    <>
+      <h1>404 Error Page</h1>
+    </>
+  );
+}
+export default ErrorPage;
diff --git a/src/pages/Homepage.js b/src/pages/Homepage.js
@@ -0,0 +1,10 @@
+import React from "react";
+
+function Homepage() {
+  return (
+    <>
+      <h1>Homepage</h1>
+    </>
+  );
+}
+export default Homepage;
diff --git a/src/pages/Root.js b/src/pages/Root.js
@@ -0,0 +1,14 @@
+import React from 'react';
+import { Outlet } from 'react-router-dom';
+
+function Root() {
+    return (
+      <>
+        <main>
+          <Outlet />
+        </main>
+      </>
+    );
+  }
+
+  export default Root;