Scribd
Upload
24 views3 pages

ToDoList Project Report

The To-Do List web application is a user-friendly tool for managing daily tasks, developed using HTML, CSS, and JavaScript. It allows users to add, mark, and delete tasks with a simple interface and is accessible on both mobile and desktop browsers. Future enhancements include task categories, localStorage for saving tasks, and potential cloud sync or backend integration.

Uploaded by

shuklapragati126
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
24 views3 pages

ToDoList Project Report

The To-Do List web application is a user-friendly tool for managing daily tasks, developed using HTML, CSS, and JavaScript. It allows users to add, mark, and delete tasks with a simple interface and is accessible on both mobile and desktop browsers. Future enhancements include task categories, localStorage for saving tasks, and potential cloud sync or backend integration.

Uploaded by

shuklapragati126
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

To-Do List Web App - Project Report

1. Title

To-Do List Web Application

2. Introduction

The 'To-Do List' web application is a simple project that helps users manage their daily tasks. It allows users

to add, mark, and delete tasks in a clean and user-friendly interface. The app is developed using HTML,

CSS, and JavaScript, and can be used directly in a web browser without any installation.

3. Objectives

- Create a simple and fast task manager.

- Learn and demonstrate web development skills.

- Build a fully functional static website using basic web technologies.

4. Technologies Used

- HTML - for structure and content of the web page.

- CSS - for styling and visual appearance.

- JavaScript - for dynamic behavior (adding, marking, and deleting tasks).

- Acode (Android) / VS Code (Desktop) - as code editors.

5. Features

- Add new tasks

- Mark tasks as done

- Delete tasks

- Simple, responsive UI

- Works on mobile and desktop browsers

6. Working
To-Do List Web App - Project Report

1. Enter task in input box.

2. Click 'Add' to add to the list.

3. Click task to toggle done status.

4. Click 'Delete' to remove it.

5. All logic handled by JavaScript.

7. Code Snippet

function addTask(task) {

const li = document.createElement('li');

const span = document.createElement('span');

span.textContent = task;

span.addEventListener('click', () => {

span.classList.toggle('done');

});

const delBtn = document.createElement('button');

delBtn.textContent = 'Delete';

delBtn.className = 'delBtn';

delBtn.addEventListener('click', () => {

taskList.removeChild(li);

});

li.appendChild(span);

li.appendChild(delBtn);

taskList.appendChild(li);

8. Conclusion

This project shows how basic web technologies can be used to build a useful app. It improves understanding

of DOM manipulation, JavaScript events, and UI design.


To-Do List Web App - Project Report

9. Future Enhancements

- Task categories

- Save tasks with localStorage

- Cloud sync or backend integration

You might also like