How sainath9391/ecommerce-dashboard works
E-Commerce Analytics is a MERN dashboard for sales KPIs, customer demographics, product rankings, data entry, and CSV reports. Users view analytics or enter product, customer, and order records; the React app fetches analytics through its API client, while Express routes compute MongoDB aggregations and persist records through Mongoose models. The dashboard presents those results as cards, charts, and a table; reports reuse fetched results for display and CSV downloads. The README documents the API-to-database architecture and report capabilities; unsampled integration details are not inferred.
Main entry points: App.js App coordinator · analytics.js Analytics routes · data.js Data routes · api.js API client
Components 17
React dashboard
- App coordinator
frontend/src/App.js - API client
frontend/src/services/api.js - Page navigation
frontend/src/components/Navbar.jsx - Data entry forms
frontend/src/components/DataEntryPage.jsx - KPI cards
frontend/src/components/SummaryCards.jsx - Monthly sales chart
frontend/src/components/MonthlySalesChart.jsx - Demographics chart
frontend/src/components/DemographicsChart.jsx - Top products table
frontend/src/components/TopProductsTable.jsx - Reports and CSV
frontend/src/components/ReportsPage.jsx
Express API
- Express server
backend/server.js - Data routes
backend/routes/data.js - Analytics routes
backend/routes/analytics.js
Analytics and persistence
- Order model
backend/models/Order.js - Product model
backend/models/Product.js - Customer model
backend/models/Customer.js - MongoDB
Other components
- Dashboard user
Connections 23
- Dashboard user → App coordinator: uses
README.md - App coordinator → Page navigation: renders
frontend/src/App.js - App coordinator → Data entry forms: renders
frontend/src/App.js - App coordinator → KPI cards: renders
frontend/src/App.js - App coordinator → Monthly sales chart: renders
frontend/src/App.js - App coordinator → Demographics chart: renders
frontend/src/App.js - App coordinator → Top products table: renders
frontend/src/App.js - App coordinator → Reports and CSV: renders
frontend/src/App.js - App coordinator → API client: fetches via
frontend/src/App.js - Data entry forms → API client: submits through
frontend/src/components/DataEntryPage.jsx - Reports and CSV → App coordinator: requests refresh
frontend/src/App.js - API client → Analytics routes: requests analytics
README.md - API client → Data routes: requests records
README.md - Express server → Analytics routes: mounts
backend/server.js - Express server → Data routes: mounts
backend/server.js - Express server → MongoDB: connects
backend/server.js - Data routes → Product model: queries and writes
backend/routes/data.js - Data routes → Customer model: queries and writes
backend/routes/data.js - Data routes → Order model: queries and writes
backend/routes/data.js - Analytics routes → Order model: aggregates
backend/routes/analytics.js - Analytics routes → Customer model: aggregates
backend/routes/analytics.js - Analytics routes → Product model: looks up
backend/routes/analytics.js - Analytics routes → MongoDB: runs aggregations on
README.md