Folder Structure
A straightforward and easy-to-navigate folder structure simplifies the process of finding what you need.
Last updated
A straightforward and easy-to-navigate folder structure simplifies the process of finding what you need.
Last updated
If you prefer reading docs, continue reading below instead watching the above video.
Under theberry-material-react/ directory, You will find the following folder structure.
berry-material-react
..
├── package.json -> Package json file.
├── public
├── README.md
├── src
│ ├── _mockApis -> Mock Json data to be used for working apps
│ ├── assets
│ │ ├── images
│ │ ├── scss -> Template SCSS files
│ │ ├── style.scss -> Application main file
│ │ ├── _themes-vars.module.scss
│ ├── contexts -> State context for Login management
│ ├── hooks -> Custom hooks
│ ├── layout
│ │ ├── DocsLayout -> Layout for docs components & routers
│ │ ├── MainLayout -> Layout for main components & routers
│ │ ├── MinimalLayout -> Layout for mimimal components & routers
│ │ ├── NavigationScroll.js
│ │ ├── NavMotion.js
│ ├── menu-items -> menu items
│ ├── routes -> different route based on layouts
│ ├── store -> Redux actions, reducers
│ │ ├── slices -> different slices of toolkit
│ ├── themes -> Contains application style and theme
│ ├── types -> common types for Typescript. Exist only in Typescript
│ ├── ui-component -> Template custom & reusable components
│ ├── utils
│ │ ├── locales -> different locale json files
│ │ ├── route-guard -> Auth guard to prevent unexpected navigations
│ └── views -> View files for all pages
├── App.js -> starting point of application
├── config.js -> Template constant value and live customization
├── index.js -> Application root js fileberry-material-react
..
├── package.json -> Package json file.
├── public
│ ├── assets -> images in different directories
│ │ ├── auth
│ │ ├── cards
│ │ ├── docs
│ │ ├── ...
│ ├── favicon.ico
├── README.md
├── src
│ ├── app -> next js pages
│ │ ├── dashboard
│ │ ├── minimal
│ │ ├── simple
│ │ ├── ...
│ ├── components -> components used in different pages
│ │ ├── application
│ │ ├── authentication
│ │ ├── contact-us
│ │ ├── dashboard
│ │ ├── ...
│ ├── contexts -> State context for Login and other
│ ├── hooks -> Custom hooks
│ ├── Data -> Custom data
│ ├── layout
│ │ ├── Customization
│ │ ├── MainLayout -> Layout for main components & routers
│ │ ├── MinimalLayout -> Layout for minimal components & routers
│ │ ├── NavigationScroll.js
│ │ ├── NavMotion.js
│ │ ├── GuestGuard.js
│ ├── menu-items -> menu items for each main menu
│ │ ├── application.js
│ │ ├── dashboard.js
│ │ ├── ...
│ ├── scss -> styles-themes
│ ├── store -> Redux actions, reducers
│ │ ├── slices -> different slices of toolkit
│ │ ├── ...
│ ├── themes -> Contains application style and theme
│ ├── types -> common types for Typescript. Exist only in Typescript
│ ├── utils
│ │ ├── locales -> different locale json files
│ │ ├── route-guard -> Auth guard to prevent unexpected navigations
│ ├── views
│ │ ├── app
│ │ ├── authenticaion
│ │ ├── ...
├── config.js -> Template constant value and live customization berry-material-react
..
├── package.json -> Package json file.
├── public
│ ├── assets -> images in different directories
│ │ ├── landing
│ │ ├── profile
│ │ ├── users
├── README.md
├── app
│ ├── assets
│ │ ├── images -> images in different directories
│ │ │ ├── auth
│ │ │ ├── cards
│ │ │ ├── docs
│ │ │ ├── ...
│ │ ├── scss -> styles-themes
│ │ ├── styles.js -> comman styles from different scss modules
│ ├── components -> components used in different pages
│ │ ├── application
│ │ ├── authentication
│ │ ├── contact-us
│ │ ├── dashboard
│ │ ├── ...
│ ├── contexts -> State context for Login and other
│ ├── hooks -> Custom hooks
│ ├── layout
│ │ ├── Customization
│ │ ├── MainLayout -> Layout for main components & routers
│ │ ├── MinimalLayout -> Layout for minimal components & routers
│ │ ├── NavigationScroll.js
│ │ ├── NavMotion.js
│ │ ├── GuestGuard.js
│ ├── menu-items -> menu items for each main menu
│ │ ├── application.js
│ │ ├── dashboard.js
│ │ ├── ...
│ ├── routes -> remix js routes
│ ├── store -> Redux actions, reducers
│ │ ├── slices -> different slices of toolkit
│ │ │ ├── api -> api setup for different slices
│ ├── themes -> Contains application style and theme
│ ├── types -> common types for Typescript. Exist only in Typescript
│ ├── utils
│ │ ├── locales -> different locale json files
│ │ ├── route-guard -> Auth guard to prevent unexpected navigations
├── config.js -> Template constant value and live customization
├── root.js -> The main entry point of the router