# pratik0192/makextra architecture
> Architecture diagram of the GitHub repository pratik0192/makextra, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-15). It is an AI-made overview: check details against the source.
- Interactive diagram: https://gitdiagram.com/pratik0192/makextra
- Repository: https://github.com/pratik0192/makextra
## Overview
This repository implements an online retail shop with a customer storefront, an administrative console, and an Express/MongoDB backend. Customers browse products, manage a cart, and proceed through checkout and order tracking; administrators manage products, users, orders, and banners. The backend also handles accounts, addresses, reviews, and shipping/payment operations. The excerpts show storefront routing and cart/product API calls, plus order and review routing and controller behavior. Other page and controller details are represented at subsystem level where the source index identifies them; those connections are not inferred beyond documented or excerpted relationships.
Main entry points: [`backend/index.js`](https://github.com/pratik0192/makextra/blob/main/backend/index.js) (HTTP API server), [`frontend/src/App.jsx`](https://github.com/pratik0192/makextra/blob/main/frontend/src/App.jsx) (Storefront router), [`backend/controller/orderController.js`](https://github.com/pratik0192/makextra/blob/main/backend/controller/orderController.js) (Order and shipping), [`frontend/src/context/ShopContext.jsx`](https://github.com/pratik0192/makextra/blob/main/frontend/src/context/ShopContext.jsx) (Shop state and API)
## Diagram (Mermaid)
```mermaid
flowchart TD
subgraph group_storefront["Customer storefront"]
node_storefront_app["Storefront router
[App.jsx]"]
node_catalog["Product discovery
[AllProducts.jsx]"]
node_product_detail["Product details
[SingleProduct.jsx]"]
node_cart["Cart
[Cart.jsx]"]
node_checkout["Checkout
[Checkout.jsx]"]
node_orders["Order account
[Orders.jsx]"]
node_order_tracking["Order tracking
[OrderTrack.jsx]"]
node_shop_context["Shop state and API
[ShopContext.jsx]"]
end
subgraph group_admin["Admin console"]
node_admin_app["Admin router
[App.jsx]"]
node_product_admin["Product management
[AddProducts.jsx]"]
node_order_admin["Order management
[Orders.jsx]"]
node_user_admin["User management
[AllUsers.jsx]"]
node_banner_admin["Banner management
[Banners.jsx]"]
end
subgraph group_backend["Commerce backend"]
node_api_server["HTTP API server
[index.js]"]
node_product_api["Product API
[productRoutes.js]"]
node_cart_api["Cart API
[cartRoutes.js]"]
node_order_api["Order API
[orderRoutes.js]"]
node_identity_api["User API
[userRoutes.js]"]
node_address_api["Address API
[addressroutes.js]"]
node_review_api["Review API
[reviewRoutes.js]"]
node_banner_api["Banner API
[bannerRoutes.js]"]
node_product_controller["Product operations"]
node_cart_controller["Cart operations
[cartController.js]"]
node_order_controller["Order and shipping
[orderController.js]"]
node_user_controller["Account operations
[userController.js]"]
node_address_controller["Address operations"]
node_review_controller["Review operations"]
node_banner_controller["Banner operations"]
node_product_store[("Product records
[productModel.js]")]
node_order_store[("Order records
[orderModel.js]")]
node_user_store[("User records
[userModel.js]")]
end
subgraph group_integrations["External services"]
node_payment_provider["Payment provider
external service"]
node_shipping_provider["Shipping provider
external service"]
end
node_customer(("Shopper"))
node_customer -->|"uses"| node_storefront_app
node_storefront_app -->|"routes to"| node_catalog
node_storefront_app -->|"routes to"| node_product_detail
node_storefront_app -->|"routes to"| node_cart
node_storefront_app -->|"routes to"| node_checkout
node_storefront_app -->|"routes to"| node_orders
node_storefront_app -->|"routes to"| node_order_tracking
node_catalog -->|"uses state"| node_shop_context
node_checkout -->|"uses state"| node_shop_context
node_shop_context -->|"fetches products"| node_product_api
node_shop_context -->|"calls cart API"| node_cart_api
node_api_server -->|"mounts"| node_product_api
node_api_server -->|"mounts"| node_cart_api
node_api_server -->|"mounts"| node_order_api
node_api_server -->|"mounts"| node_identity_api
node_api_server -->|"mounts"| node_address_api
node_api_server -->|"mounts"| node_review_api
node_api_server -->|"mounts"| node_banner_api
node_product_api -->|"routes to"| node_product_controller
node_cart_api -->|"routes to"| node_cart_controller
node_order_api -->|"routes to"| node_order_controller
node_identity_api -->|"routes to"| node_user_controller
node_address_api -->|"routes to"| node_address_controller
node_review_api -->|"routes to"| node_review_controller
node_banner_api -->|"routes to"| node_banner_controller
node_product_controller -->|"reads and writes"| node_product_store
node_order_controller -->|"reads and writes"| node_order_store
node_order_controller -->|"updates cart"| node_user_store
node_user_controller -->|"reads and writes"| node_user_store
node_user_controller -->|"reads orders"| node_order_store
node_review_controller -->|"checks product"| node_product_store
node_review_controller -->|"uses review model"| node_review_api
node_order_controller -.->|"creates payment"| node_payment_provider
node_order_controller -->|"dispatches shipments"| node_shipping_provider
click node_storefront_app "https://github.com/pratik0192/makextra/blob/main/frontend/src/App.jsx"
click node_catalog "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/AllProducts.jsx"
click node_product_detail "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/SingleProduct.jsx"
click node_cart "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Cart.jsx"
click node_checkout "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Checkout.jsx"
click node_orders "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Orders.jsx"
click node_order_tracking "https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/OrderTrack.jsx"
click node_shop_context "https://github.com/pratik0192/makextra/blob/main/frontend/src/context/ShopContext.jsx"
click node_admin_app "https://github.com/pratik0192/makextra/blob/main/admin/src/App.jsx"
click node_product_admin "https://github.com/pratik0192/makextra/blob/main/admin/src/pages/AddProducts.jsx"
click node_order_admin "https://github.com/pratik0192/makextra/blob/main/admin/src/pages/Orders.jsx"
click node_user_admin "https://github.com/pratik0192/makextra/blob/main/admin/src/pages/AllUsers.jsx"
click node_banner_admin "https://github.com/pratik0192/makextra/blob/main/admin/src/pages/Banners.jsx"
click node_api_server "https://github.com/pratik0192/makextra/blob/main/backend/index.js"
click node_product_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/productRoutes.js"
click node_cart_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/cartRoutes.js"
click node_order_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/orderRoutes.js"
click node_identity_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/userRoutes.js"
click node_address_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/addressroutes.js"
click node_review_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/reviewRoutes.js"
click node_banner_api "https://github.com/pratik0192/makextra/blob/main/backend/routes/bannerRoutes.js"
click node_product_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/productController.js"
click node_cart_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/cartController.js"
click node_order_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/orderController.js"
click node_user_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/userController.js"
click node_address_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/adressController.js"
click node_review_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/reviewController.js"
click node_banner_controller "https://github.com/pratik0192/makextra/blob/main/backend/controller/bannerController.js"
click node_product_store "https://github.com/pratik0192/makextra/blob/main/backend/models/productModel.js"
click node_order_store "https://github.com/pratik0192/makextra/blob/main/backend/models/orderModel.js"
click node_user_store "https://github.com/pratik0192/makextra/blob/main/backend/models/userModel.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_app,node_catalog,node_product_detail,node_cart,node_checkout,node_orders,node_order_tracking,node_shop_context toneBlue
class node_admin_app,node_product_admin,node_order_admin,node_user_admin,node_banner_admin toneAmber
class node_api_server,node_product_api,node_cart_api,node_order_api,node_identity_api,node_address_api,node_review_api,node_banner_api,node_product_controller,node_cart_controller,node_order_controller,node_user_controller,node_address_controller,node_review_controller,node_banner_controller,node_product_store,node_order_store,node_user_store toneMint
class node_payment_provider,node_shipping_provider toneRose
class node_customer toneIndigo
```
## Components
### Customer storefront
- [Storefront router](https://github.com/pratik0192/makextra/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Product discovery](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/AllProducts.jsx): `frontend/src/pages/AllProducts.jsx`
- [Product details](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/SingleProduct.jsx): `frontend/src/pages/SingleProduct.jsx`
- [Cart](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Cart.jsx): `frontend/src/pages/Cart.jsx`
- [Checkout](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Checkout.jsx): `frontend/src/pages/Checkout.jsx`
- [Order account](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/Orders.jsx): `frontend/src/pages/Orders.jsx`
- [Order tracking](https://github.com/pratik0192/makextra/blob/main/frontend/src/pages/OrderTrack.jsx): `frontend/src/pages/OrderTrack.jsx`
- [Shop state and API](https://github.com/pratik0192/makextra/blob/main/frontend/src/context/ShopContext.jsx): `frontend/src/context/ShopContext.jsx`
### Admin console
- [Admin router](https://github.com/pratik0192/makextra/blob/main/admin/src/App.jsx): `admin/src/App.jsx`
- [Product management](https://github.com/pratik0192/makextra/blob/main/admin/src/pages/AddProducts.jsx): `admin/src/pages/AddProducts.jsx`
- [Order management](https://github.com/pratik0192/makextra/blob/main/admin/src/pages/Orders.jsx): `admin/src/pages/Orders.jsx`
- [User management](https://github.com/pratik0192/makextra/blob/main/admin/src/pages/AllUsers.jsx): `admin/src/pages/AllUsers.jsx`
- [Banner management](https://github.com/pratik0192/makextra/blob/main/admin/src/pages/Banners.jsx): `admin/src/pages/Banners.jsx`
### Commerce backend
- [HTTP API server](https://github.com/pratik0192/makextra/blob/main/backend/index.js): `backend/index.js`
- [Product API](https://github.com/pratik0192/makextra/blob/main/backend/routes/productRoutes.js): `backend/routes/productRoutes.js`
- [Cart API](https://github.com/pratik0192/makextra/blob/main/backend/routes/cartRoutes.js): `backend/routes/cartRoutes.js`
- [Order API](https://github.com/pratik0192/makextra/blob/main/backend/routes/orderRoutes.js): `backend/routes/orderRoutes.js`
- [User API](https://github.com/pratik0192/makextra/blob/main/backend/routes/userRoutes.js): `backend/routes/userRoutes.js`
- [Address API](https://github.com/pratik0192/makextra/blob/main/backend/routes/addressroutes.js): `backend/routes/addressroutes.js`
- [Review API](https://github.com/pratik0192/makextra/blob/main/backend/routes/reviewRoutes.js): `backend/routes/reviewRoutes.js`
- [Banner API](https://github.com/pratik0192/makextra/blob/main/backend/routes/bannerRoutes.js): `backend/routes/bannerRoutes.js`
- [Product operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/productController.js): `backend/controller/productController.js`
- [Cart operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/cartController.js): `backend/controller/cartController.js`
- [Order and shipping](https://github.com/pratik0192/makextra/blob/main/backend/controller/orderController.js): `backend/controller/orderController.js`
- [Account operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/userController.js): `backend/controller/userController.js`
- [Address operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/adressController.js): `backend/controller/adressController.js`
- [Review operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/reviewController.js): `backend/controller/reviewController.js`
- [Banner operations](https://github.com/pratik0192/makextra/blob/main/backend/controller/bannerController.js): `backend/controller/bannerController.js`
- [Product records](https://github.com/pratik0192/makextra/blob/main/backend/models/productModel.js): `backend/models/productModel.js`
- [Order records](https://github.com/pratik0192/makextra/blob/main/backend/models/orderModel.js): `backend/models/orderModel.js`
- [User records](https://github.com/pratik0192/makextra/blob/main/backend/models/userModel.js): `backend/models/userModel.js`
### External services
- **Payment provider**: external service
- **Shipping provider**: external service
### Other components
- **Shopper**
## Connections
- Shopper → Storefront router: uses (evidence: `frontend/src/App.jsx`)
- Storefront router → Product discovery: routes to (evidence: `frontend/src/App.jsx`)
- Storefront router → Product details: routes to (evidence: `frontend/src/App.jsx`)
- Storefront router → Cart: routes to (evidence: `frontend/src/App.jsx`)
- Storefront router → Checkout: routes to (evidence: `frontend/src/App.jsx`)
- Storefront router → Order account: routes to (evidence: `frontend/src/App.jsx`)
- Storefront router → Order tracking: routes to (evidence: `frontend/src/App.jsx`)
- Product discovery → Shop state and API: uses state (evidence: `frontend/src/pages/AllProducts.jsx`)
- Checkout → Shop state and API: uses state (evidence: `frontend/src/pages/Checkout.jsx`)
- Shop state and API → Product API: fetches products (evidence: `frontend/src/context/ShopContext.jsx`)
- Shop state and API → Cart API: calls cart API (evidence: `frontend/src/context/ShopContext.jsx`)
- HTTP API server → Product API: mounts (evidence: `backend/index.js`)
- HTTP API server → Cart API: mounts (evidence: `backend/index.js`)
- HTTP API server → Order API: mounts (evidence: `backend/index.js`)
- HTTP API server → User API: mounts (evidence: `backend/index.js`)
- HTTP API server → Address API: mounts (evidence: `backend/index.js`)
- HTTP API server → Review API: mounts (evidence: `backend/index.js`)
- HTTP API server → Banner API: mounts (evidence: `backend/index.js`)
- Product API → Product operations: routes to (evidence: `backend/routes/productRoutes.js`)
- Cart API → Cart operations: routes to (evidence: `backend/routes/cartRoutes.js`)
- Order API → Order and shipping: routes to (evidence: `backend/routes/orderRoutes.js`)
- User API → Account operations: routes to (evidence: `backend/routes/userRoutes.js`)
- Address API → Address operations: routes to (evidence: `backend/routes/addressroutes.js`)
- Review API → Review operations: routes to (evidence: `backend/routes/reviewRoutes.js`)
- Banner API → Banner operations: routes to (evidence: `backend/routes/bannerRoutes.js`)
- Product operations → Product records: reads and writes (evidence: `backend/controller/productController.js`)
- Order and shipping → Order records: reads and writes (evidence: `backend/controller/orderController.js`)
- Order and shipping → User records: updates cart (evidence: `backend/controller/orderController.js`)
- Account operations → User records: reads and writes (evidence: `backend/controller/userController.js`)
- Account operations → Order records: reads orders (evidence: `backend/controller/userController.js`)
- Review operations → Product records: checks product (evidence: `backend/controller/reviewController.js`)
- Review operations → Review API: uses review model (evidence: `backend/controller/reviewController.js`)
- Order and shipping → Payment provider: creates payment · Inferred; not shown in the code that was read.
- Order and shipping → Shipping provider: dispatches shipments (evidence: `backend/controller/orderController.js`)