TaskMate 🚀

Welcome to TaskMate, a sleek and efficient task management app designed to help you organize your tasks with ease. ✨

Features 🌟

• Add Tasks: Quickly jot down your tasks.
• Edit Tasks: Modify tasks as your priorities change.
• Delete Tasks: Remove individual tasks or clear all tasks with a single click.
• Persistent Storage: Tasks are saved in localStorage for a seamless user experience.
• Stylish UI: Tailwind CSS for beautiful styling and React Icons for intuitive icons.

Components 🛠️

1. Header 🏷️

• Description: This component displays the logo, the name of the app, and a welcome button.
• Purpose: Provide a welcoming entry point for the app.

2. AddTask 📝

• Description: This component includes a form that allows users to input new tasks. It also updates the task when the update button is clicked on an individual task.
• Purpose: Facilitate task creation and editing.

3. ShowTask 📊

• Description: This component displays a counter that tracks the total number of tasks and includes a "Clear All" button to remove all tasks.
• Purpose: Provide an overview of the number of tasks and an option to clear all tasks.

4. TaskBox.jsx 📦

• Description: This component creates a card for each task, displaying the task's description, date, and time. It also includes icons for deleting and updating tasks.
• Purpose: Visually present each task with relevant actions.

Installation 📥

To get started with TaskMate, follow these steps:

1. Clone the repository:

   git clone https://github.com/Ankit-Kum-ar/TaskMate.git

2. Navigate to the project directory:

   cd TaskMate

3. Install the dependencies:

   npm install

4. Start the development server:

   npm start

Usage 🖥️

1. Open your browser and navigate to http://localhost:3000.
2. Add your tasks using the input form.
3. Edit or delete tasks as needed.
4. View the total count of tasks and use the "Clear All" button to remove all tasks if required.

Technologies Used 🛠️

• React: JavaScript library for building user interfaces.
• Tailwind CSS: Utility-first CSS framework for styling.
• React Icons: Collection of popular icons as React components.
• localStorage: Web storage API for persisting data in the browser.

Screenshots 📸

Laptop View :

Mobile View :

Contributing 🤝

We welcome contributions to enhance TaskMate! To contribute, please follow these steps:

1. Fork the repository.
2. Create a new branch (git checkout -b feature/your-feature-name).
3. Commit your changes (git commit -m 'Add some feature').
4. Push to the branch (git push origin feature/your-feature-name).
5. Open a pull request.

License 📄

This project is licensed under the MIT License - see the LICENSE file for details.

---

Thank you for checking out TaskMate! We hope it helps you stay organized and productive. 🎉