{"id":25695513,"url":"https://github.com/sk-jabed/taskwiz-client-side","last_synced_at":"2026-06-12T13:31:13.972Z","repository":{"id":278612387,"uuid":"936188063","full_name":"SK-Jabed/TaskWiz-Client-Side","owner":"SK-Jabed","description":"The TaskWiz Client is the frontend of a modern task management application. It provides an interactive drag-and-drop interface to manage tasks in three categories: To-Do, In Progress, and Done. Built with React, Vite.js, and TailwindCSS, it ensures a smooth and efficient user experience.","archived":false,"fork":false,"pushed_at":"2025-02-28T12:16:11.000Z","size":506,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-28T18:06:36.962Z","etag":null,"topics":["axios","daisyui","eslint","firebase","html5","react-router","reactdnd","reactjs","shadcn-ui","sweetalert2","tailwindcss","tanstack-react-query","vite"],"latest_commit_sha":null,"homepage":"https://taskwiz-01.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/SK-Jabed.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}},"created_at":"2025-02-20T17:07:26.000Z","updated_at":"2025-02-28T12:16:15.000Z","dependencies_parsed_at":"2025-02-20T18:48:51.757Z","dependency_job_id":null,"html_url":"https://github.com/SK-Jabed/TaskWiz-Client-Side","commit_stats":null,"previous_names":["sk-jabed/taskwiz-client-side"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/SK-Jabed/TaskWiz-Client-Side","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SK-Jabed%2FTaskWiz-Client-Side","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SK-Jabed%2FTaskWiz-Client-Side/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SK-Jabed%2FTaskWiz-Client-Side/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SK-Jabed%2FTaskWiz-Client-Side/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SK-Jabed","download_url":"https://codeload.github.com/SK-Jabed/TaskWiz-Client-Side/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SK-Jabed%2FTaskWiz-Client-Side/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34247460,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-12T02:00:06.859Z","response_time":109,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["axios","daisyui","eslint","firebase","html5","react-router","reactdnd","reactjs","shadcn-ui","sweetalert2","tailwindcss","tanstack-react-query","vite"],"created_at":"2025-02-25T00:51:57.636Z","updated_at":"2026-06-12T13:31:13.947Z","avatar_url":"https://github.com/SK-Jabed.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# TaskWiz Client\n\n## 📌 Project Overview\nThe **TaskWiz Client** is the frontend of a modern task management application. It provides an interactive **drag-and-drop** interface to manage tasks in three categories: **To-Do, In Progress, and Done**. Built with **React, Vite.js, and TailwindCSS**, it ensures a smooth and efficient user experience.\n\n## 🎯 Purpose\nThe primary goals of the **TaskWiz Client**:\n- Provide an **intuitive UI** for task management.\n- Enable **real-time task updates** with instant synchronization.\n- Offer a **responsive** and **accessible** interface for both desktop and mobile users.\n- Implement **Firebase Authentication** for secure access.\n\n## 🚀 Live Site\n\u003e 🔗 **Live Demo:** [TaskWiz Live Site](https://taskwiz-01.web.app/)\n\n---\n\n## 🔑 Key Functionalities\n- **User Authentication**\n  - Google Sign-In via Firebase.\n  - Store user details (name, email) upon first login.\n\n- **Task Management**\n  - Add, edit, and delete tasks.\n  - Drag and drop tasks between **To-Do, In Progress, and Done**.\n  - Reorder tasks within the same category.\n  - Instantly save task updates to the database.\n\n- **Real-Time Sync**\n  - Updates persist even after refreshing the page.\n  - Tasks maintain their last known order.\n  \n- **Responsive \u0026 Modern UI**\n  - Optimized for **desktop and mobile**.\n  - Uses **TailwindCSS \u0026 DaisyUI** for a sleek design.\n\n---\n\n## ✨ Additional Features\n✔ **Optimistic UI Updates** – Task state updates instantly before backend confirmation.  \n✔ **Dark Mode Support** – User-friendly interface with light/dark mode toggle.  \n✔ **Toast Notifications** – Real-time feedback using `react-hot-toast`.  \n✔ **Task Due Dates** – Display task deadlines using `moment.js`.  \n✔ **Smooth Animations** – Draggable effects powered by `@dnd-kit`.  \n\n---\n\n## 🛠️ Technologies Used\n| Technology | Purpose |\n|------------|---------|\n| **React 19** | Frontend framework |\n| **Vite.js** | Fast development server |\n| **Firebase** | Authentication |\n| **React Router** | Client-side navigation |\n| **TailwindCSS + DaisyUI** | UI styling |\n| **@dnd-kit** | Drag-and-drop functionality |\n| **Axios** | API calls |\n| **React Query** | Data fetching \u0026 caching |\n| **SweetAlert2** | Stylish pop-up alerts |\n| **React Hook Form** | Form validation |\n| **Moment.js** | Date/time formatting |\n\n---\n\n## 📌 Installation \u0026 Setup\n\n### 1️⃣ Clone the Repository\n```sh\ngit clone https://github.com/your-repo/taskwiz-client.git\ncd taskwiz-client\n```\n\n### 2️⃣ Install Dependencies\n```sh\nnpm install\n```\n\n### 3️⃣ Setup Environment Variables\nCreate a `.env` file in the root directory and add:\n```\nVITE_FIREBASE_API_KEY=your-api-key\nVITE_FIREBASE_AUTH_DOMAIN=your-auth-domain\nVITE_FIREBASE_PROJECT_ID=your-project-id\nVITE_FIREBASE_STORAGE_BUCKET=your-storage-bucket\nVITE_FIREBASE_MESSAGING_SENDER_ID=your-messaging-sender-id\nVITE_FIREBASE_APP_ID=your-app-id\nVITE_API_BASE_URL=https://your-api-url.com\n```\n\n### 4️⃣ Run the Application\n```sh\nnpm run dev\n```\nThe frontend should now be running on **http://localhost:5173**.\n\n---\n\n## 📦 Dependencies\n| Package | Version | Purpose |\n|---------|---------|---------|\n| **react** | ^19.0.0 | UI framework |\n| **vite** | ^6.1.0 | Development build tool |\n| **firebase** | ^11.3.1 | Authentication |\n| **react-router-dom** | ^7.2.0 | Routing |\n| **axios** | ^1.7.9 | HTTP requests |\n| **@tanstack/react-query** | ^5.66.9 | Data fetching |\n| **tailwindcss** | ^4.0.7 | Styling |\n| **daisyui** | ^5.0.0-beta.8 | UI components |\n| **@dnd-kit/core** | ^6.3.1 | Drag-and-drop |\n| **react-hot-toast** | ^2.5.2 | Notifications |\n\n---\n\n## 🎨 Design Philosophy\n✔ **Minimalist \u0026 Clean UI** – Limited color palette (max 4 colors).  \n✔ **User-Centered** – Simple interactions, no unnecessary distractions.  \n✔ **Performance-Oriented** – Optimized React rendering with React Query caching.  \n✔ **Accessibility First** – Ensures keyboard and screen-reader compatibility.  \n\n---\n\n## 🔮 Future Enhancements\n- ✅ **WebSocket Integration** for real-time task updates.\n- ✅ **Task Prioritization** (High, Medium, Low).\n- ✅ **Task Deadlines \u0026 Reminders**.\n- ✅ **Offline Mode** using LocalForage.\n- ✅ **Theme Customization** (User-defined color schemes).\n\n---\n\n## 🤝 Contributing\nWe welcome contributions! To contribute:\n1. Fork the repo.\n2. Create a new branch (`feature-branch`).\n3. Commit your changes (`git commit -m \"Added feature X\"`).\n4. Push to your branch (`git push origin feature-branch`).\n5. Open a **Pull Request**.\n\n---\n\n## ❓ FAQ\n\n### 1️⃣ How do I deploy this application?\nYou can deploy it using **Vercel** or **Netlify**:\n```sh\nnpm run build\n```\nThen upload the `dist` folder to your hosting provider.\n\n### 2️⃣ What happens if the API is down?\nThe app uses **React Query** for caching. If the API fails, the last fetched tasks will still be displayed.\n\n### 3️⃣ Can I use a different authentication method?\nCurrently, **Google Sign-In via Firebase** is supported. However, additional auth methods (e.g., email/password) can be added.\n\n---\n\n## 📝 License\nThis project is licensed under the **ISC License**.\n\n---\n\n## 👨‍💻 Author\n- **Sheikh Jabed** 🚀  \n  [GitHub](https://github.com/SK-Jabed) | [LinkedIn](https://linkedin.com/in/your-profile)\n\n---","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsk-jabed%2Ftaskwiz-client-side","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsk-jabed%2Ftaskwiz-client-side","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsk-jabed%2Ftaskwiz-client-side/lists"}