How fauziiifau/qc-frontend works
This is a QC monitoring frontend for factory production, defect, and customer-complaint data. Users sign in, then use protected screens to enter records, maintain master data, and review dashboards or reports. The sampled production screen loads parts and machines before saving a batch; the dashboard requests production, defect, complaint, and insight data. Other page-to-service wiring is not shown in the excerpts, so those connections are omitted. The README is only the default Vite template and documents no additional product capabilities.
Main entry points: App.jsx App Routes · Layout.jsx App Shell · InputProduction.jsx Production Entry · Dashboard.jsx Dashboard
Components 22
Access and Shell
- App Routes
src/App.jsx - Login
src/pages/Login.jsx - Register
src/pages/Register.jsx - Route Guard
src/components/ProtectedRoute.jsx - App Shell
src/components/Layout.jsx - Profile
src/pages/Profile.jsx - Theme State
src/context/ThemeContext.jsx
Quality Operations
- Defect Entry
src/pages/InputDefect.jsx - Production Entry
src/pages/InputProduction.jsx - Complaint Entry
src/pages/InputComplaint.jsx - Master Data
src/pages/MasterData.jsx
Frontend Services
- Authentication
src/services/authService.js - Master Data API
src/services/masterDataService.js - Production API
src/services/productionService.js - Defect API
src/services/ngDataService.js - Complaint API
src/services/complaintService.js - Dashboard API
src/services/dashboardService.js - Report API
src/services/reportService.js
Other components
- User
- QC Backend
Connections 19
- User → App Routes: opens
- App Routes → Login: routes
- App Routes → Register: routes
- App Routes → Route Guard: guards
- Route Guard → App Shell: renders
- App Shell → Profile: navigates
- App Shell → Theme State: uses
- Production Entry → Master Data API: loads parts and machines
- Production Entry → Production API: saves batch
- Complaint API → Defect API: uploads photo
- Dashboard → Dashboard API: loads summaries
- Dashboard → QC Backend: requests insights
- Authentication → QC Backend: authenticates
- Master Data API → QC Backend: reads and writes
- Production API → QC Backend: saves production
- Defect API → QC Backend: uploads and saves defects
- Complaint API → QC Backend: saves complaints
- Dashboard API → QC Backend: fetches analytics
- Report API → QC Backend: requests reports