EcoFix is a community-driven platform that empowers citizens to report and track local environmental issues. By fostering collaboration between residents and local authorities, EcoFix aims to create a cleaner, safer, and more sustainable environment.
- Geolocation: Automatically detect your location for accurate reporting.
- Photo Upload: Attach images to your reports for better understanding.
- Issue Tracking: Follow the progress of reported issues in real-time. (in-progress)
- Leaderboard: Recognize top contributors and encourage community engagement.(in-progress)
- HTML, CSS, JavaScript
- Bootstrap 5 for responsive design
- Font Awesome for icons
- OpenStreetMap API for geolocation
- node.js and npm for database and leaderboard (in-progress)
- MongoDB and schemas for databse, leaderboard and issues implementation
- Home Page
- Submit Page
- Issues Page
- Leaderboard Page
- JSON Database
The following features are currently under development and are located on a separate branch of the repository called "in-progress":
- Issues Page: This page will allow users to view and report various environmental issues in their community. It is designed to provide a comprehensive overview of ongoing reports and their statuses.
- Leaderboard Page: This feature will showcase the top contributors in the EcoFix community, highlighting their efforts in reporting and resolving environmental issues.
- JSON Database: A structured database that will store all reported issues, user contributions, and related data, ensuring efficient data management and retrieval.
Stay tuned for updates as we work to bring these features to life! 🚀
- A web browser (e.g., Chrome, Firefox)
- An IDE or text editor (e.g., VSCode, Sublime Text)
- Node.js and npm (for package management and server setup)
- Clone the repository
git clone https://github.com/yourusername/ecofix.git
cd ecofix- Install dependencies
npm install- Start the server
npm start- Open the project in your browser
- Navigate to
http://localhost:3000
index.html: The main landing page.submit.html: The page for submitting issues.leaderboard.html: The leaderboard page.css/styles/2/3.css: The main stylesheets for the project.js/submit.js: JavaScript file for handling form submissions and geolocation.assets/: Folder containing images and other assets.
- index.html
- The main landing page, containing a welcome message, features, and call-to-action sections.
- submit.html
- The form for users to submit issues, including fields for name, issue category, description, location, and photo upload.
- leaderboard.html
- The leaderboard displaying top contributors and their respective scores.
- styles3.css
- Contains styles for the overall look and feel of the website, including custom colors, form styling, and responsiveness.
- submit.js
- Handles form submissions, validates user input, and fetches user location using the Geolocation API and OpenStreetMap.
- Navigate to the submission page
- Click on the "Submit Issue" button on the homepage or go to
http://localhost:3000/submit.html.
- Fill out the form
- Enter your name, select an issue category, provide a description, and enter your location.
- You can use the "Use My Location" button to automatically fetch your current location.
- Upload a photo
- Attach an image of the issue you are reporting.
- Submit the form
- Click the "Submit Issue" button to send your report.
- Navigate to the leaderboard page
- Click on the "Leaderboard" link in the navigation menu or go to
http://localhost:3000/leaderboard.html.
- View top contributors
- See the list of top contributors and their scores based on the issues they have reported and resolved.
We welcome contributions to improve EcoFix! Here’s how you can help:
- Fork the repository
- Create a new branch
git checkout -b feature-branch-name- Make your changes
- Improve the code, add features, or fix bugs.
- Commit your changes
git commit -m "Description of changes"- Push to the branch
git push origin feature-branch-name- Create a pull request
This project is licensed under the MIT License. See the LICENSE file for more details.
For any inquiries or support, please contact us at:
- Email:
- Phone:
Connect with us on social media:
- Special thanks to Hack To The Future Hackathon
- Icons by Font Awesome.
- Geolocation services by OpenStreetMap.
Thank you for using EcoFix! Together, we can make our environment better 🌍✨.