# Day 27: Project 4 - Task Management App

## Tasks/Activities:

### Activity 1: Setting Up the Project
- **Task 1:** Initialize a new project directory and set up the basic HTML structure for the task management app.
- **Task 2:** Add a basic CSS file to style the task management app, including a container for displaying tasks and a form for adding new tasks.

### Activity 2: Creating Tasks
- **Task 3:** Add a form to the HTML structure with fields for entering task details (e.g., title, description, due date). Style the form using CSS.
- **Task 4:** Write a script to handle form submission, creating a new task object and adding it to an array of tasks. Display the new task in the task list.

### Activity 3: Reading and Displaying Tasks
- **Task 5:** Write a function to iterate over the array of tasks and display each task in the task list. Include task details like title, description, and due date.
- **Task 6:** Style the task list using CSS to make it visually appealing.

### Activity 4: Updating Tasks
- **Task 7:** Add an "Edit" button to each task item in the task list. Write a function to populate the form with the task details when the "Edit" button is clicked.
- **Task 8:** Write a function to update the task object in the array and refresh the task list display after editing a task.

### Activity 5: Deleting Tasks
- **Task 9:** Add a "Delete" button to each task item in the task list. Write a function to remove the task from the array and refresh the task list display when the "Delete" button is clicked.
- **Task 10:** Add a confirmation dialog before deleting a task to prevent accidental deletions.

## Feature Request:
1. **Task Creation Script:** Write a script to handle form submission, creating new tasks and displaying them in the task list.
2. **Task Display Script:** Create a script to display tasks from the array in the task list, including task details and styling.
3. **Task Update Script:** Write a script to handle task editing, updating the task in the array and refreshing the display.
4. **Task Deletion Script:** Create a script to handle task deletion, removing the task from the array and refreshing the display with a confirmation dialog.

## Achievement:
By the end of these activities, students will:
- Set up a basic project structure with HTML and CSS.
- Implement task creation, reading, updating, and deletion functionalities.
- Handle form submission to create new tasks and display them in the task list.
- Update existing tasks and refresh the task list with edited task details.
- Delete tasks from the task list with a confirmation dialog to prevent accidental deletions.
- Style the task management app to make it visually appealing and user-friendly.
