https://github.com/siyabuilds/carbon-footprint-logger
Full-stack carbon footprint tracker with auth, user logs, and community averages.
https://github.com/siyabuilds/carbon-footprint-logger
axios express full-stack mongodb vitejs
Last synced: about 1 month ago
JSON representation
Full-stack carbon footprint tracker with auth, user logs, and community averages.
- Host: GitHub
- URL: https://github.com/siyabuilds/carbon-footprint-logger
- Owner: siyabuilds
- License: mit
- Created: 2025-06-23T07:19:21.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-09-26T09:07:05.000Z (9 months ago)
- Last Synced: 2026-05-04T01:39:22.294Z (about 1 month ago)
- Topics: axios, express, full-stack, mongodb, vitejs
- Homepage: https://carbontrackr.vercel.app
- Size: 792 KB
- Stars: 3
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## 🌱 CarbonTrackr - Your Personal Carbon Footprint Logger
> **TL;DR:**
> Track, analyze, and reduce your carbon footprint with our sleek full-stack web app! Real-time data visualization, streak tracking, reduction targets, and personalized tips to help you become more eco-friendly.
>
> _Let's make the planet greener, one log at a time!_ 🌍
---
---
---
## 🎮 Featured Project Overview
**CarbonTrackr** is a modern, full-stack web application designed to help users track, analyze, and reduce their carbon footprint. Built with modern technologies and a focus on user experience and security, it makes environmental responsibility engaging and achievable.
---
## 🚀 Epic Features & Superpowers
```yaml
authentication: "🔐 Secure JWT-based login & registration"
activity_logging: "📝 Track daily carbon-producing activities"
data_visualization: "📊 Interactive Chart.js powered dashboards"
reduction_targets: "🎯 Set & track weekly/monthly reduction goals"
streak_tracking: "🔥 7-day activity streaks & achievements"
leaderboard: "🏆 Compete with others for lowest emissions"
real_time_tips: "💡 WebSocket-powered personalized suggestions"
weekly_summaries: "📈 Automated weekly analysis & insights"
category_filtering: "🔍 Filter by Transport, Food, Energy, etc."
responsive_design: "📱 Beautiful UI that works everywhere"
```
---
## 🖥️ Terminal Mode - Project Architecture
```bash
┌─[developer@carbontrackr]─[~/carbon-footprint-logger]
└──╼ $ tree -I node_modules
📁 carbon-footprint-logger/
├── 📁 client/ # Frontend (Vite + Vanilla JS)
│ ├── 📄 API_DOCS.md # Complete API documentation
│ ├── 📄 package.json # Frontend dependencies
│ ├── 📄 index.html # Main HTML template
│ ├── 📁 public/ # Static assets
│ └── 📁 src/ # Source magic happens here
│ ├── 📄 main.js # App entry point & initialization
│ ├── 📄 activity-data.js # Emission factors database
│ ├── 📄 calculations.js # CO₂ calculation engine
│ ├── 📄 api.js # Axios instance & interceptors
│ ├── 📄 auth.js # Authentication logic
│ ├── 📄 authEvents.js # Auth form handlers
│ ├── 📄 logging.js # CRUD operations & API calls
│ ├── 📄 ui.js # DOM manipulation & rendering
│ ├── 📄 chart.js # Chart.js integration
│ ├── 📄 filter.js # Category filtering
│ ├── 📄 form.js # SweetAlert2 modals
│ ├── 📄 socket.js # WebSocket management
│ ├── 📄 targets.js # Reduction targets logic
│ └── 📁 utils/ # Helper utilities
└── 📁 server/ # Backend (Node.js + TypeScript)
├── 📄 package.json # Backend dependencies
├── 📄 tsconfig.json # TypeScript configuration
├── 📄 docker-compose.yml # Docker setup
├── 📄 Dockerfile # Container definition
├── 📁 public/ # API documentation site
└── 📁 src/ # Server-side powerhouse
├── 📄 server.ts # Express app & socket setup
├── 📁 db/ # Database initialization
├── 📁 middleware/ # Auth middleware
├── 📁 models/ # MongoDB schemas
├── 📁 routes/ # API endpoint definitions
├── 📁 sockets/ # WebSocket event handlers
├── 📁 jobs/ # Scheduled weekly analysis
└── 📁 utils/ # Server utilities
┌─[developer@carbontrackr]─[~/status]
└──╼ $ git status
On branch main
🔥 Status: Production ready & actively maintained
📈 Features: Activity logging, targets, real-time tips
🎯 Next: Advanced analytics, AI insights
```
---
## 🛠️ Tech Arsenal & Superpowers
### Frontend Magic ✨
### Backend Power 🔧
### DevOps & Tools 🚀
---
## 🚀 Quick Start - Get Running in Minutes!
### 🔧 Prerequisites
- **Node.js** (v18+ recommended) - The JavaScript runtime
- **npm or yarn** - Package manager of choice
- **MongoDB** - Database (or use Docker setup)
- **Docker** (optional) - For containerized deployment
### 📁 Cloning the Repository
**Important:** This project uses Git submodules for modular architecture!
```bash
# Clone with all submodules
git clone --recurse-submodules https://github.com/siyabuilds/carbon-footprint-logger.git
# Or if already cloned without submodules
git submodule update --init --recursive
```
### 🎨 Frontend Setup (Client)
```bash
cd client
npm install # Install dependencies
npm run dev # Start dev server
```
🌐 Open [http://localhost:5173](http://localhost:5173) - Frontend ready!
### 🏗️ Backend Setup (Server)
```bash
cd server
npm install # Install dependencies
npm run dev # Start development server
```
⚡ Backend running on [http://localhost:3000](http://localhost:3000)
### 🐳 Docker Deployment (One-Click Setup)
```bash
cd server
docker-compose up --build # Magic happens here!
```
🎉 **Backend:** `localhost:4500` | **MongoDB:** `localhost:27017`
---
## 📊 App Features Deep Dive
### 🔐 Authentication System
- Secure JWT-based login/registration
- Email or username login support
- Auto-logout on token expiration
- Protected routes and API endpoints
### 📝 Activity Logging
- Track activities across 6+ categories (Transport, Food, Energy, etc.)
- Real-time CO₂ calculations
- Activity history with timestamps
- Bulk delete and management
### 🎯 Reduction Targets
- Set weekly/monthly reduction goals
- Percentage or absolute emission targets
- Progress tracking and visualization
- Target history and management
### 📈 Data Visualization
- Interactive Chart.js powered dashboards
- Category breakdowns and totals
- Progress charts and trends
- Real-time updates
### 🏆 Leaderboard & Social
- Compare with other users
- Lowest emission rankings
- Activity streak tracking
- Achievement system
### ⚡ Real-time Features
- WebSocket-powered live updates
- Personalized eco-tips after logging
- Real-time progress notifications
- Live activity feed
---
## 🔌 API Endpoints Quick Reference
| Method | Endpoint | Description |
| -------- | ----------------------------- | --------------------------- |
| `POST` | `/api/register` | Create new user account |
| `POST` | `/api/login` | User authentication |
| `GET` | `/api/validate` | Validate JWT token |
| `GET` | `/api/activities` | Get user's activities |
| `POST` | `/api/activities` | Log new activity |
| `DELETE` | `/api/activities/:id` | Delete specific activity |
| `GET` | `/api/activities/leaderboard` | Get rankings |
| `GET` | `/api/streaks` | Get 7-day activity streak |
| `GET` | `/api/summaries/current` | Current week summary |
| `GET` | `/api/targets` | Get active reduction target |
| `POST` | `/api/targets` | Create reduction target |
| `PUT` | `/api/targets/:id` | Update reduction target |
📚 **Full Documentation:** See [`client/API_DOCS.md`](https://github.com/siyabuilds/carbontrackr-frontend/blob/main/API_DOCS.md) for complete API reference!
---
## 🏆 Project Achievements
| Achievement | Status | Description |
| -------------------- | ------ | -------------------------------------- |
| **🌱 Eco-Friendly** | ✅ | Carbon footprint tracking & reduction |
| **⚡ Real-time** | ✅ | WebSocket integration for live updates |
| **📊 Data Viz** | ✅ | Interactive charts & analytics |
| **🎯 Goal Setting** | ✅ | Reduction targets & progress tracking |
| **🏆 Gamification** | ✅ | Streaks, leaderboards & achievements |
| **🔐 Secure** | ✅ | JWT authentication & protected routes |
| **🐳 Containerized** | ✅ | Docker & docker-compose ready |
| **📱 Responsive** | ✅ | Mobile-friendly design |
---
## 🌍 Environmental Impact
### 📈 Success Metrics
- Activities logged and CO₂ calculated
- Reduction targets set and achieved
- User streaks and engagement
- Community leaderboard participation
---
## 🛠️ Development & Contributing
### 🔄 Development Workflow
1. **Fork** the repository
2. **Clone** your fork with submodules
3. **Create** a feature branch
4. **Develop** your amazing feature
5. **Test** thoroughly
6. **Submit** a pull request
### 🚀 Deployment
- **Frontend:** Deploy to Vercel/Netlify
- **Backend:** Deploy to Render/Heroku/DigitalOcean
- **Database:** MongoDB Atlas for production
---
## 📚 Learning Resources
### 🎯 Tech Stack Deep Dives
- [Vite Documentation](https://vitejs.dev/) - Lightning fast build tool
- [Chart.js Guide](https://www.chartjs.org/) - Beautiful data visualization
- [Express.js Tutorial](https://expressjs.com/) - Web framework for Node.js
- [Socket.io Docs](https://socket.io/) - Real-time communication
- [MongoDB University](https://university.mongodb.com/) - Database mastery
---
## 🌍 Let's Connect & Build a Greener Future Together!
Source Code
Try CarbonTrackr
Get In Touch
More Projects
### 💬 Let's Collaborate On
- 🌱 **Environmental tech solutions**
- 🚀 **Full-stack development projects**
- 📊 **Data visualization innovations**
---
## 📄 License
This project is licensed under the **MIT License** - see the [LICENSE](LICENSE) file for details.
---
**Made with 💚 for a sustainable future**
_"The best time to plant a tree was 20 years ago. The second best time is now."_ 🌳