Making sustainability simple, one step at a time 🌍✨
A modern, feature-rich web application for tracking your daily carbon footprint with beautiful visualizations, personalized insights, and actionable sustainability tips. Built with Django and featuring a stunning green-themed UI with dynamic island-style navigation.
- Modern iOS-inspired floating navigation bar
- Smooth animations and hover effects with backdrop blur
- Responsive design that adapts seamlessly to all screen sizes
- Active state indicators and delightful micro-interactions
- Real-time CO₂ tracking with interactive Chart.js visualizations
- Weekly emissions trends and category breakdowns
- Progress tracking towards personalized daily goals
- Recent activities overview with impact level indicators
- Real-time CO₂ estimation as you type
- Quick-add buttons for common daily activities
- Comprehensive database with 60+ emission factors
- Category-based organization (🚗 Transport, ⚡ Energy, 🍽️ Food, 💻 Digital)
- AI-driven recommendations based on your activity patterns
- Category-specific actionable advice
- Interactive tip cards with completion tracking
- Social sharing functionality for spreading awareness
- Professional green color palette (Emerald & Teal themes)
- Glassmorphism effects and smooth gradients
- Modern typography using Inter font family
- Mobile-first responsive design principles
- Accessibility-focused with WCAG compliance
- Beautiful login/registration forms with validation
- Password strength indicators and security features
- Environmental facts sidebar during authentication
- Animated community statistics and user onboarding
| Technology | Purpose | Icon |
|---|---|---|
| Django 5.1 | Backend Framework | 🐍 |
| Python 3.8+ | Core Language | 🚀 |
| SQLite | Database | 💾 |
| HTML5 | Structure | 🏗️ |
| CSS3 | Modern Styling | 🎨 |
| JavaScript | Interactivity | ⚡ |
| Chart.js | Data Visualization | 📊 |
- MVC Pattern: Clean separation of concerns
- Custom Template Tags: Advanced template functionality
- Management Commands: Automated data population
- Responsive Design: Mobile-first approach
- Performance Optimized: Efficient database queries
- Security: CSRF protection, secure authentication
- 🐍 Python 3.8+ installed
- 📦 pip package manager
- 🔧 Virtual environment (recommended)
-
📂 Clone the Repository
git clone https://github.com/yourusername/greensteps.git cd greensteps -
🔧 Create Virtual Environment
# Create virtual environment python -m venv greensteps_env # Activate (Windows) greensteps_env\Scripts\activate # Activate (macOS/Linux) source greensteps_env/bin/activate
-
📦 Install Dependencies
pip install django pip install pillow # For image handling -
📁 Set Up Directory Structure
# Create required directories mkdir -p templates/registration mkdir -p static/css mkdir -p tracker/templatetags mkdir -p tracker/management/commands # Create __init__.py files touch tracker/templatetags/__init__.py touch tracker/management/__init__.py touch tracker/management/commands/__init__.py
-
🗄️ Database Setup
# Create and apply migrations python manage.py makemigrations tracker python manage.py migrate # Create superuser account python manage.py createsuperuser
-
🌱 Populate Emission Factors
# Load comprehensive emission factors database python manage.py populate_emission_factorsThis adds 60+ emission factors including:
- 🚗 Transportation: Cars, buses, trains, flights, cycling
- ⚡ Energy: Grid electricity, solar, heating systems
- 🍽️ Food: Various meals, drinks, dietary choices
- 💻 Digital: Streaming, gaming, web browsing, cloud storage
-
🚀 Launch Application
python manage.py runserver
🎉 Visit: http://127.0.0.1:8000
- Register your account with personalized daily CO₂ goals
- Log activities - transportation, meals, energy usage, digital activities
- View dashboard - track trends and progress with interactive charts
- Get insights - receive personalized sustainability recommendations
- Take action - implement tips and monitor your improvement
- Today's Impact: Real-time CO₂ emissions with goal progress
- Weekly Trends: Visual charts showing your environmental footprint
- Category Breakdown: Understand which activities impact you most
- Recent Activities: Quick overview of logged actions
- Personalized tips based on your highest emission categories
- Actionable advice for reducing your carbon footprint
- Progress tracking and motivational content
- Social sharing to inspire others
- 60+ Emission Factors covering daily activities
- Real-time Calculations with instant feedback
- Category Organization for better insights
- Historical Analysis with trend visualization
- Intuitive Interface with modern design principles
- Smooth Animations and micro-interactions
- Mobile Responsive design for all devices
- Accessibility Features for inclusive usage
- Scientific Accuracy with researched emission factors
- Personalized Recommendations based on usage patterns
- Progress Visualization with interactive charts
- Goal Setting and achievement tracking
- ✅ CSRF Protection for secure forms
- ✅ User Authentication with secure password handling
- ✅ SQL Injection Prevention with Django ORM
- ✅ Optimized Queries for fast loading
- ✅ Static File Optimization for better performance
- ✅ Mobile Performance optimized for all devices
Modify the green color palette in static/css/styles.css:
:root {
--emerald-500: #10b981; /* Primary green */
--teal-500: #14b8a6; /* Secondary green */
/* Add your custom colors */
}- Via Admin Panel:
/admin/→ Emission Factors - Via Management Command: Edit
populate_emission_factors.py - Programmatically: Use Django ORM in shell
- Update
CATEGORY_CHOICESinmodels.py - Add corresponding icons in templates
- Run migrations:
python manage.py makemigrations && python manage.py migrate
Beautiful hero section with feature showcase and call-to-action
Real-time CO₂ estimation with quick-add functionality
Personalized recommendations with progress tracking
- Environment Variables: Create
.envfile with production settings - Database: Consider PostgreSQL for production
- Static Files: Configure for production serving
- Security: Update
ALLOWED_HOSTSand security settings
- Heroku: Easy deployment with PostgreSQL add-on
- DigitalOcean: App Platform or Droplets
- AWS: Elastic Beanstalk or EC2
- PythonAnywhere: Simple Django hosting
We welcome contributions! Here's how you can help:
- 🍴 Fork the repository
- 🌿 Create a feature branch (
git checkout -b feature/amazing-feature) - 💾 Commit your changes (
git commit -m 'Add amazing feature') - 📤 Push to the branch (
git push origin feature/amazing-feature) - 🔄 Open a Pull Request
- Follow Django best practices
- Write tests for new features
- Update documentation
- Follow the existing code style
- Add meaningful commit messages
- Lines of Code: 3,000+
- Templates: 8 responsive templates
- Models: 3 core models with relationships
- Views: 10+ feature-rich views
- Emission Factors: 60+ pre-configured factors
- CSS Classes: 200+ modern utility classes
This project demonstrates:
- Full-Stack Web Development with Django
- Modern CSS techniques (Flexbox, Grid, Animations)
- JavaScript interactivity and Chart.js integration
- Database Design and relationships
- User Experience design principles
- Responsive Web Design best practices
- Environmental Awareness through technology
- 🔗 API Integration: Weather data correlation
- 📱 Mobile App: React Native companion
- 🌐 Social Features: Community challenges
- 📈 Advanced Analytics: ML predictions
- 🌍 Multi-language: Internationalization
- 🔌 IoT Integration: Smart device connectivity
This project is licensed under the MIT License - see the LICENSE file for details.
MIT License
Copyright (c) 2025 Ammar Elbedweihy
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
Ammar Elbedweihy
- 💼 LinkedIn: linkedin.com/in/ammar-elbedweihy
- 📧 Email: [email protected]
- 🐙 GitHub: github.com/ammarelbedweihy
- 🐛 Bug Reports: Open an issue on GitHub
- 💡 Feature Requests: Discussion tab in repository
- ❓ Questions: Email or LinkedIn message
- 🤝 Collaboration: Always open to interesting projects!
- 🌍 Environmental Data: Based on scientific research and carbon footprint studies
- 🎨 Design Inspiration: Modern web design trends and sustainability-focused UIs
- 📊 Chart.js: For beautiful, interactive data visualizations
- 🚀 Django Community: For the amazing framework and ecosystem
- 💚 Sustainability Movement: For inspiring this project's mission
- Carbon Awareness: Helps users understand their daily impact
- Behavior Change: Provides actionable insights for reduction
- Education: Raises awareness about sustainability
- Community: Encourages sharing of green practices
- Performance Score: 95+ on Lighthouse
- Accessibility: WCAG 2.1 AA compliant
- Mobile Responsive: Works on all device sizes
- Load Time: Under 2 seconds initial load
Made with 💚 for a sustainable future
🌱 Every small action counts towards a greener future! 🌍✨
GreenSteps - Track your carbon footprint, make a difference, one step at a time. 🚀