Stylish To-Do List

This is a simple web-based To-Do App for student practice. It includes HTML, CSS, and a JavaScript stub for you to implement the main functionality.

Project Structure

• index.html — Main HTML file with the app layout
• styles.css — CSS file for styling the app
• script.js — JavaScript file with a function stub for adding tasks

Instructions

1. Open the project folder in VS Code.
2. Open script.js and implement the addTask function using the comments as a guide. Your function should:
   • Read the input value
   • Validate it (not empty)
   • Create a new list item with task text
   • Add complete and remove buttons
   • Add the item to the task list
   • Clear the input field
3. Style the app in styles.css if you want to customize the look and feel.
4. Open index.html in your browser to test your implementation.

Tips

• Use DOM methods like document.getElementById, document.createElement, and element.appendChild.
• Use event listeners for button actions.
• You can use the provided CSS or modify it to your liking.

Example Features

• Add tasks
• Mark tasks as completed
• Remove tasks

---

Happy coding!

Web6