-> 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.js file.

Layout Components

import BreadCrumb from 'Common/BreadCrumb';
import React from 'react';
import { Container } from 'react-bootstrap';

const Index = () => {
    document.title = "Index | Skote - React Admin & Dashboard Template" // or "Index | Skote - Vite React Admin & Dashboard Template"
    return (
        <div className="page-content">
            <React.Fragment>
                <Container fluid>
                    <BreadCrumb title={props.t("Index")} breadcrumbItem={props.t("Index Page")}/>
                        <>
                            // write the code here...
                        </>
                  </Container>
            </React.Fragment>
        </div>
    )
}

export default Index;

Without Layout Components

import React from 'react';
import { Container } from 'react-bootstrap';
                            
const Login = () => {
    document.title = "Log In| Skote - Admin & Dashboard Template" // or "Log In| Skote - Vite React Admin & Dashboard Template"
    return (
        <React.Fragment>
            <div className="account-pages my-5 pt-sm-5">
                <Container>
                    // write the code here...
                </Container>
            </div>
        </React.Fragment>
    )
}
export default Login;

2. Add your new page's route in src/routes/index.jsx file.

import newPage from "../pages/AuthenticationInner/Login";

const publicRoutes = [
    { path: "/pages-login", component: <Login /> }                                          
]

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

const authProtectedRoutes = [
    { path: "/index", component: <Index /> }                                          
]