This Task Manager Application is a React-based project that allows users to add, delete, and view tasks. It leverages key React concepts such as state, props, forms, lifecycle hooks, controlled and uncontrolled components, event handling, code splitting, and Redux for global state management.
- Add new tasks to the task list
- Delete tasks from the task list
- Task state management using Redux
- Responsive design for mobile and desktop
- Lazy loading of task components using
React.lazy()
andSuspense
- Controlled and uncontrolled forms for handling user input
- Simple and clean UI with a sticky responsive navbar
- React: Frontend UI library
- Redux: For global state management
- React-Redux: Integrating Redux with React
- React Router: For page navigation (if added later)
- CSS: For styling and responsiveness
To run this project locally, follow these steps:
-
Clone this repository:
git clone https://github.com/your-username/task-manager.git
-
Navigate to the project directory:
cd task-manager
-
Install dependencies:
npm install
-
Start the development server:
npm start
-
Open your browser and navigate to
http://localhost:3000/
.
- Add Task: Enter the task name and optional description in the input fields, then click the Add Task button.
- Delete Task: Click the Delete button next to each task to remove it from the list.
- The app includes basic styling to ensure a clean and user-friendly interface.
- The application is fully responsive, ensuring compatibility across all device sizes.
- The Navbar is styled to be sticky and remains visible at the top while scrolling.
- The task list component is loaded lazily using
React.lazy()
andSuspense
for optimized performance.
- Redux is used to handle global state, with actions for adding and deleting tasks.
Feel free to fork this project and make your own modifications! Pull requests are welcome for any enhancements or bug fixes.
This project is licensed under the MIT License.