This is a submission for Weekend Challenge: Earth Day Edition EcoTrack is a zero-dependency eco habit tracker that helps everyday people build and stick to planet-friendly habits — one small action at a time. The idea is simple: most people want to live more sustainably but don't have a lightweight, friction-free way to stay accountable. EcoTrack makes it as easy as checking off a to-do list — but for the planet 🌍. Key features: Daily one-tap habit check-in with per-habit streak tracking Progress ring showing today's completion at a glance 7-day weekly heatmap to visualize consistency Cumulative impact dashboard — CO₂ saved, plastic avoided, energy and water conserved Browser push notification reminders at your chosen time Add custom habits beyond the defaults Fully offline — all data stored in localStorage, no account needed Default habits include: using a reusable bag, choosing public transport, eating plant-based meals, turning off unused lights, and carrying a reusable water bottle. 🔗 Live App: EcoTrack — Eco Habit Tracker 🐙 GitHub Repository: github.com/makendrang/ecotrack The entire app lives in a single index.html file — no build step, no dependencies, no framework. Clone it and open it directly in your browser. ecotrack/ └── index.html # Complete app — HTML + CSS + JS in one file └── README.md EcoTrack is built with pure vanilla HTML, CSS, and JavaScript — deliberately no frameworks or dependencies. The goal was to keep the app as lightweight and accessible as possible, something anyone could fork, modify, and host in minutes. Technical highlights: localStorage powers all persistence — habits, daily logs, streaks, and reminder settings all survive page reloads with no backend Streak algorithm iterates backwards from today through the log to calculate per-habit and overall streaks Impact calculations map each habit to an environmental category (carbon, plastic, energy, water) and compute cumulative totals across all logged days Web Notifications API handles the reminder system — the app requests permission, then schedules a setTimeout to fire a browser notification at the user's chosen daily time CSS-only animations drive the progress ring (SVG stroke-dashoffset transition) and impact bar reveals — no JS animation libraries needed How GitHub Copilot helped: GitHub Copilot was instrumental in keeping the build moving over a tight weekend window. Specific wins: Generated the streak calculation logic from a plain English comment in seconds Autocompleted repetitive localStorage get/set patterns without me writing boilerplate Suggested the SVG stroke-dashoffset animation approach for the progress ring when I described what I wanted in a comment Wrote the Web Notifications API scheduling logic — I just described "fire a notification at a user-chosen time daily" and Copilot filled in the setTimeout + Notification constructor code Helped write the CSS dot-grid background texture and the radial gradient layering What would have taken a full day of boilerplate and MDN lookups was compressed into a focused few hours, leaving more time to refine the UI and Earth Day theming. ✅ Best Use of GitHub Copilot GitHub Copilot wasn't just a convenience here — it was a core part of making this build possible within a weekend. From streak logic to notification scheduling to SVG animation, Copilot accelerated nearly every technical decision in the project. I used inline suggestions throughout the codebase and Copilot Chat to reason through the localStorage data model before writing a single line.