https://github.com/chanbadsha/taskflow
askFlow is a task management web application built with React. It provides an intuitive interface for users to create, edit, and organize tasks. The app supports drag-and-drop functionality, real-time updates with Firebase, and smooth interactions with React Query for efficient data handling.
https://github.com/chanbadsha/taskflow
firebase mongodb
Last synced: 2 months ago
JSON representation
askFlow is a task management web application built with React. It provides an intuitive interface for users to create, edit, and organize tasks. The app supports drag-and-drop functionality, real-time updates with Firebase, and smooth interactions with React Query for efficient data handling.
- Host: GitHub
- URL: https://github.com/chanbadsha/taskflow
- Owner: Chanbadsha
- Created: 2025-02-19T17:35:10.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-22T00:00:28.000Z (over 1 year ago)
- Last Synced: 2025-10-28T09:30:07.942Z (9 months ago)
- Topics: firebase, mongodb
- Language: JavaScript
- Homepage: https://taskflowtodo.netlify.app/
- Size: 657 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# TaskFlow - A To-Do List Application
TaskFlow is a powerful and intuitive To-Do List application designed to help you stay organized and manage your daily tasks effectively. With drag-and-drop functionality, seamless integration with Firebase for real-time data sync, and user-friendly design, TaskFlow is the perfect tool for managing your tasks.
## Live Link
[Visit TaskFlow Live](https://taskflowtodo.netlify.app)
## Features
- **Task Creation:** Easily add new tasks with simple forms.
- **Drag-and-Drop:** Organize tasks by dragging and dropping them into different categories.
- **Task Editing:** Update or delete tasks with ease.
- **Real-Time Sync:** Changes are instantly reflected across all devices with Firebase integration.
- **Notifications:** Receive real-time notifications when tasks are added or updated.
## Technologies Used
- **React.js:** For building the user interface.
- **Vite:** A fast development environment.
- **Tailwind CSS:** Utility-first CSS framework for responsive design.
- **Firebase:** Real-time database and authentication service.
- **React Router:** For handling navigation.
- **React Query:** For data fetching and state management.
- **SweetAlert2:** For beautiful alerts and notifications.
- **React Modal:** For easy modal implementation.
- **React Icons:** To add beautiful and scalable icons to the app.
- **React Hook Form:** For handling form inputs efficiently.
- **Axios:** For making HTTP requests.
## Installation
Follow these steps to get your development environment set up:
1. Clone the repository:
```bash
git clone https://github.com/Chanbadsha/TaskFlow.git
```
2. Navigate into the project directory:
```bash
cd taskflow
```
3. Install the dependencies:
```bash
npm install
```
4. Set up Firebase in the `firebase.js` file (make sure to replace it with your Firebase credentials).
5. Run the app in development mode:
```bash
npm run dev
```
6. Open the app in your browser at [http://localhost:3000](http://localhost:3000).
## Dependencies
### Main Dependencies
- `@headlessui/react`: Utility components for headless UI elements.
- `@hello-pangea/dnd`: Drag-and-drop support for React.
- `@tailwindcss/vite`: Tailwind CSS integration for Vite.
- `@tanstack/react-query`: Powerful data fetching and caching for React.
- `axios`: Promise-based HTTP client for the browser and Node.js.
- `date-fns`: A lightweight library for manipulating dates.
- `firebase`: Firebase SDK for authentication and real-time database.
- `moment`: JavaScript library for parsing, validating, and formatting dates.
- `react`: The core React library.
- `react-dom`: Provides DOM-specific methods for React.
- `react-hook-form`: A library for managing forms in React.
- `react-hot-toast`: React notifications for notifications.
- `react-icons`: Collection of customizable icons for React.
- `react-modal`: Accessible modal dialogs for React.
- `react-router`: Declarative routing for React.
- `react-spinners`: A collection of loading spinners for React.
- `sweetalert2`: Beautiful, responsive, and customizable popups.
- `tailwindcss`: A utility-first CSS framework.
### Development Dependencies
- `eslint`: JavaScript linter for catching issues.
- `vite`: Build tool for faster development.
- `daisyui`: Tailwind plugin for UI components.
## How to Contribute
Feel free to fork the repository, make changes, and create pull requests. We welcome contributions to enhance the functionality and improve the user experience of TaskFlow.
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.