Skip to content

This To-Do List app lets you easily add, complete, and delete tasks. Built with HTML, CSS, and JavaScript, it uses Local Storage to save your tasks so they stay even after refreshing the page. A great project to practice JavaScript and front-end skills!

Notifications You must be signed in to change notification settings

codebyheera/Todo-List-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

5 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ“ My TO-DO List App

Welcome to My TO-DO List, a sleek and intuitive to-do app built using HTML, CSS, and JavaScript. This app allows you to manage your daily tasks with ease β€” add new ones, mark them as completed, or delete them. Best of all, it uses Local Storage to make sure your tasks are saved even after refreshing or closing the browser tab!


πŸš€ Features

  • βœ… Add Tasks
    Easily add new tasks to your list by typing in the input box and clicking Add.

  • βœ… Mark as Complete
    Click the βœ… checkmark to strike through completed tasks for better organization.

  • ❌ Delete Tasks
    Remove any task instantly by clicking the ❌ delete button.

  • πŸ’Ύ Local Storage Support
    All tasks are automatically saved in your browser’s local storage, so nothing gets lost on refresh.

  • 🎨 Modern & Clean UI
    A visually appealing, user-friendly interface built with pure HTML and CSS.

  • ⚑ Instant Interactivity
    Real-time task management using vanilla JavaScript with no external libraries.


πŸ–ΌοΈ Screenshot

image

πŸ›  Tech Stack

  • HTML5 – App structure and content
  • CSS3 – Styling and layout
  • JavaScript (ES6) – Dynamic interactivity and logic
  • LocalStorage API – To persist tasks in the browser

πŸ“¦ How to Use

Follow these simple steps to run the app locally:

πŸ”§ Manual Setup

  1. Download or clone this repository:
    git clone https://github.com/codebyheera/Todo-List-App.git
    

🌐 Optional: Run with a Live Server (Recommended)

For a smoother development and testing experience, you can run the app on a local web server:

  • If you use VS Code, install the Live Server extension.
  • Open the project folder in VS Code.
  • Right-click the index.html file and select Open with Live Server.
  • The app will open in your browser with live reload support, so any changes you make will update instantly.

πŸ‘€ Author ~ Muhammad Subhan Naeem
Built with ❀️ by Heera | github.com/codebyheera

About

This To-Do List app lets you easily add, complete, and delete tasks. Built with HTML, CSS, and JavaScript, it uses Local Storage to save your tasks so they stay even after refreshing the page. A great project to practice JavaScript and front-end skills!

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published