1

I want to create a login/sign-up page in my application with react but in the router section. I don't want my login page to have the layout component which I have created for every other page that my app renders. All the routes that you see below have the layout component inside them but for the login page, I don't want the layout inside the login page. My layout component has a sidebar and a topbar built inside it which is irrelevant for the login page. That's the reason I don't want it on login or sign-up pages.

import Dashboard from "./Pages/Dashboard/Dashboard";
import Wallets from "./Pages/Wallets";
import Crypto_transactions from "./Pages/Crypto_transactions";
import Rial_transactions from "./Pages/Rial_transactions";
import { BrowserRouter, Routes, Route } from "react-router-dom";
import Layout from "./Pages/Layout";
import Tickets from "./Pages/Tickets";
import Buy from "./Pages/Buy";
import Sell from "./Pages/Sell";
import Orders from "./Pages/Orders";
import Open_transactions from "./Pages/Open_transactions";
import Trade_logs from "./Pages/Trade_logs";
import Credit_cards from "./Pages/Credit_cards";
import Invitation from "./Pages/Invitation";
import Authentication from "./Pages/Authentication";
import Password from "./Pages/Password";
import Login from "./Pages/Login";

function App() {
    return (
        <BrowserRouter>
            <Layout></Layout>
            <Routes>
                <Route path="/" element={<Dashboard />} />
                <Route path="wallets" element={<Wallets />} />
                <Route path="crypto-transactions" element={<Crypto_transactions />} />
                <Route path="rial-transactions" element={<Rial_transactions />} />
                <Route path="tickets" element={<Tickets />} />
                <Route path="buy" element={<Buy />} />
                <Route path="sell" element={<Sell />} />
                <Route path="orders" element={<Orders />} />
                <Route path="open-transactions" element={<Open_transactions />} />
                <Route path="trade-logs" element={<Trade_logs />} />
                <Route path="credit-cards" element={<Credit_cards     />} />
                <Route path="invitation" element={<Invitation />} />
                <Route path="authentication" element={<Authentication />} />
                <Route path="password" element={<Password />} />
            </Routes>
        </BrowserRouter>
    );
}

export default App;
Drew Reese
  • 165,259
  • 14
  • 153
  • 181

0 Answers0