Create a New Page

-> Follow the below steps to create new page.

1. Create a new folder in src/pages. ex. NewPage, and then create a ts file in src/pages/NewPage with name Index.tsx file.

Layout Components

import React from 'react';
import BreadCrumb from 'Common/BreadCrumb';

const Index = () => {
    return (
        <React.Fragment>
            <div className='container-fluid group-data-[content=boxed]:max-w-boxed mx-auto'>
                <BreadCrumb title='Ecommerce' pageTitle='Dashboards'/>
                    <>
                        // write the code here...
                    </>
              </div>
        </React.Fragment>
    )
}

export default Index;

Without Layout Components

import React from 'react';
                        
const AuthLogIn = () => {
    document.title = "Log In | Tailwick - React Admin & Dashboard Template";
    return (
        <React.Fragment>
            <div>
                    // write the code here...
            </div>
        </React.Fragment>
    )
}
export default AuthLogIn;

2. Add your new page's route in /src/Routes/allRoutes.ts file.

Check the Routes section to see how to add routes to the web application.

if you want to create a page with blank layout, then add your page's routes in publicRoutes :-

import newPage from "../pages/AuthLogIn";

const publicRoutes = [
    { path: "/auth-login", component: AuthLogIn },                                          
];

if you want to create a page with full layout, then add your page's routes in authProtectedRoutes :-

import newPage from "../pages/Index";
    
const authProtectedRoutes = [
    { path: "/index", component: Index },     
];