Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
78 changes: 32 additions & 46 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,36 +1,33 @@
# ♻️ EcoLoop – Sustainable Waste Management System



EcoLoop is a web-based sustainable waste management system designed to connect households with local waste collectors. The system focuses on improving recycling habits by providing real-time truck tracking, a rewards mechanism, and a simple impact dashboard.
EcoLoop is a smart waste management web application that connects households with local waste collectors. The system supports real-time truck tracking, a recycling rewards system, and an impact dashboard to promote environmental sustainability.

---

## 📌 Project Overview
## 📌 Project Information

* **Module:** Advanced Git & DevOps
* **Project Type:** Group Assignment
* **Year:** 2026
* **Repository Type:** Frontend Web Application (UI)
**Module:** Advanced Git & DevOps
**Project Type:** Group Assignment
**Year:** 2026

---

## 👥 Group Members

**O.P.C Akalanka**
Student ID: ITBIN-2313-0007
Role: Full-Stack Developer
* **O.P.C Akalanka (Chamod)**
* **Student ID: ITBIN-2313-0007**
* **Role: Full-Stack Developer**

**K.A. Shani Randika**
Student ID: ITBIN-2313-0089
Role: DevOps Engineer
* **K.A. Shani Randika**
* **Student ID: ITBIN-2313-0089**
* **Role: DevOps Engineer**

---

## 🌍 Live Deployment

**Live URL:**
[https://advanced-git-dev-ops-echo-loop.vercel.app/](https://advanced-git-dev-ops-echo-loop.vercel.app/)
[EchoLoopWebUi.vercel.app](https://echo-loop-web-ui.vercel.app/)

---

Expand All @@ -40,50 +37,48 @@ Role: DevOps Engineer
* **Map Integration:** Leaflet.js with OpenStreetMap
* **CI/CD:** GitHub Actions
* **Deployment:** Vercel
* **Version Control:** Git & GitHub
* **Version Control:** Git and GitHub

---

## ✨ Key Features

* **Real-time Truck Tracking** – Displays waste collection trucks on an interactive map
* **Rewards System** – Users earn points for recycling activities
* **Impact Dashboard** – Shows monthly recycling contribution statistics
* **Responsive Design** – Optimized for both mobile and desktop screens
* **Real-time Truck Tracking** – View waste collection trucks on an interactive map
* **Rewards System** – Earn points for recycling activities
* **Impact Dashboard** – Track monthly recycling contributions
* **Responsive Design** – Works smoothly on mobile and desktop devices

---

## 🌿 Branching Strategy

This project follows a simple Git branching strategy to support collaborative development.

* **main** – Production-ready branch (protected)
* **develop** – Integration and testing branch
* **feature/*** – Individual feature development branches
* **develop** – Integration branch
* **feature/*** – Feature development branches

**Example Feature Branches:**

* feature/ui-design
* feature/ci-cd-setup
* feature/readme-update
* feature/readme-docs

---

## 🧑‍💻 Individual Contributions

### O.P.C Akalanka – Full-Stack Developer

* Designed and developed the complete UI/UX including landing page and dashboard
* Integrated Leaflet.js map with custom truck icons and simulated movement
* Designed and implemented the full UI/UX (landing page and dashboard)
* Integrated Leaflet.js map with custom truck icons and movement simulation
* Implemented JavaScript logic for animations and user interactions
* Created the initial Continuous Integration (CI) workflow using GitHub Actions
* Created the initial CI workflow using GitHub Actions

### K.A. Shani Randika – DevOps Engineer

* Configured repository settings and branch protection rules
* Managed CI/CD workflows and Vercel deployment
* Maintained and updated project documentation
* Reviewed and approved pull requests before merging into the develop branch
* Maintained project documentation
* Reviewed and approved pull requests before merging to the develop branch

---

Expand All @@ -98,40 +93,31 @@ This project follows a simple Git branching strategy to support collaborative de
### Installation Steps

```bash
git clone https://github.com/chamod1000/EchoLoopWebUI.git
cd EchoLoopWebUI
git clone https://github.com/chamod1000/Advanced-Git-Dev-ops-EchoLoop-.git
cd Advanced-Git-Dev-ops-EchoLoop-
npm install
```

### Run the Application

* Open `index.html` directly in a web browser
* Open `index.html` directly in a browser
**OR**
* Use **Live Server** extension in VS Code
* Use **Live Server** in VS Code

---

## 🔄 CI/CD Pipeline

### Continuous Integration (CI)

* Triggered on every push and pull request
* Installs dependencies and validates the build
* Runs on every push and pull request
* Installs dependencies and checks the build

### Continuous Deployment (CD)

* Automatically deploys the application to **Vercel**
* Automatically deploys to Vercel
* Triggered when changes are merged into the `main` branch

---

## 📚 Learning Outcomes

* Practical use of Git branching strategies
* Hands-on experience with GitHub Actions for CI/CD
* Automated deployment using Vercel
* Team collaboration using pull requests and reviews

---

© 2026 EcoLoop Project – Advanced Git & DevOps Assignment