A beginner-friendly Todo List application built using HTML5 and Vanilla JavaScript. Users can add new tasks and remove existing ones dynamically without reloading the page.
This project was created while learning JavaScript fundamentals, focusing on DOM manipulation, event handling, and dynamic element creation.
- ➕ Add new tasks
- 🗑️ Delete existing tasks
- ⚡ Dynamic DOM manipulation
- 🎯 Event Delegation
- 🚀 Instant UI updates
- 💻 Beginner-friendly project
- HTML5
- JavaScript (ES6)
- DOM Selection
- Event Listeners
- Event Delegation
- Creating Elements
- Appending Elements
- Removing Elements
- Parent & Child Nodes
- User Input Handling
- Dynamic UI Updates
javascript-todo-app/
│
├── index.html
├── app.js
└── README.md
- Clone this repository.
git clone https://github.com/amitx231/javascript-todo-app.git-
Open the project folder.
-
Open
index.htmlin your browser.
While building this project, I practiced:
- Working with the DOM
- Handling user events
- Creating HTML elements dynamically
- Event Delegation
- Managing lists using JavaScript
- Updating the UI without refreshing the page
- ✅ Mark tasks as completed
- ✅ Edit existing tasks
- ✅ Save tasks using Local Storage
- ✅ Add task counter
- ✅ Delete all tasks
- ✅ Dark Mode
- ✅ Keyboard support (Press Enter to add task)
Amit Chauhan
If you found this project helpful, feel free to ⭐ this repository.