How emadelnagar/mern-ts-ecommerce works
This is a MERN e-commerce application: shoppers browse and review products, manage a cart or wishlist, check out, and track orders; administrators manage catalog, users, orders, and sales analytics. The client is routed through App and communicates with the Express API; controllers implement domain operations against Mongoose models. The sampled routes and controllers establish the server wiring and order, product, and user persistence. Other major features are retained based on the README and tree, though their exact internal calls were not sampled.
Main entry points: App.tsx Application Router · API.ts HTTP Client · index.ts API Server · ProductFeatures.ts Product Actions
Components 34
Shopper and Admin UI
- Application Router
frontend/src/App.tsx - Catalog Browsing
frontend/src/pages/product/AllProducts.tsx - Product Detail
frontend/src/pages/product/SingleProduct.tsx - Cart and Wishlist
frontend/src/pages/cart/Cart.tsx - Checkout
frontend/src/pages/order/CheckOut.tsx - Order Tracking
frontend/src/pages/order/TrackOrder.tsx - Account Management
frontend/src/pages/user/ProfileSettings.tsx - Admin Dashboard
frontend/src/pages/admin/index.tsx - Category Admin
frontend/src/pages/admin/Categories.tsx - Product Admin
frontend/src/pages/admin/NewProduct.tsx - Order Admin
frontend/src/pages/admin/Orders.tsx - Sales Analytics
frontend/src/components/MainAnalysis.tsx
Client Data Access
- HTTP Client
frontend/src/API.ts - Product Actions
frontend/src/features/ProductFeatures.ts - Cart Actions
frontend/src/features/CartFeatures.ts - Order Actions
frontend/src/features/OrderFeatures.ts - User Actions
frontend/src/features/UserFeatures.ts - Category Actions
frontend/src/features/CategoryFeatures.ts - Analytics Actions
frontend/src/features/AnalysisFeatures.ts
Express API
- API Server
backend/src/index.ts - Product Routes
backend/src/routes/productRoutes.ts - Order Routes
backend/src/routes/orderRoutes.ts - User Routes
backend/src/routes/userRoutes.ts - Category Routes
backend/src/routes/categoryRoutes.ts - Analytics Routes
backend/src/routes/analysisRoutes.ts - Product Operations
backend/src/controllers/productController.ts - Order Operations
backend/src/controllers/orderControllers.ts - User Operations
backend/src/controllers/userControllers.ts - Category Operations
backend/src/controllers/categoryController.ts - Analytics Operations
backend/src/controllers/analysisController.ts
Other components
- Shopper
- Administrator
Connections 45
- Shopper → Application Router: uses
- Administrator → Application Router: uses
- Application Router → Catalog Browsing: routes to
- Application Router → Product Detail: routes to
- Application Router → Cart and Wishlist: routes to
- Application Router → Checkout: routes to
- Application Router → Order Tracking: routes to
- Application Router → Account Management: routes to
- Application Router → Admin Dashboard: routes to
- Application Router → Category Admin: routes to
- Application Router → Product Admin: routes to
- Application Router → Order Admin: routes to
- Admin Dashboard → Sales Analytics: renders
- Catalog Browsing → Product Actions: uses
- Product Detail → Product Actions: uses
- Cart and Wishlist → Cart Actions: uses
- Checkout → Order Actions: uses
- Order Tracking → Order Actions: uses
- Account Management → User Actions: uses
- Category Admin → Category Actions: uses
- Product Admin → Product Actions: uses
- Order Admin → Order Actions: uses
- Sales Analytics → Analytics Actions: uses
- Product Actions → HTTP Client: requests
- Cart Actions → HTTP Client: requests
- Order Actions → HTTP Client: requests
- User Actions → HTTP Client: requests
- Category Actions → HTTP Client: requests
- Analytics Actions → HTTP Client: requests
- HTTP Client → API Server: HTTP calls
- API Server → Product Routes: mounts
- API Server → Order Routes: mounts
- API Server → User Routes: mounts
- API Server → Category Routes: mounts
- API Server → Analytics Routes: mounts
- Product Routes → Product Operations: dispatches
- Order Routes → Order Operations: dispatches
- User Routes → User Operations: dispatches
- Category Routes → Category Operations: dispatches
- Analytics Routes → Analytics Operations: dispatches
- Product Operations → Products: reads/writes
- Order Operations → Orders: reads/writes
- Order Operations → Products: updates stock
- Analytics Operations → Orders: aggregates
- Analytics Operations → Products: aggregates