A clean, minimal todo app I built to practice vanilla JavaScript and localStorage. No frameworks, no libraries — just HTML, CSS, and JS.
- add tasks with a name, due date, and priority level
- mark tasks as done (or undo that)
- delete tasks you don't need anymore
- filter by status (active / done) or by priority
- everything saves automatically in the browser — no backend needed
- overdue tasks show a warning so you don't miss them
I wanted to get better at DOM manipulation and working with localStorage. Figured a todo app was the right scope — not too simple, not too complex. Also wanted to practice building something that actually looks decent without using any CSS framework.
Literally just open index.html in your browser. That's it.
No installs, no terminal, no server needed.
git clone https://github.com/amanay-codes/todo-app.git
cd todo-app
# open index.html in your browser
- dark theme with a yellow-green accent
- priority levels color-coded (red / orange / blue)
- tasks slide in when added
- stats bar at the top shows total / done / remaining
todo-app/
└── index.html # everything is in one file — HTML, CSS, and JS
Kept it in one file on purpose. Easier to share and understand when you're learning.
- drag to reorder tasks
- categories / tags
- dark/light mode toggle
- export tasks as a text file
- HTML5
- CSS3 (custom properties, grid, animations)
- vanilla JavaScript (no frameworks)
- localStorage for persistence
- Google Fonts (Syne + DM Mono)
made by amanay-codes