📂Folder Structure

Simple intuitive folder structure helps you to navigate easily without any hassle.

Under the able-pro-material-next/ In the directory, you will find the following folder structure.

NEXT (TS)

able-pro-material-next-ts

..
├── public
│   ├── assets             -> images in different directories
│   │   ├── images
│   │   │   ├── auth
│   │   │   ├── cards
│   │   │   ├── ...
│   │   ├── third-party
├── src              
│   ├── api
│   ├── app                -> different routes based on layouts
│   │   ├── (auth)         
│   │   ├── (blank)     
│   │   ├── (component)    
│   │   ├── (dashboard)       
│   │   │   ├── apps
│   │   │   ├── charts
│   │   │   ├── ...
│   │   ├── (simple)       -> Layout for simple
│   ├── components         -> components used in different pages
│   │   ├── @extended
│   │   ├── cards
│   │   ├── customization
│   │   ├── logo
│   │   ├── ...
│   ├── contexts           -> State context for Login and other
│   ├── data               -> Static data
│   ├── hooks              -> Custom hooks
│   ├── layout
│   │   ├── ComponentLayout     -> Layout for components showcase
│   │   ├── DashboardLayout     -> Layout for Dashboard
│   │   ├── SimpleLayout        -> Layout for simple   
│   ├── menu-items              -> menu items for each main menu
│   │   ├── application.js
│   │   ├── dashboard.js
│   │   ├── ...
│   ├── sections           -> This contains different sections used only for pages
│   ├── 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              -> list of Next.js files and directory
│   │   ├── app
│   │   ├── dashboard
│   │   ├── ...
│   ├── config.ts          -> Template constant value and live customization
├── eslint.config.mjs
├── .prettierrc
├── tsconfig.json
├── next.config.ts
├── package-lock.json      -> Package lock file.
├── package.json           -> Package json file.
├── README.md
├── yarn.lock              -> yarn lock file.  

NEXT (JS)