A modern waste classification and recycling platform that helps users identify, classify, and properly dispose of their waste items through AI-powered image recognition and location-based recycling recommendations.
- AI-Powered Classification - Upload images of waste items and get instant AI classification using Hugging Face models
- Location-Based Recommendations - Find nearby recycling centers based on your location and item type
- Redemption Value Estimation - Get estimated redemption value for recyclable items in your area
- Interactive Maps - View directions to recycling locations with embedded Google Maps
- Personal Dashboard - Track your recycling history and manage uploaded items
- Secure Authentication - Firebase authentication with email/password and Google sign-in
- Next.js 16 - React framework with App Router
- Tailwind CSS - Utility-first styling
- Custom Fonts - Zalando Sans SemiExpanded
- Firebase - Authentication and Firestore database
- Firebase Admin SDK - Server-side authentication verification
- Google Gemini AI - Advanced waste disposal guidance
- Hugging Face - Image classification model
- Google Maps API - Location services and directions
- Google Places API - Recycling center discovery
- Docker - Containerized deployment
- Google Cloud Run - Serverless hosting
- GitHub Actions - CI/CD pipeline
- Artifact Registry - Container image storage
- Node.js 18+ and npm
- Firebase project with Authentication and Firestore enabled
- Google Cloud Platform project with the following APIs enabled:
- Maps JavaScript API
- Places API (New)
- Maps Embed API
- Hugging Face API access
- Google Gemini API key
trashtalk/
├── src/
│ └── app/
│ ├── (auth)/ # Protected routes
│ │ └── dashboard/ # User dashboard & item pages
│ ├── (public)/ # Public routes (login, signup)
│ ├── api/ # API routes
│ │ ├── classification/ # Image classification
│ │ ├── gemini/ # AI disposal guidance
│ │ ├── maps/ # Google Maps integration
│ │ └── places/ # Location search
│ ├── components/ # React components
│ ├── lib/ # Utilities & Firebase config
│ │ ├── firebase.js
│ │ ├── firebaseAdmin.js
│ │ └── firebaseFunctions/
│ ├── globals.css
│ ├── layout.jsx
│ └── page.jsx # Landing page
├── public/ # Static assets
├── .github/workflows/ # CI/CD configuration
├── Dockerfile
├── next.config.mjs
├── package.json
└── README.md
(auth)/layout.jsx- Protected route wrapper(public)/login/page.jsx- Login page(public)/signup/page.jsx- Registration page
components/NewItemClient.jsx- Image upload & classificationcomponents/UserDashboardClient.jsx- Item management dashboardcomponents/ItemClientPage.jsx- Detailed item view with maps
api/classification/route.jsx- Hugging Face image classificationapi/gemini/route.jsx- AI-powered disposal guidanceapi/places/route.jsx- Google Places searchapi/maps/route.jsx- Google Maps directions
- Server-side token verification using Firebase Admin SDK
- Protected routes with middleware
- Secure cookie-based session management
- Environment variables for sensitive data
- CORS and security headers configured
The project includes a complete CI/CD pipeline using GitHub Actions:
- Automated Docker builds on push to
main - Artifact Registry storage
- Cloud Run deployment with automatic scaling
- Secret management through Google Cloud Secret Manager
See .github/workflows/build-and-deploy.yaml for details.
- Next.js - React framework
- Firebase - Backend services
- Hugging Face - AI models
- Google Cloud - Cloud infrastructure
- Tailwind CSS - Styling framework
Made with ♻️ by the TrashTalkers team