To-Do List App

A personal to-do list web app built with HTML, CSS, and vanilla JavaScript

Features

• Create new tasks with:
  • title
  • due date
  • category
  • description
• Edit existing tasks
• Mark tasks as completed
• Move completed tasks into the finished section
• Open a task details panel
• Delete tasks
• Persist tasks in localStorage
• Close the modal with Escape

Project Structure

css/
  global.css
  index.css
  sidebar.css
  dashboard.css
  task-details.css
  task-modal.css

scripts/
  constants.js
  state.js
  tasks.js
  render.js
  modal.js
  storage.js
  main.js

index.html

How To Run

1. Clone the repository:

git clone https://github.com/Tafik2500/to-do-list.git

2. Open the project folder.
3. Run it with a local server.

Examples:

npx serve

or

python -m http.server

4. Open the local URL in your browser.

Tech Stack

• HTML5
• CSS3
• Vanilla JavaScript
• localStorage for persistence

Notes

• This project uses JavaScript modules, so it should be opened through a local server instead of directly via file://.

Repository

GitHub: https://github.com/Tafik2500/to-do-list