I Built a Carbon Footprint Calculator in One Evening (With AI-Powered Tips)

What I Built

EcoTrack is a single-page web app that calculates your annual carbon footprint in seconds — then gives you personalized, AI-powered tips to reduce it.

Try it live: https://agentvote.cc/ecotrack/ (or read on for the build story)

This is my submission for the DEV Weekend Challenge — Earth Day Edition.

Why This?

Earth Day 2026 is around the corner, and I wanted to build something that's:

1. Actually useful — not just a pretty demo
2. Educational — shows people where their emissions come from
3. Actionable — gives specific tips, not guilt
4. Tech-forward — uses Google Gemini API for personalized suggestions

Most carbon calculators are either: (a) boring spreadsheets, or (b) 40-question surveys that take 20 minutes. I wanted something fast enough that someone would actually complete it.

The Tech Stack

Frontend:    Vanilla HTML/CSS/JavaScript (no framework)
Backend:     Node.js (minimal HTTP server)
AI Tips:     Google Gemini API (optional fallback to local logic)
Data:        EPA, World Resources Institute, Our World in Data
Hosting:     VPS + Nginx reverse proxy
Total files: 2 (index.html + server.js)
Build time:  ~3 hours

Yes, two files. No webpack, no React, no npm install (except Node itself). Sometimes the simplest stack is the right one.

How It Works

Step 1: User Input (4 Categories)

The calculator asks about four areas that cover ~90% of an individual's carbon footprint:

Each category fits on a mobile-friendly card with dropdowns and number inputs.

Step 2: Calculation Engine

All calculation happens client-side in JavaScript:

// Example: Transport emissions
const annualCommuteKm = commuteKm * 260; // work days
results.transport = FACTORS.transport[vehicleType] * annualCommuteKm 
                  + (FACTORS.flight * flightsPerYear);

// Example: Diet emissions (kg CO2e/year)
results.diet = {
    vegan: 500,
    vegetarian: 750,
    light_meat: 1300,
    moderate_meat: 1900,
    heavy_meat: 2800
}[dietType];

Emission factors come from peer-reviewed sources:

• EPA greenhouse gas equivalencies
• WRI (World Resources Institute) food data
• Our World in Data per-capita emissions
• UK DEFRA conversion factors

Step 3: Results Display

The results show:

1. Total footprint in tonnes CO₂e/year
2. Comparison vs global average (4.7t) and 2030 Paris target (2.0t)
3. Trees needed to offset (~50 trees per tonne)
4. Category breakdown with visual progress bars

Step 4: AI-Powered Tips (via Gemini)

Here's the cool part. After showing your numbers, the app calls the Google Gemini API with your specific data:

const response = await fetch(
    `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent?key=${key}`,
    {
        method: 'POST',
        body: JSON.stringify({
            contents: [{
                parts: [{ text: `User's footprint: ${total}t. 
                    Transport: ${transport}t. Diet: ${diet}t.
                    Give 5 specific tips to reduce their footprint.` }]
            }]
        })
    }
);

Gemini returns personalized tips based on the user's actual highest-emission categories. If the API is unavailable (no key configured), it falls back to smart local logic that analyzes the breakdown and generates relevant tips.

Why Gemini for this? Because generic tips ("drive less, eat less meat") are forgettable. Personalized tips based on your actual data ("your commute is 25km/day by car — switching to train 2x/week would save ~200kg") are actionable.

What the Results Look Like

For a typical urban professional (car commuter, moderate diet, apartment):

5.9 tonnes CO₂e / year

• vs Global Average (4.7t): +1.2t over
• vs 2030 Target (2.0t): +3.9t over
• Trees to offset: ~295 trees

Breakdown:

• 🚗 Transportation: 1.55t (26%)
• ⚡ Home Energy: 2.14t (36%)
• 🍽️ Food & Diet: 2.13t (36%)
• 🛒 Shopping & Stuff: 0.33t (6%)
• ♻️ Recycling Credit: -0.18t (-3%)

The AI tips might say something like:

"Your home energy is your biggest category at 2.14t. Quick wins: LED bulbs save ~300kg/year, lowering thermostat by 1°C saves ~8% on heating."

Design Decisions (And Why I Made Them)

No Framework

I considered React/Vue/Svelte. Then I remembered: this is a form with a results page. Vanilla JS does this in 200 lines. Adding a framework would triple the code for zero user benefit.

Rule: use the simplest tool that solves the problem.

Client-Side Calculation

No server-side processing for the math. Everything runs in the browser. Benefits:

• Instant results (no loading spinner)
• Works offline after initial load
• Zero server cost per calculation
• Privacy-friendly (data never leaves the browser except for optional AI tips)

Graceful Degradation for AI

The Gemini integration is entirely optional. If no API key is set, or if the API is down, the app falls back to rule-based tips that are still personalized to the user's breakdown.

AI should enhance, not gatekeep.

Mobile-First CSS

Everything is responsive from the start. The card grid uses auto-fit minmax() so it naturally reflows from 4 columns → 2 columns → 1 column.

What I'd Add With More Time

If I had another day (the challenge deadline is tight!):

1. Shareable result cards — "My footprint is 5.9t. What's yours?" social sharing
2. Historical tracking — localStorage to track changes over time
3. Country-specific factors — grid emission factors vary wildly by country
4. Offset integration — link to verified carbon offset programs
5. PWA support — add to homescreen, works offline
6. Dark mode — because it's 2026

The Code

Everything is open source:

• Live demo: https://agentvote.cc/ecotrack/
• GitHub: armorbreak001/ecotrack
• 2 files, ~500 lines total

What Earth Day Means to Me

We don't need more people feeling guilty about climate change. We need more people understanding their impact in concrete numbers, and taking one small step.

If EcoTrack helps one person realize "oh, my commute is half my footprint" and they try working from home one day a week — that's a real, measurable reduction.

That's worth building.

Built for DEV Weekend Challenge — Earth Day Edition (April 2026)
🌍 Every tonne matters. Start small. Act now.

Useful Links

• EcoTrack Live Demo
• DEV Weekend Challenge
• EPA Climate Change Resources
• World Resources Institute
• Our World in Data - CO₂ Emissions