🌱 WasteWise - Track, Reduce, Repurpose Your Waste

Transform waste sorting into a rewarding experience with AI-powered scanning, gamification, and real-time environmental impact tracking.

Live Demo • Documentation • Report Bug • Request Feature

---

📋 Table of Contents

• Introduction
• Features
• Tech Stack
• Getting Started
• Project Structure
• Implementation Details
• Environmental Impact
• Screenshots
• Future Enhancements
• Contributing

---

🌍 Introduction

WasteWise is a cutting-edge waste management platform developed for the Ignite Hackathon 2025. It empowers users to sort, track, and repurpose waste using AI, gamification, and environmental analytics.

Problem Statement

• 40% of recyclable materials end up in landfills due to improper sorting
• Limited awareness of proper disposal methods
• Low engagement in sustainable practices
• No real-time feedback on environmental impact

Our Solution

WasteWise combines AI-powered computer vision, gamification, and community engagement to make waste management:

• ✅ Simple - Scan items with your device camera
• ✅ Educational - Learn proper disposal instantly
• ✅ Engaging - Earn points and compete on leaderboards
• ✅ Impactful - Track real-time environmental contributions

---

✨ Features

🎯 Core Features

1. AI-Powered Waste Scanning

• Computer Vision: Identifies waste items with 92.3% accuracy
• Real-time Classification: Recyclable, organic, trash
• Smart Recommendations: Disposal guidance based on location
• Flexible Input: Camera capture or gallery upload

2. Gamification & Rewards System

• Points System: Earn points for correct scans
• Level Progression: Eco-warrior ranks and badges
• Achievements: Unlock badges for milestones
• Rewards Redemption: Exciting Vouchers, eco-products, Badges
• Daily Challenges: Extra points for completing targets

3. Environmental Impact Tracking

• Real-time Metrics: CO₂ saved, items scanned, accuracy rates
• Trends & Charts: Visualize waste reduction over time
• Environmental Equivalents: Trees saved, water conserved
• Personal Dashboard: Holistic eco-footprint tracking

4. Community Engagement

• Global & Friends Leaderboards
• Social Sharing: WhatsApp, social platforms
• Community Challenges: Collaborative environmental goals
• Weekly Rankings: Track improvements

5. User Authentication & Profile Management

• JWT-based Auth with refresh tokens
• Protected Routes with role-based access
• Profile Customization & preferences
• Session Management: Secure login/logout

6. Educational Resources

• Daily eco-tips and sustainability insights
• Step-by-step sorting guidance
• Material recyclability information
• Environmental impact education

🎨 UX Enhancements

• Responsive: Mobile, tablet, desktop optimized
• Smooth Animations: Framer Motion transitions
• Toast Notifications: Real-time feedback
• Skeleton Loaders: Smooth loading experience

---

📤 Image Analysis Page

The user takes or uploads an image, the model classifies and outputs its type. Along with additional tips:

🛠 Tech Stack

Frontend

Technology	Purpose	Version
React	UI Library	18.3.1
TypeScript	Type Safety	5.9.3
Vite	Build Tool	7.1.7
React Router	Routing	6.30.1
TailwindCSS	Styling	4.1.14
Framer Motion	Animations	12.23.24
Shadcn/ui	Component Library	Latest
Radix UI	Accessible Components	Latest

State Management & Data Fetching

• React Context API - Auth & global state
• React Hook Form - Form validation
• Zod - Schema validation

UI Components & Icons

• Lucide React - Icons
• Recharts - Data visualization
• Sonner - Toast notifications

Backend Integration

• Axios - HTTP client with interceptors
• JWT Authentication - Secure token-based auth
• Cookie Management - Secure sessions

Development Tools

• ESLint - Linting
• TypeScript ESLint - Type-safe linting
• PostCSS & Autoprefixer - CSS processing

---

🚀 Getting Started

Prerequisites

• Node.js v18+
• npm / yarn / pnpm / bun
• Git

Installation

git clone https://github.com/AustinVarshney/Ignite-Hackathon-2025.git
cd Ignite-Hackathon-2025
npm install

Environment Variables

VITE_API_URL=http://localhost:3001/api
VITE_ENABLE_ANALYTICS=true
VITE_ENABLE_PWA=true
VITE_APP_NAME=WasteWise
VITE_APP_VERSION=1.0.0

Start Development Server

npm run dev

Visit: http://localhost:5173

Build for Production

npm run build
npm run preview

Linting

npm run lint

---

📁 Project Structure

src/
├── assets/          # Images, fonts
├── components/      # React components
├── contexts/        # React Contexts
├── hooks/           # Custom hooks
├── lib/             # Utilities
├── pages/           # Page components
├── services/        # API services
├── App.tsx          # Root component
├── main.tsx         # Entry point
└── index.css        # Global styles

---

🔧 Implementation Details

Authentication Flow

1. User submits credentials
2. Backend validates & returns JWTs
3. Store tokens in localStorage & cookies
4. Include access token in API requests
5. Automatic token refresh
6. Secure logout

State Management

• AuthProvider: User & token state
• Server State: React Query
• Local/Form State: useState & React Hook Form

API Integration

const api = axios.create({ baseURL: import.meta.env.VITE_API_URL, withCredentials: true });
api.interceptors.request.use(config => { /* add auth token */ return config; });
api.interceptors.response.use(response => response, async error => { /* refresh token */ });

Routing Strategy

<ProtectedRoute><Dashboard/></ProtectedRoute>
Routes: /, /login, /register, /home, /scan, /impact, /rewards, /community, /profile

---

🌱 Environmental Impact

• CO₂ Saved: Correctly sorted items
• Trees Equivalent: CO₂ to trees
• Water Saved: Through recycling
• Landfill Diversion: Waste reduced

totalCO2Saved = scannedItems.reduce((sum, item) => sum + impactMetrics[item.type].co2, 0);
treesEquivalent = totalCO2Saved / 5;

---

📸 Screenshots

• Landing Page:

• Dashboard:

• Scan Interface:

• Rewards System:

• Community Leaderboard:

• Impact Tracking:

---

🔮 Future Enhancements

• Multi-item detection, barcode scanning, material analysis
• Social features: group challenges, chat, referral bonuses
• Advanced analytics & export (PDF/CSV)
• Enterprise dashboard, API integration
• CI/CD, testing, image optimization, offline support, i18n, WebSockets

---

🧩 Contributing

Contributions are always welcome 💡

To contribute:

1. Fork the repository
2. Create a new feature branch
3. Commit your changes
4. Open a pull request

---

👥 Team

Name	Role
Austin Varshney	Frontend Developer
Rupesh Varshney	Backend Developer
Aryan Parashar	AI & ML Developer
Prakhar Saxena	AI & ML Developer

---

⭐ Star this repository if you found it helpful!

Made with ❤️ and ♻️ for a sustainable future