Folder Structure
A simple, intuitive folder structure ensures easy navigation without any hassle.
Under themantis-material-react/ In the directory, you will find the following folder structure.
mantis-react-ts
..
├── src
│ ├── _api -> Mock JSON data to be used for working apps
│ ├── assets
│ │ ├── images
│ │ ├── third-party -> Third-party styles
│ ├── components -> Common components used across a theme
│ │ ├── @extended -> Extended components of MUI
│ │ ├── cards -> Cards used at different locations
│ │ ├── logo
│ │ ├── third-party
│ │ ├── ...
│ ├── contexts -> State context for Login management & config
│ ├── data -> Static data
│ ├── hooks -> Custom hooks
│ ├── layout
│ │ ├── Auth -> Layout for login showcase
│ │ ├── Component -> Layout for components showcase
│ │ ├── Dashboard -> Layout for dashboard
│ │ ├── Pages -> Blank pages
│ │ ├── Simple -> Layout for landing and contact showcase
│ ├── menu-items -> Menu items
│ ├── metrics -> metrics items
│ ├── pages -> View files for all pages
│ │ ├── apps
│ │ ├── auth
│ │ ├── ...
│ ├── routes -> Different routes based on layouts
│ ├── sections -> This contains different sections used only for pages
│ ├── themes -> Contains application style and theme
│ │ ├── overrides -> MUI overrides for each component
│ │ ├── theme -> Different theme preset
│ │ ├── ... -> Other theme-related setups
│ ├── type -> common types for Typescript
│ ├── utils
│ │ ├── locales -> Different locale JSON files
│ │ ├── route-guard -> Auth guard to prevent unexpected navigations
│ │ ├── ... -> Other utils function
│ ├── App.tsx
│ ├── config.ts -> Different theme config
│ ├── index.tsx
├── .env -> Store configuration settings and environment variables
├── eslint.config.mjs -> To configure ESLint rules
├── .prettierrc -> To Code formatting style rules
├── tsconfig.json
├── package-lock.json -> File generated by npm
├── package.json -> Contains metadata (name, version, dependencies, scripts, and other)
├── README.md
├── yarn.lock -> File generated by yarnLast updated