{"id":30815076,"url":"https://github.com/md-zeon/micro-earn-client","last_synced_at":"2026-04-07T09:31:08.740Z","repository":{"id":310334957,"uuid":"1028172177","full_name":"md-zeon/micro-earn-client","owner":"md-zeon","description":"Frontend for MicroEarn, a micro-task and earning platform where users can earn rewards by completing tasks. Built with React, Tailwind CSS, and Firebase. Features role-based dashboards for Workers, Buyers, and Admins, real-time notifications, secure authentication, task submissions, and payment processing with Stripe.","archived":false,"fork":false,"pushed_at":"2025-12-18T17:21:37.000Z","size":6061,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-12-21T20:49:25.760Z","etag":null,"topics":["aos","daisyui","firebase-auth","javascript","jwt","mongodb","motion","react","reactjs","tailwindcss"],"latest_commit_sha":null,"homepage":"https://micro-earn-7be08.web.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/md-zeon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-07-29T06:19:28.000Z","updated_at":"2025-12-18T17:21:40.000Z","dependencies_parsed_at":"2025-08-17T13:18:01.184Z","dependency_job_id":null,"html_url":"https://github.com/md-zeon/micro-earn-client","commit_stats":null,"previous_names":["md-zeon/micro-earn-client"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/md-zeon/micro-earn-client","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/md-zeon%2Fmicro-earn-client","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/md-zeon%2Fmicro-earn-client/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/md-zeon%2Fmicro-earn-client/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/md-zeon%2Fmicro-earn-client/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/md-zeon","download_url":"https://codeload.github.com/md-zeon/micro-earn-client/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/md-zeon%2Fmicro-earn-client/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31507911,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T03:10:19.677Z","status":"ssl_error","status_checked_at":"2026-04-07T03:10:13.982Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["aos","daisyui","firebase-auth","javascript","jwt","mongodb","motion","react","reactjs","tailwindcss"],"created_at":"2025-09-06T08:04:21.579Z","updated_at":"2026-04-07T09:31:08.720Z","avatar_url":"https://github.com/md-zeon.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# MicroEarn - Client Side\n\n## Overview\n\nThe client side of MicroEarn is a responsive micro-tasking platform interface built with React.js and Tailwind CSS. It serves three primary user roles—Workers, Buyers, and Admins—allowing them to interact with tasks, submissions, and earnings through a user-friendly dashboard experience. The app integrates Firebase for authentication, uses React Router for seamless navigation, and communicates securely with the backend via Axios.\n\n## 🌐 Live Site\n\n**URL:** [https://micro-earn-7be08.web.app/](https://micro-earn-7be08.web.app/)\n\n## 👤 Admin Credentials\n\n**Email:** [admin@microearn.com](mailto:admin@microearn.com)  \n**Password:** Admin@1234\n\n---\n\n## ✨ Key Features\n\n- 🔐 **Role-Based Authentication** – Firebase authentication with Buyer, Worker, and Admin roles\n- 📋 **Task Creation** – Buyers can post tasks with descriptions, instructions, and required workers\n- 🨠 **Task Discovery** – Workers can browse tasks with filters by category, coins, deadline, etc.\n- 📝 **Task Submission** – Workers can submit proof with file upload and message\n- ✅ **Buyer Review System** – Buyers approve/reject submissions; coins awarded upon approval\n- 📤 **ImgBB Upload** – Workers upload task proof/images via ImgBB API\n- 💰 **Coin-Based Economy** – Buyers buy coins with Stripe, Workers earn coins from tasks\n- 💸 **Withdrawals** – Workers can withdraw coins (20 coins = $1, min 200 coins); status = pending until admin approval\n- 📊 **Dashboards** – Role-specific dashboards showing tasks, payments, coins, and submissions\n- 📥 **Notifications** – Real-time alerts for submission approvals, rejections, new tasks, and withdrawals\n- 🧑‍💼 **Admin Panel** – Manage users, tasks, and approve withdrawals\n- 📄 **Payment History** – Buyers see purchase history; Workers see withdrawals\n- 🛡️ **Secure Routes** – Route protection and role-based redirection\n- 🖼️ **Profile Management** – Edit name, profile photo, and track performance\n- 📱 **Responsive UI** – Fully responsive layout with TailwindCSS + DaisyUI\n- 📈 **Performance Analytics** – Track total coins earned, tasks completed, and payment history\n- 🪪 **Form Validation** – Clean forms using React Hook Form + custom validation\n- ⚙️ **Custom Hooks** – All role and auth logic separated into reusable hooks\n\n---\n\n## 📋 Feature Overview Table\n\n| Feature                   | Description                                                         |\n| ------------------------- | ------------------------------------------------------------------- |\n| Role-Based Authentication | Separate login access for Workers, Buyers, and Admins               |\n| Task Creation             | Buyers can post detailed tasks with instructions and deadlines      |\n| Task Submission           | Workers can submit task proofs with image upload                    |\n| Buyer Review System       | Buyers approve or reject submissions; status updates in real-time   |\n| Worker Earnings           | Earn coins per approved task; track coin balance                    |\n| Coin-Based Economy        | Internal system where 20 coins = $1 for withdrawal                  |\n| Stripe Payments           | Buyers purchase coins securely using Stripe                         |\n| Withdrawals               | Workers can request to withdraw money after earning minimum coins   |\n| Admin Panel               | Manage users, tasks, and withdrawal requests                        |\n| Notifications             | Bell-based alert system for submissions, approvals, and withdrawals |\n\n---\n\n## 🛠️ Tech Stack\n\n### Frontend\n\n[![React](https://img.shields.io/badge/React-20232A?style=for-the-badge\u0026logo=react\u0026logoColor=61DAFB)](https://reactjs.org/)\n[![Vite](https://img.shields.io/badge/Vite-646CFF?style=for-the-badge\u0026logo=vite\u0026logoColor=white)](https://vitejs.dev/)\n[![TailwindCSS](https://img.shields.io/badge/TailwindCSS-06B6D4?style=for-the-badge\u0026logo=tailwind-css\u0026logoColor=white)](https://tailwindcss.com/)\n[![DaisyUI](https://img.shields.io/badge/DaisyUI-5A0FC8?style=for-the-badge\u0026logo=tailwindcss\u0026logoColor=white)](https://daisyui.com/)\n[![Firebase](https://img.shields.io/badge/Firebase-FFCA28?style=for-the-badge\u0026logo=firebase\u0026logoColor=black)](https://firebase.google.com/)\n[![Stripe](https://img.shields.io/badge/Stripe-008CDD?style=for-the-badge\u0026logo=stripe\u0026logoColor=white)](https://stripe.com/)\n[![TanStack Query](https://img.shields.io/badge/TanStack%20Query-FF4154?style=for-the-badge\u0026logo=react-query\u0026logoColor=white)](https://tanstack.com/query)\n[![React Router](https://img.shields.io/badge/React%20Router-CA4245?style=for-the-badge\u0026logo=react-router\u0026logoColor=white)](https://reactrouter.com/)\n[![Framer Motion](https://img.shields.io/badge/Framer_Motion-EF00FF?style=for-the-badge\u0026logo=framer\u0026logoColor=white)](https://www.framer.com/motion/)\n[![React Hook Form](https://img.shields.io/badge/React_Hook_Form-EC5990?style=for-the-badge\u0026logo=reacthookform\u0026logoColor=white)](https://react-hook-form.com/)\n\n### Backend\n\n[![Express.js](https://img.shields.io/badge/Express.js-000000?style=for-the-badge\u0026logo=express\u0026logoColor=white)](https://expressjs.com/)\n[![MongoDB](https://img.shields.io/badge/MongoDB-47A248?style=for-the-badge\u0026logo=mongodb\u0026logoColor=white)](https://www.mongodb.com/)\n[![Firebase Admin](https://img.shields.io/badge/Firebase_Admin-FFA611?style=for-the-badge\u0026logo=firebase\u0026logoColor=white)](https://firebase.google.com/docs/admin)\n[![Stripe API](https://img.shields.io/badge/Stripe_API-008CDD?style=for-the-badge\u0026logo=stripe\u0026logoColor=white)](https://stripe.com/docs/api)\n[![dotenv](https://img.shields.io/badge/dotenv-8DD6F9?style=for-the-badge\u0026logo=dotenv\u0026logoColor=black)](https://www.npmjs.com/package/dotenv)\n\n---\n\n## 🧪 Pages and Routes\n\n| Route                          | Description                                     |\n| ------------------------------ | ----------------------------------------------- |\n| `/`                            | Homepage with banner, features, and top workers |\n| `/login`                       | User login page                                 |\n| `/register`                    | User registration page                          |\n| `/dashboard`                   | Redirects based on user role                    |\n| `/dashboard/my-tasks`          | Buyer: Manage own tasks                         |\n| `/dashboard/create-task`       | Buyer: Post a task                              |\n| `/dashboard/payments`          | Buyer: View payments                            |\n| `/dashboard/take-task`         | Worker: Browse available tasks                  |\n| `/dashboard/my-submissions`    | Worker: See submitted tasks                     |\n| `/dashboard/request-withdraw`  | Worker: Submit a withdrawal request             |\n| `/dashboard/withdrawals`       | Worker: View withdrawal history                 |\n| `/dashboard/all-users`         | Admin: View/manage users                        |\n| `/dashboard/all-tasks`         | Admin: View/delete tasks                        |\n| `/dashboard/stats`             | Admin: View platform stats                      |\n| `/dashboard/withdraw-requests` | Admin: Approve withdrawals                      |\n\n## 🔑 Environment Variables\n\nCreate a `.env.local` file in the root:\n\n```env\nVITE_apiKey=your_firebase_api_key\nVITE_authDomain=your_firebase_auth_domain\nVITE_projectId=your_project_id\nVITE_storageBucket=your_storage_bucket\nVITE_messagingSenderId=your_messaging_id\nVITE_appId=your_app_id\nVITE_IMGBB_API_KEY=your_imgbb_api_key\nVITE_API_URL=https://micro-earn-server.vercel.app\nVITE_STRIPE_PUBLISHABLE_KEY=your_stripe_publishable_key\n```\n\n## 🛠️ Installation\n\n```bash\ngit clone https://github.com/Programming-Hero-Web-Course4/b11a12-client-side-md-zeon\ncd b11a12-client-side-md-zeon\nnpm install\n```\n\nRun the development server:\n\n```bash\nnpm run dev\n```\n\n## 🧾 Notes\n\n- Uses JWT from Firebase for secure API communication.\n- Fully responsive and mobile-friendly.\n- Includes loading states, error boundaries, and fallback UIs.\n- Integrated with backend server hosted at: [https://micro-earn-server.vercel.app](https://micro-earn-server.vercel.app)\n\n## 🧪 Testing\n\n- Tested manually across major routes and dashboard flows.\n- Protected routes tested for all roles.\n\n---\n\n## 👥 User Roles\n\n### 👷 Workers\n\n- Browse and complete available tasks\n- Earn coins and withdraw real money\n- View task history and performance stats\n\n### 💼 Buyers\n\n- Create and manage tasks\n- Review and approve/reject submissions\n- Monitor task performance and payments\n\n### 🛡️ Admins\n\n- Oversee the entire platform\n- Manage users, tasks, and withdrawal requests\n- Monitor overall platform statistics and earnings\n\n---\n\n## 📄 License\n\nThis project is for educational purpose only.\n\n\n\n## 🗂️ Project Structure\n\n```\nmicro-earn-client/\n├── public/                # Static assets (SVGs, video, favicon)\n├── src/\n│   ├── api/               # API utilities\n│   ├── assets/            # SVGs and images\n│   ├── components/        # Reusable UI components\n│   ├── contexts/          # React context providers\n│   ├── firebase/          # Firebase config\n│   ├── hooks/             # Custom React hooks\n│   ├── layouts/           # Page layouts\n│   ├── pages/             # Route pages (Home, About, Auth, Dashboard, etc.)\n│   ├── providers/         # App-level providers\n│   ├── Routes/            # Route protection and role-based routes\n│   └── index.css, main.jsx, App.jsx\n├── package.json           # Project metadata and dependencies\n├── vite.config.js         # Vite configuration\n├── firebase.json          # Firebase hosting config\n├── eslint.config.js       # ESLint configuration\n└── README.md\n```\n\n### Home Page Sections\n\nThe Home page (`src/pages/Home/Home.jsx`) features these main sections:\n- **Hero** – Landing banner and introduction\n- **HowItWorks** – Steps to get started\n- **BestWorkers** – Showcase of top workers\n- **TestimonialSlider** – User testimonials\n- **WhyChooseUs** – Platform benefits\n- **FAQ** – Frequently asked questions\n\n## 🤝 Contributing\n\nContributions are welcome! Feel free to fork the repo and submit pull requests. Whether it's fixing bugs, improving documentation, or adding new features — all efforts are appreciated.\n\n## 📬 Contact\n\nIf you have any questions or feedback, feel free to reach out:\n\n**Developer:** Zeanur Rahaman Zeon  \n**Email:** [zeon.cse@gmail.com](mailto:zeon.cse@gmail.com)  \n**LinkedIn:** [https://www.linkedin.com/in/zeanur-rahaman-zeon](https://www.linkedin.com/in/zeanur-rahaman-zeon)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmd-zeon%2Fmicro-earn-client","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmd-zeon%2Fmicro-earn-client","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmd-zeon%2Fmicro-earn-client/lists"}