How bell914/jsd13-group3-hydraranger works
OCCASION is a unisex fashion e-commerce product with separate customer and admin React applications backed by an Express/MongoDB API. The customer workflow runs from browsing products and lookbooks through cart, demo payment, order history, and profile; Mix & Match adds image-based outfit recommendations. Admin users manage catalog, orders, customers, content, coupons, and dashboard data. The graph preserves these documented capabilities; detailed wiring beyond the sampled routes, recommendation controller, and auth service is kept conservative.
Main entry points: AppRoutes.jsx Store routes · services/index.js Customer API clients · authService.js Authentication service · models/index.js Domain models
Components 25
Customer storefront
- Customer app
client/src/App.jsx - Store routes
client/src/routes/AppRoutes.jsx - Product browsing
client/src/pages/ProductListPage.jsx - Lookbooks
client/src/pages/LookbookListPage.jsx - Mix & Match
client/src/pages/MixAndMatchPage.jsx - Cart and checkout
client/src/pages/CheckoutPage.jsx - Profile and orders
client/src/pages/ProfilePage.jsx - Customer API clients
client/src/services/index.js
Admin operations
- Admin routes
admin-client/src/routes/AdminRoutes.jsx - Admin management
admin-client/src/pages/AdminProductsPage.jsx - Admin API clients
admin-client/src/services/adminApi.js
API and domain
- Express API
server/src/app.js - API routes
server/src/routes/index.js - Auth endpoints
server/src/routes/authRoutes.js - Auth controller
server/src/controllers/authController.js - Recommendation handler
server/src/controllers/recommendController.js - Commerce services
server/src/services/orderService.js - Catalog and content
server/src/services/lookbookService.js - Authentication service
server/src/services/authService.js
Persistence and integrations
- MongoDB
server/src/config/db.js - Domain models
server/src/models/index.js - Gemini AI
- SMTP email
Other components
- Shopper
- Admin
Connections 28
- Shopper → Customer app: uses
- Customer app → Store routes: renders routes
- Store routes → Product browsing: routes to
- Store routes → Lookbooks: routes to
- Store routes → Mix & Match: routes to
- Store routes → Cart and checkout: routes to
- Store routes → Profile and orders: routes to
- Product browsing → Customer API clients: requests data
- Lookbooks → Customer API clients: requests data
- Mix & Match → Customer API clients: uploads image
- Cart and checkout → Customer API clients: requests checkout
- Profile and orders → Customer API clients: requests account
- Customer API clients → Express API: calls API
- Admin → Admin routes: uses
- Admin routes → Admin management: routes to
- Admin management → Admin API clients: requests management
- Admin API clients → Express API: calls API
- Express API → API routes: mounts routes
- API routes → Auth endpoints: dispatches auth
- Auth endpoints → Auth controller: dispatches
- Recommendation handler → Catalog and content: reads public looks
- Recommendation handler → Gemini AI: analyzes and ranks
- Authentication service → Authentication service: registers users
- Authentication service → SMTP email: sends messages
- Commerce services → Domain models: uses domain data
- Catalog and content → Domain models: uses content data
- Authentication service → Domain models: reads and writes users
- Domain models → MongoDB: persists data