# mohimas/zeynova architecture

> Architecture diagram of the GitHub repository mohimas/zeynova, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-08-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/mohimas/zeynova
- Repository: https://github.com/mohimas/zeynova

## Overview

#### Purpose and Deployable Units
This is a three-part e-commerce system: a customer storefront, an administrative console, and a Node.js API. The Vite React clients bootstrap at `frontend/src/main.jsx` and `admin/src/main.jsx`; the backend process starts at `backend/server.js`. Each deployable includes Vercel configuration (`frontend/vercel.json`, `admin/vercel.json`, `backend/vercel.json`).

#### Customer Storefront
The customer-facing React application routes through `frontend/src/App.jsx` and composes shopping, account, and support flows. Core commerce pages include product browsing/details (`frontend/src/pages/Collection.jsx`, `frontend/src/pages/Product.jsx`), cart and checkout (`frontend/src/pages/Cart.jsx`, `frontend/src/pages/PlaceOrder.jsx`), and order/account views (`frontend/src/pages/Orders.jsx`, `frontend/src/pages/Profile.jsx`). Reusable catalogue and recommendation presentation is concentrated in `frontend/src/components/Productitem.jsx`, `frontend/src/components/RelatedProducts.jsx`, and `frontend/src/components/PersonalizedRecommendations.jsx`.

#### Client State and Purchase Flow
`frontend/src/context/ShopContext.jsx` is the principal storefront state boundary, likely coordinating shared catalogue, cart, authentication, and API-facing state for pages/components. The primary customer flow is browse collection → inspect product → update cart → place/verify order, represented by `frontend/src/pages/Collection.jsx`, `frontend/src/pages/Cart.jsx`, and `frontend/src/pages/Verify.jsx`. Authentication and customer self-service are exposed through `frontend/src/pages/Login.jsx`, `frontend/src/pages/UserDashboard.jsx`, and `frontend/src/pages/Wishlist.jsx`.

#### API and Domain Layer
The Express backend separates HTTP routing, controller logic, and MongoDB persistence. Routes define the public/API boundary in `backend/routes/productRoute.js`, `backend/routes/orderRoute.js`, and `backend/routes/userRoute.js`; corresponding controllers implement product, order, cart, dashboard, and user operations in `backend/controllers/productController.js`, `backend/controllers/orderController.js`, and `backend/controllers/cartController.js`. Persistent domain records are modeled in `backend/models/productModel.js`, `backend/models/orderModel.js`, and `backend/models/userModel.js`, with dedicated inquiry and review records.

#### Identity, Roles, and Protected Operations
Authentication and authorization are middleware gates between API routes and controllers: `backend/middleware/auth.js` protects authenticated customer operations, while `backend/middleware/adminAuth.js` and `backend/middleware/roleAuth.js` distinguish administrative or role-restricted actions. This boundary supports separate customer and staff clients rather than embedding administrative capabilities in the storefront.

#### Administration and Operations
The admin React app is centered on operational management pages: `admin/src/pages/Dashboard.jsx`, `admin/src/pages/List.jsx`, and `admin/src/pages/Orders.jsx`, plus product creation/editing in `admin/src/pages/Add.jsx` and `admin/src/pages/Edit.jsx`. Its shell and login boundary are implemented by `admin/src/App.jsx`, `admin/src/components/Sidebar.jsx`, and `admin/src/components/Login.jsx`. Backend dashboard endpoints/controllers (`backend/routes/dashboardRoute.js`, `backend/controllers/dashboardController.js`) support administrative summary data.

#### Infrastructure and External Services
MongoDB is the primary persistence runtime, configured through `backend/config/mongodb.js`. Cloudinary is the media-storage integration, configured in `backend/config/cloudinary.js`; multipart upload handling is isolated in `backend/middleware/multer.js`, forming the upload boundary before product/media controller handling. The applications use JavaScript/React Vite clients and a Node.js backend, with Vercel deployment descriptors for all three units.

Main entry points: [`backend/controllers/orderController.js`](https://github.com/mohimas/zeynova/blob/main/backend/controllers/orderController.js) (Commerce Controllers), [`frontend/src/App.jsx`](https://github.com/mohimas/zeynova/blob/main/frontend/src/App.jsx) (Storefront Routes), [`backend/routes/productRoute.js`](https://github.com/mohimas/zeynova/blob/main/backend/routes/productRoute.js) (Product, Order & User Routes), [`backend/routes/dashboardRoute.js`](https://github.com/mohimas/zeynova/blob/main/backend/routes/dashboardRoute.js) (Dashboard Routes)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_storefront["Customer Storefront"]
  node_storefront_bootstrap["Storefront Bootstrap<br/>Vite React entry<br/>[main.jsx]"]
  node_storefront_router["Storefront Routes<br/>React app shell<br/>[App.jsx]"]
  node_shop_context["Shop State<br/>React context<br/>[ShopContext.jsx]"]
  node_catalog_pages["Browse &amp; Product Views<br/>commerce pages<br/>[Collection.jsx]"]
  node_cart_checkout["Cart &amp; Checkout<br/>purchase pages<br/>[Cart.jsx]"]
  node_order_verification["Order Verification<br/>purchase page<br/>[Verify.jsx]"]
  node_account_pages["Account &amp; Self-Service<br/>customer pages<br/>[UserDashboard.jsx]"]
  node_recommendations["Product Recommendations<br/>React components"]
end

subgraph group_admin["Admin Console"]
  node_admin_bootstrap["Admin Bootstrap<br/>Vite React entry<br/>[main.jsx]"]
  node_admin_shell["Admin Shell &amp; Login<br/>React app shell<br/>[App.jsx]"]
  node_admin_operations["Operations Management<br/>admin pages<br/>[Dashboard.jsx]"]
end

subgraph group_api["Node.js API"]
  node_api_server{{"Express Server<br/>Node.js process<br/>[server.js]"}}
  node_api_routes["Product, Order &amp; User Routes<br/>HTTP route boundary<br/>[productRoute.js]"]
  node_dashboard_routes["Dashboard Routes<br/>admin HTTP routes<br/>[dashboardRoute.js]"]
  node_auth_gates["Auth &amp; Role Gates<br/>Express middleware<br/>[auth.js]"]
  node_domain_controllers["Commerce Controllers<br/>domain operations<br/>[orderController.js]"]
  node_upload_boundary["Multipart Uploads<br/>upload middleware<br/>[multer.js]"]
  node_domain_models["Commerce Records<br/>MongoDB models<br/>[productModel.js]"]
end

subgraph group_services["Data &amp; Media Services"]
  node_mongodb[("MongoDB<br/>database<br/>[mongodb.js]")]
  node_cloudinary(("Cloudinary<br/>media storage<br/>[cloudinary.js]"))
end

node_storefront_bootstrap -->|"mounts"| node_storefront_router
node_storefront_router -->|"uses shared state"| node_shop_context
node_storefront_router -->|"routes to"| node_catalog_pages
node_storefront_router -->|"routes to"| node_cart_checkout
node_storefront_router -->|"routes to"| node_account_pages
node_catalog_pages -->|"renders"| node_recommendations
node_catalog_pages -->|"adds items"| node_cart_checkout
node_cart_checkout -->|"places and verifies order"| node_order_verification
node_shop_context -->|"API requests"| node_api_routes
node_admin_bootstrap -->|"mounts"| node_admin_shell
node_admin_shell -->|"routes to"| node_admin_operations
node_admin_operations -->|"admin API requests"| node_dashboard_routes
node_admin_operations -->|"catalog and order requests"| node_api_routes
node_api_server -->|"serves"| node_api_routes
node_api_server -->|"serves"| node_dashboard_routes
node_api_routes -->|"protects operations"| node_auth_gates
node_dashboard_routes -->|"admin protection"| node_auth_gates
node_auth_gates -->|"authorizes"| node_domain_controllers
node_api_routes -->|"dispatches"| node_domain_controllers
node_dashboard_routes -->|"dispatches"| node_domain_controllers
node_upload_boundary -->|"provides uploaded media"| node_domain_controllers
node_domain_controllers -->|"reads and writes"| node_domain_models
node_domain_models -->|"persists in"| node_mongodb
node_domain_controllers -->|"stores media"| node_cloudinary

click node_storefront_bootstrap "https://github.com/mohimas/zeynova/blob/main/frontend/src/main.jsx"
click node_storefront_router "https://github.com/mohimas/zeynova/blob/main/frontend/src/App.jsx"
click node_shop_context "https://github.com/mohimas/zeynova/blob/main/frontend/src/context/ShopContext.jsx"
click node_catalog_pages "https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Collection.jsx"
click node_cart_checkout "https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Cart.jsx"
click node_order_verification "https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Verify.jsx"
click node_account_pages "https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/UserDashboard.jsx"
click node_recommendations "https://github.com/mohimas/zeynova/blob/main/frontend/src/components/PersonalizedRecommendations.jsx"
click node_admin_bootstrap "https://github.com/mohimas/zeynova/blob/main/admin/src/main.jsx"
click node_admin_shell "https://github.com/mohimas/zeynova/blob/main/admin/src/App.jsx"
click node_admin_operations "https://github.com/mohimas/zeynova/blob/main/admin/src/pages/Dashboard.jsx"
click node_api_server "https://github.com/mohimas/zeynova/blob/main/backend/server.js"
click node_api_routes "https://github.com/mohimas/zeynova/blob/main/backend/routes/productRoute.js"
click node_dashboard_routes "https://github.com/mohimas/zeynova/blob/main/backend/routes/dashboardRoute.js"
click node_auth_gates "https://github.com/mohimas/zeynova/blob/main/backend/middleware/auth.js"
click node_domain_controllers "https://github.com/mohimas/zeynova/blob/main/backend/controllers/orderController.js"
click node_upload_boundary "https://github.com/mohimas/zeynova/blob/main/backend/middleware/multer.js"
click node_domain_models "https://github.com/mohimas/zeynova/blob/main/backend/models/productModel.js"
click node_mongodb "https://github.com/mohimas/zeynova/blob/main/backend/config/mongodb.js"
click node_cloudinary "https://github.com/mohimas/zeynova/blob/main/backend/config/cloudinary.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_storefront_bootstrap,node_storefront_router,node_shop_context,node_catalog_pages,node_cart_checkout,node_order_verification,node_account_pages,node_recommendations toneBlue
class node_admin_bootstrap,node_admin_shell,node_admin_operations toneAmber
class node_api_server,node_api_routes,node_dashboard_routes,node_auth_gates,node_domain_controllers,node_upload_boundary,node_domain_models toneMint
class node_mongodb,node_cloudinary toneRose
```

## Components

### Customer Storefront

Vite React shopping client.

- [Storefront Bootstrap](https://github.com/mohimas/zeynova/blob/main/frontend/src/main.jsx): Vite React entry · `frontend/src/main.jsx`
- [Storefront Routes](https://github.com/mohimas/zeynova/blob/main/frontend/src/App.jsx): React app shell · `frontend/src/App.jsx`
- [Shop State](https://github.com/mohimas/zeynova/blob/main/frontend/src/context/ShopContext.jsx): React context · Shared catalogue, cart, authentication, and API-facing state. · `frontend/src/context/ShopContext.jsx`
- [Browse & Product Views](https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Collection.jsx): commerce pages · `frontend/src/pages/Collection.jsx`
- [Cart & Checkout](https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Cart.jsx): purchase pages · `frontend/src/pages/Cart.jsx`
- [Order Verification](https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/Verify.jsx): purchase page · `frontend/src/pages/Verify.jsx`
- [Account & Self-Service](https://github.com/mohimas/zeynova/blob/main/frontend/src/pages/UserDashboard.jsx): customer pages · `frontend/src/pages/UserDashboard.jsx`
- [Product Recommendations](https://github.com/mohimas/zeynova/blob/main/frontend/src/components/PersonalizedRecommendations.jsx): React components · `frontend/src/components/PersonalizedRecommendations.jsx`

### Admin Console

Vite React operations client.

- [Admin Bootstrap](https://github.com/mohimas/zeynova/blob/main/admin/src/main.jsx): Vite React entry · `admin/src/main.jsx`
- [Admin Shell & Login](https://github.com/mohimas/zeynova/blob/main/admin/src/App.jsx): React app shell · `admin/src/App.jsx`
- [Operations Management](https://github.com/mohimas/zeynova/blob/main/admin/src/pages/Dashboard.jsx): admin pages · Dashboard, product management, and order operations. · `admin/src/pages/Dashboard.jsx`

### Node.js API

Express domain and HTTP boundary.

- [Express Server](https://github.com/mohimas/zeynova/blob/main/backend/server.js): Node.js process · `backend/server.js`
- [Product, Order & User Routes](https://github.com/mohimas/zeynova/blob/main/backend/routes/productRoute.js): HTTP route boundary · `backend/routes/productRoute.js`
- [Dashboard Routes](https://github.com/mohimas/zeynova/blob/main/backend/routes/dashboardRoute.js): admin HTTP routes · `backend/routes/dashboardRoute.js`
- [Auth & Role Gates](https://github.com/mohimas/zeynova/blob/main/backend/middleware/auth.js): Express middleware · Customer, admin, and role-restricted operation guards. · `backend/middleware/auth.js`
- [Commerce Controllers](https://github.com/mohimas/zeynova/blob/main/backend/controllers/orderController.js): domain operations · Product, order, cart, user, and dashboard operations. · `backend/controllers/orderController.js`
- [Multipart Uploads](https://github.com/mohimas/zeynova/blob/main/backend/middleware/multer.js): upload middleware · `backend/middleware/multer.js`
- [Commerce Records](https://github.com/mohimas/zeynova/blob/main/backend/models/productModel.js): MongoDB models · Product, order, user, inquiry, and review records. · `backend/models/productModel.js`

### Data & Media Services

- [MongoDB](https://github.com/mohimas/zeynova/blob/main/backend/config/mongodb.js): database · Primary persistence runtime. · `backend/config/mongodb.js`
- [Cloudinary](https://github.com/mohimas/zeynova/blob/main/backend/config/cloudinary.js): media storage · `backend/config/cloudinary.js`

## Connections

- Storefront Bootstrap → Storefront Routes: mounts
- Storefront Routes → Shop State: uses shared state
- Storefront Routes → Browse & Product Views: routes to
- Storefront Routes → Cart & Checkout: routes to
- Storefront Routes → Account & Self-Service: routes to
- Browse & Product Views → Product Recommendations: renders
- Browse & Product Views → Cart & Checkout: adds items
- Cart & Checkout → Order Verification: places and verifies order
- Shop State → Product, Order & User Routes: API requests
- Admin Bootstrap → Admin Shell & Login: mounts
- Admin Shell & Login → Operations Management: routes to
- Operations Management → Dashboard Routes: admin API requests
- Operations Management → Product, Order & User Routes: catalog and order requests
- Express Server → Product, Order & User Routes: serves
- Express Server → Dashboard Routes: serves
- Product, Order & User Routes → Auth & Role Gates: protects operations
- Dashboard Routes → Auth & Role Gates: admin protection
- Auth & Role Gates → Commerce Controllers: authorizes
- Product, Order & User Routes → Commerce Controllers: dispatches
- Dashboard Routes → Commerce Controllers: dispatches
- Multipart Uploads → Commerce Controllers: provides uploaded media
- Commerce Controllers → Commerce Records: reads and writes
- Commerce Records → MongoDB: persists in
- Commerce Controllers → Cloudinary: stores media