Logo Lanfrica

MwandikiAntony/Echo-Pulse-Kenya

Domain:

environment and energy

Record type:

software
Creator:
Mwa
Host:
EcoPulse Kenya is a platform to track eco-friendly actions like planting trees, recycling, and saving water. Every small action contributes to a greener Kenya. Track your actions, stay motivated, and make an impact! Just replace your current README.md with this content ⬇️ # πŸͺ΄ EcoPulse Kenya **EcoPulse Kenya** is a responsive React application designed to track eco-friendly actions and encourage sustainable habits. Users can log activities like planting trees, recycling, or conserving water β€” while tracking their progress, earning badges, and discovering daily eco-tips. --- ## ✨ Features - 🌱 **Track Green Actions:** Add, complete, and delete eco-tasks. - πŸ”Ž **Task Filters:** View *All*, *Completed*, or *Pending* tasks. - πŸ“Š **Progress Bar:** Visualize your completion percentage. - πŸ’Ύ **Persistent Storage:** Tasks are saved in browser **localStorage**. - πŸ’‘ **Eco Tips:** Daily sustainability tips fetched from an API. - πŸŒ— **Dark/Light Mode:** Toggle seamlessly between themes. - πŸ† **Gamification Badges:** - 1+ tasks β†’ *Eco Starter* - 5+ tasks β†’ *Eco Hero* - 10+ tasks β†’ *Eco Champion* - πŸ“± **Responsive Design:** Optimized for mobile, tablet, and desktop. - 🎞️ **Smooth Animations:** Subtle task transitions and toast notifications. --- ## 🎨 Screenshots πŸ› οΈ Technologies Used Category Tools / Libraries Frontend React.js, JSX, Tailwind CSS Routing React Router State Management React Hooks (useState, useEffect, useContext) Persistence Custom useLocalStorage Hook Animations Framer Motion + Tailwind CSS transitions API Local API simulation for eco tips Build Tool Vite.js Deployment Vercel βš™οΈ Setup Instructions 1️⃣ Clone the Repository git clone github.com cd ecopulse-kenya 2️⃣ Install Dependencies npm install 3️⃣ Run the Development Server npm run dev Open localhost in your browser. 4️⃣ Build for Production npm run build 5️⃣ Deploy Vercel: Use the vercel CLI (vercel deploy) or connect the GitHub repo. Netlify: Drag and drop the dist folder into your Netlify dashboard. 🧩 Project Structure src/ β”œβ”€β”€ components/ # Reusable UI components (Navbar, Footer, Card, Button, TaskInput) β”œβ”€β”€ pages/ # Page components (Home, …