Report Waste. Coordinate Cleanup. Transform Communities.
CleanSight is a comprehensive data-driven platform empowering citizens to report garbage issues, volunteers to take action, and municipalities to efficiently manage cleanup operations.
CleanSight bridges the gap between environmental awareness and actionable community effort. By combining a modern web interface, a robust backend, and custom machine learning models, the platform streamlines the entire lifecycle of local waste management — from the moment a user snaps a photo to the final verified cleanup.
- 📸 Phase 1 AI Screening: MobileNetV2 binary classifier (TensorFlow/Keras) automatically verifies uploaded images as waste or non-waste.
- 🔬 Phase 2 Category Classification: MobileNetV3-Small classifier (PyTorch) identifies waste type — plastic, paper, glass, or mixed — for confirmed waste images.
- 📊 ML Analytics Dashboard: Comprehensive monitoring of model performance, prediction confidence, review workload, and weak class identification.
- 📍 Geolocation Tracking: Precise GPS tagging for every report so cleanup crews know exactly where to go.
- 👥 Role-Based Workflows: Distinct interfaces and permissions for Citizens, Volunteers, Staff, and Admins.
- 🔄 Admin Review Queues: Low-confidence ML predictions are flagged for human review before report acceptance.
- ⚡ Real-Time Coordination: Connects on-the-ground volunteers with reported tasks dynamically.
- 📈 Impact Analytics: Dashboards displaying environmental impact metrics and community progress.
CleanSight/
├── Frontend/ # React + TypeScript SPA (Vite)
│ ├── components/ # Reusable shadcn/ui components & layouts
│ ├── hooks/ # Custom React hooks (auth, analytics, queries)
│ ├── pages/ # Role-protected route views
│ └── lib/ # Firebase config, API clients, utilities
│
├── Backend/ # Node.js + Express REST API
│ ├── routes/ # API endpoints (auth, reports, volunteers, ML)
│ ├── models/ # Mongoose/MongoDB schemas
│ ├── middleware/ # Firebase token verification & role guards
│ └── services/ # Business logic & analytics aggregations
│
└── ML/ # Machine Learning Environment
├── service/ # Phase 1 FastAPI service (port 8000)
├── category_service/ # Phase 2 FastAPI service (port 8001)
├── dataset_binary/ # Waste vs. non-waste image dataset
├── dataset_category/ # Category dataset (plastic/paper/glass/mixed)
├── training/ # Model training pipelines
├── evaluation/ # Metric reporting (F1, confusion matrices)
├── inference/ # Standalone predict scripts
└── models/ # Trained model artifacts (git-ignored)
Frontend:
- React 18, Vite, TypeScript
- Tailwind CSS, shadcn/ui, Framer Motion
- React Router v6, Firebase Authentication
Backend:
- Node.js, Express.js
- MongoDB, Mongoose
- Firebase Admin SDK, Role-Based Access Control (RBAC)
Machine Learning:
- Phase 1: TensorFlow/Keras — MobileNetV2 binary classifier
- Phase 2: PyTorch — MobileNetV3-Small category classifier
- FastAPI for ML serving, Scikit-learn, Pillow, Matplotlib, Seaborn
- Node.js 18+ and pnpm (or npm)
- Python 3.10+ (tested with 3.14 on Windows)
- MongoDB (Atlas cloud or local)
- Git
git clone <repository-url>
cd CleanSight
pnpm install# Frontend — add your Firebase config
copy Frontend\.env.example Frontend\.env
# Backend — add MongoDB URI + Firebase Admin credentials
copy Backend\.env.example Backend\.env
# ML Service — optional, uses sensible defaults
copy ML\.env.example ML\.envEdit each .env with your real credentials. Never commit .env files.
cd ML
py -3.11 -m venv venv # TensorFlow 2.15 (Phase 1) needs Python 3.11 on Windows
.\venv\Scripts\Activate.ps1 # Windows PowerShell
pip install -r requirements_service.txt
cd ..# Terminal 1 — Backend
cd Backend
npm run dev
# → http://localhost:5000
# Terminal 2 — ML Phase 1 Service (binary classifier)
cd ML
.\venv\Scripts\Activate.ps1
python -m uvicorn service.main:app --host 0.0.0.0 --port 8000 --reload
# → http://localhost:8000
# Terminal 3 — ML Phase 2 Category Service
cd ML
.\venv\Scripts\Activate.ps1
python -m uvicorn category_service.main:app --host 0.0.0.0 --port 8001 --reload
# → http://localhost:8001
# Terminal 4 — Frontend
cd Frontend
pnpm dev
# → http://localhost:8080| Service | URL | Health Check |
|---|---|---|
| Frontend | http://localhost:8080 | Opens CleanSight landing page |
| Backend | http://localhost:5000 | http://localhost:5000/api/health |
| ML Phase 1 | http://localhost:8000 | http://localhost:8000/health |
| ML Phase 2 | http://localhost:8001 | http://localhost:8001/health |
📖 Full setup guide: docs/LOCAL_DEPLOYMENT.md ✅ Pre-demo checklist: docs/QUICK_VERIFICATION_CHECKLIST.md
- Submission: A user captures an image and tags the location on the map.
- Phase 1 Screening: The ML binary model determines whether the image contains waste. Non-waste images are rejected early.
- Phase 2 Classification: Confirmed waste images are classified into a category (plastic, paper, glass, or mixed).
- Confidence Gating: High-confidence predictions are auto-accepted; low-confidence ones are queued for admin review.
- Dispatch: Verified reports appear on the community dashboard for volunteers to claim.
- Resolution: Volunteers execute the cleanup and log completion.
- Review & Analytics: Admins review outcomes; the analytics dashboard tracks community impact and model performance.
Developed by Sanuka Marasinghe
Building technology for cleaner, greener communities.