Able Pro
NextJS
NextJS
  • ✨Overview
  • 🌴Pre-requisites
  • 🚀Quick Start
  • 📂Folder Structure
  • 🌀State Management
  • 🔒Authentication
  • 📡Axios API Calls
  • 🌐Internationalization
  • 🛠️Project Configuration
  • 🎨Color Presets
  • 🎭Theme/Style Configuration
  • 📚How to
    • Login as First Page
    • Dashboard as First Page
    • Remove menu render from Backend
    • Render Menu from the backend
    • Remove Auth
  • 🖌️Figma
  • 🤝Integration
    • Seed
    • Comparison
  • 📦Dependencies
  • 🗓️Roadmap
  • 🆘Support
  • 📅Changelog
Powered by GitBook
On this page

Folder Structure

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

Under theablepro-material-react/ directory, You will find the following folder structure.

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.  
able-pro-material-next-js
..
├── 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
│   ├── 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.js          -> Template constant value and live customization
├── eslint.config.mjs
├── .prettierrc
├── jsconfig.json
├── next-env.d.js
├── next.config.js
├── package-lock.json      -> Package lock file.
├── package.json           -> Package json file.
├── README.md
├── yarn.lock              -> yarn lock file.  
PreviousQuick StartNextState Management

Last updated 2 months ago

📂