Todo App

A full-featured to-do list app built with HTML, CSS, and JavaScript as part of The Odin Project JavaScript course.

Features

• Create, edit, and delete tasks with a title, description, due date, and priority
• Organise tasks into custom projects, each with its own colour
• Inbox, Today, and Upcoming views for filtering tasks by due date
• Filter tasks by one or more projects at once
• Colour-coded priority labels (low, medium, high)
• Data persists between sessions using local storage
• Responsive, minimalist sidebar layout

Concepts Practised

• Separating data (Task, Project, Manager) from DOM rendering (domController)
• Factory-style classes for creating and editing tasks and projects
• Persisting and rehydrating application state with localStorage, rebuilding class instances from plain saved data
• Working with dates using date-fns
• Modular JavaScript bundled with webpack

Built With

• HTML
• CSS
• Vanilla JavaScript (ES modules, classes)
• date-fns for date handling
• Webpack for bundling and the dev server

Assignment

The Odin Project: Todo List