How faixanpervaix/react-ecommerce works
This MERN storefront supports browsing a product list, viewing product details, and adding an in-stock quantity to a cart. The frontend routes screens and uses Redux actions/reducers for product and cart state; the backend exposes product-list and product-detail reads backed by MongoDB. The README provides no capability details, and several source files were not sampled, so uncertain cart persistence and other backend operations are not shown as connected flows.
Main entry points: App.js App Router · productActions.js Product Actions · server.js Express Server · store.js Redux Store
Components 22
Storefront UI
- App Router
frontend/src/App.js - Navigation
frontend/src/components/Header.js - Product List
frontend/src/screens/HomeScreen.js - Product Detail
frontend/src/screens/ProductScreen.js - Cart Screen
frontend/src/screens/CartScreen.js
Client State
- Product Actions
frontend/src/actions/productActions.js - Cart Actions
frontend/src/actions/cartActions.js - Product State
frontend/src/reducers/productReducers.js - Cart State
frontend/src/reducers/cartReducers.js - Redux Store
frontend/src/store.js - API Endpoints
frontend/src/cofig/endpoints.js
Product API
- Express Server
backend/server.js - Product Routes
backend/routes/productRoutes.js - Error Handling
backend/middleware/errorMiddleware.js
Product Data
- Product Model
backend/models/productModel.js - Order Model
backend/models/orderModel.js - User Model
backend/models/userModel.js - Reviews Model
backend/models/reviewsModel.js - Database Setup
backend/config/db.js
Other components
- Shopper
- MongoDB
- Browser
Connections 22
- Shopper → Browser: uses
- Browser → App Router: loads
- App Router → Navigation: renders
- App Router → Product List: routes
- App Router → Product Detail: routes
- App Router → Cart Screen: routes
- Product Detail → Product Actions: dispatches
- Product Actions → Product State: updates
- Cart Screen → Cart Actions: dispatches
- Cart Actions → Cart State: updates
- Redux Store → Product State: combines
- Redux Store → Cart State: combines
- Product Actions → API Endpoints: uses
- Product Actions → Express Server: requests
- Express Server → Product Routes: mounts
- Express Server → Error Handling: handles errors
- Product Routes → Product Model: queries
- Database Setup → MongoDB: connects
- Product Model → MongoDB: persists
- User Model → MongoDB: persists
- Order Model → MongoDB: persists
- Reviews Model → MongoDB: persists