React App

Project description:

As part of a learning workshop, I developed a design and layout proposal using React, to apply and consolidate the knowledge acquired. To take the project beyond the basic functionalities offered in the course, I expanded the application with additional features such as advanced filters, editing options, a visually attractive and highly functional design, and incorporating Tailwind into the project to facilitate the layout.

—

The result is ToDo Bien, a task list application designed to help you efficiently organize your daily tasks. This project focuses on providing an intuitive and easy-to-use interface, with the following key features:

• Priority Management: Assign priorities to your tasks and visualize them. Advanced Filters and Search: Filter and search your tasks by priority and completion status. Editing Functionality: Edit your tasks, including their text and priority, directly from the application.

• User-Friendly Interface: Enjoy a smooth user experience with a modern and functional design. Features

• Priority Order: Classify your tasks into different levels of importance. Completed and Incomplete Filter: Combine filters with priorities to easily find your tasks.

• Keyword Search: Quickly search for tasks using keywords. Editing Functionality: Modify the content and priority of existing tasks. Responsive Interface: Optimized to work on mobile and desktop devices.

¿What did I learn in this project?

• State Management in React: I learned how to manage task state and editing using React context and hooks like useState and useContext.
• Implementation of Advanced Features: I developed the ability to add, edit, and filter tasks, allowing me to implement complex functionalities such as priority management.
• User Interface Design: I worked on creating an intuitive and attractive user interface using Tailwind CSS, applying modern and responsive design techniques.
• Form Handling in React: I improved my skills in creating and managing forms, including validation and error handling, to ensure a good user experience.
• Use of Local Storage: I implemented data persistence using localStorage so that tasks would remain even after closing the browser, allowing me to work with browser storage.
• Web Application Deployment: I learned how to prepare my application for deployment and use tools like GitHub Pages to deploy in a live environment.