Build Your Own Todo List App
Learn to create a feature-rich Todo List application with JavaScript. This starter project guides you through building an interactive app with add, edit, search, and delete functionalities, plus a stylish dark mode.
Published on: 20/08/2024
π Project Overview
The To-Do List App is a simple and efficient web-based task manager that allows users to add, edit, delete, and search tasks. It features local storage for data persistence, a clean user interface, and a dark mode toggle for a better viewing experience.
β¨ Features
β Add Tasks β Quickly add new tasks.
β Edit Tasks β Modify existing tasks with ease.
β Search Tasks β Filter tasks instantly using keywords.
β Delete Tasks β Remove tasks when completed.
β Task Completion β Mark tasks as completed/incomplete.
β Dark Mode β Toggle between light and dark themes.
β Local Storage Support β Saves tasks automatically.
π₯ Installation
Follow these simple steps to set up the project:
- Clone the repository:
git clone https://github.com/nexoscreator/Web-Todo-List-Starter.git - Open
index.htmlin your browser. - Start managing your tasks instantlyβno additional setup required!
π― Usage
π Adding Tasks
- Enter a task description in the input field.
- Press Enter or click the βAdd Taskβ button.
βοΈ Editing Tasks
- Double-click on a task to edit it.
- Press Enter or click outside to save changes.
β Completing Tasks
- Click the checkbox next to a task to mark it as completed.
- Click again to uncheck it.
ποΈ Deleting Tasks
- Click the delete button (trash icon) to remove a task.
π Searching Tasks
- Use the search bar to filter tasks by keywords.
π Toggle Dark Mode
- Click the dark mode icon to switch between light and dark themes.
π€ Contributing
We β€οΈ contributions! Follow these steps to contribute:
- π΄ Fork the repository
- πΏ Create a new branch (
git checkout -b feature/AmazingFeature) - πΎ Commit your changes (
git commit -m 'Add some AmazingFeature') - π Push to the branch (
git push origin feature/AmazingFeature) - π Open a Pull Request
π See our Contribution Guidelines for more details.
π License
This project is licensed under the MIT License. See the LICENSE file for details.
π¬ Contact & Community
π¬ Join us on Discord: Click Here
π¦ Follow on Twitter: @nexoscreator
π§ Email: contact@nexoslabs.site
If you find this project helpful, please consider starring β the repository or sponsoring π on GitHub!
Created with β€οΈ by @nexoscreator