Structure

• Introduction
• Assets Directory
• Frontend Directory
  • Assets Directory
  • Src Directory
    • Components Directory
    • Locales Directory
    • Store Directory
    • Utilities Directory
  • Dist Directory
• Inc Directory
• Templates Directory

Introduction

This structure supports a clear separation of concerns, modular development, and ease of maintenance, enhancing both development efficiency and the scalability of the plugin.

├── assets (directory)
├── frontend (directory)
|   ├── assets (directory)
|   ├── src (directory)
|   |   ├── components (directory)
|   |   |   ├── admin (directory)
|   |   |   ├── affiliate (directory)
|   |   |   ├── application (directory)
|   |   |   ├── applyForms (directory)
|   |   |   |   ├── partials (directory)
|   |   |   |   └── stepper (directory)
|   |   |   ├── charts/affiliate (directory)
|   |   |   ├── checker (directory)
|   |   |   ├── programs (directory)
|   |   |   ├── quickFilters (directory)
|   |   |   ├── site (directory)
|   |   |   └── ui (directory)
|   |   ├── locales (directory)
|   |   ├── store (directory)
|   |   └── utilities (directory)
|   ├── dist (directory)
|   ├── index.js
|   └── package.json
├── inc (directory)
|   ├── Api (directory)
|   ├── Base (directory)
|   ├── Database (directory)
|   ├── Pages (directory)
|   └── Rest (directory)
└── templates (directory)
    ├── applications (directory)
    └── programs (directory)

Assets Directory

The assets directory houses global static files such as CSS stylesheets for the plugin. Previously, it also included JavaScript files, but this practice is now deprecated, and the directory exclusively contains CSS files.

Frontend Directory

The frontend directory is focused on the frontend aspect of the plugin, containing essential files like index.js and package.json used for building the dist folder to generate production-ready assets. It includes the following directories:

Assets Directory

The frontend/assets directory is designated for global static files specific to the frontend of the plugin, including images. Additionally, it stores the JavaScript files that were previously deprecated in the root assets directory, centralizing frontend-specific resources such as images and JavaScript into one location.

Src Directory

The frontend/src directory is the core of the frontend development, containing the source code for various frontend components. This organization facilitates a modular and maintainable codebase. Within this directory, you can expect to find:

Components Directory

The frontend/src/components directory organizes modular Vue.js components by their specific functionality within the plugin, ensuring a structured and efficient development process. Each subdirectory under this path is dedicated to a distinct aspect of the plugin, such as administration panels, affiliate interfaces, application procedures, and various forms and UI elements. This categorization allows for easy navigation, maintenance, and scalability of the codebase, as components are grouped logically according to their use cases within the plugin.

Locales Directory

The frontend/src/locales directory holds translation files in JSON format, such as ar.json, en.json, tr.json, enabling plugin internationalization.

Store Directory

The frontend/src/store directory includes files for state management, typically used with Vuex.

Utilities Directory

The frontend/src/utilities directory houses reusable utility functions and helpers.

Dist Directory

The frontend/dist directory holds compiled and minified frontend assets prepared for production.

Inc Directory

The inc directory contains backend PHP classes and functions, structured into:

• Api: Manages API endpoints.
• Base: Core functionality and base classes.
• Database: Database operations and migrations.
• Pages: Page-specific logic and rendering.
• Rest: RESTful services and endpoints.

Templates Directory

The templates directory holds PHP or HTML templates for displaying applications and programs on the frontend.