0% found this document useful (0 votes)
7 views1 page

Code For App

The document contains the code for an App.jsx file in a React application. It sets up routing using React Router, defining public routes for Home and Login, and protected routes for Products, About Us, and various categories that require authentication. The PrivateRoute component is used to restrict access to certain routes based on user authentication status.

Uploaded by

r2015899
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views1 page

Code For App

The document contains the code for an App.jsx file in a React application. It sets up routing using React Router, defining public routes for Home and Login, and protected routes for Products, About Us, and various categories that require authentication. The PrivateRoute component is used to restrict access to certain routes based on user authentication status.

Uploaded by

r2015899
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

CODE FOR APP.

JSX FILE

import React from 'react';


import { Route, Routes } from 'react-router-dom';
import Home from './components/Home/Home';
import Products from './components/Products/Products';
import AboutUs from './components/About/AboutUs';
import Cat1 from './components/cat1';
import Cat2 from './components/cat2';
import Cat3 from './components/cat3';
import Pr1 from './components/pr1';
import Log from './components/Log'; // Import the login page
import PrivateRoute from './components/PrivateRoute'; // Import the
private route component

function App() {
return (
<>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/login" element={<Log />} /> {/* Login page route
*/}

{/* Protected routes - only accessible if authenticated */}


<Route path="/Products" element={<PrivateRoute element={<Products
/>} />} />
<Route path="/AboutUs" element={<PrivateRoute element={<AboutUs
/>} />} />
<Route path="/Cat1" element={<PrivateRoute element={<Cat1 />} />}
/>
<Route path="/Cat2" element={<PrivateRoute element={<Cat2 />} />}
/>
<Route path="/Cat3" element={<PrivateRoute element={<Cat3 />} />}
/>
<Route path="/Pr1" element={<PrivateRoute element={<Pr1 />} />}
/>
</Routes>
</>
);
}

export default App;

You might also like