Todo Trail

Todo Trail is a user-friendly task management app designed to empower your productivity journey.
Prioritize, organize, and elevate your productivity with Todo Trail!

Built With

Features

• Prioritization
     Add priority labels to todos and easily recognize important todos

• Projects
     Create projects to keep related todos together
  

• Project Background
     Choose a background image you like for your project
  

• High Priority Tasks Count
     Easily identify projects with more number of high priority todos
  

• Simple UI
     A simple, easy-to-use yet modern UI
  

Roadmap

• Implement user authentication functionality
• Display a background image along with a message when there's no todo/project to display
• Display message when the required input fields are empty
• Sorting functionality to allow users to sort the todos according to the priority
• Reordering todos functionality to allow users to reorder the todos
• Dark mode

Known Issues

• Shared data, making it accessible to everyone to view the projects/todos
• Duplicate project titles leading to unexpected behavior

Learnings

• new array method: flat()
• got familiar with date-fns and uuid libraries
• event propagation (ended up not using e.stopPropagation() though!!)
• first time used a data attribute 😅 and that too setting it with javascript.
• e.currentTarget (It always refers to the element to which the event handler has been attached, as opposed to e.target, which identifies the element on which the event occurred and which may be its descendant)
• adding tooltips
• strengthen my grid skills

Preview

Todos

Projects

Demo

👉 Live Demo

Created as a part of TheOdinProject 💜