Go back
- The code fetches all todos from a mock API using the `getTodos` function.
- It adds a new todo item to the API using the `addTodo` function when the user clicks the add button.
- It updates the status of a todo item in the API using the `updateTodo` function when the user checks or unchecks the checkbox associated with the todo item.
- It deletes a todo item from the API using the `deleteTodo` function when the user clicks the delete button associated with the todo item.
- Upon page load (`DOMContentLoaded` event), it fills the todo list with the fetched todos using the `fillTodoList` function.
- The `createLI` function creates a new list item (li element) for each todo item, including a checkbox for the todo status, text for the todo description, and a delete button.
- This version fetches all todos from the API after adding the new todo to determine its ID (const todosId = allTodos.length).
- Advantage: Let the API auto-generate id, similar to version 1, but avoiding rebuilding the li element.
- Consideration: There's a possibility of inconsistency if other changes occur to the todos on the server between adding the new todo and fetching all todos again to determine its ID.