index.html

index.js

App.js

import Footer from "./partials/Footer";
import Header from "./partials/Header";
import Sidebar from "./partials/Sidebar";
import Scrolltop from "./partials/Scrolltop";

import {
 Routes,
 Route,
} from "react-router-dom";

import {Helmet} from "react-helmet";

import Dashboard from "./pages/Dashboard";
import Projects from "./pages/projects/Projects";
import Project from "./pages/projects/Project";

function App() { 
 return (
 <div className="d-flex flex-column flex-root app-root" id="kt_app_root">
 <div className="app-page flex-column flex-column-fluid" id="kt_app_page">

 <Header />

 <div className="app-wrapper flex-column flex-row-fluid" id="kt_app_wrapper">

 <Sidebar />

 <div className="app-main flex-column flex-row-fluid" id="kt_app_main">
 <div className="d-flex flex-column flex-column-fluid">
 <div id="kt_app_content" className="app-content flex-column-fluid">
 <div id="kt_app_content_container" className="app-container container-xxl">

 <Routes>
 <Route path="/" element={<Dashboard />} />
 <Route path="/projects" element={<Projects />}>
 <Route path=":projectId" element={<Project />} />
 </Route>
 </Routes>

 </div>
 </div>
 </div>

 <Footer />
 </div>
 </div>
 </div>

 <Scrolltop />

 <Helmet>
 <script src="/assets/js/theme-mode.js"></script>
 <script src="/assets/plugins/global/plugins.bundle.js"></script>
 <script src="/assets/js/scripts.bundle.js"></script>
 </Helmet>

 </div>
 );
}

export default App;