This is the first milestone of the testing part of the TODO app project it contains:

➡️ test file cmethods.test.js for the following functionalities :

      ➡️ editing a task description .
    
      ➡️Altering the state(completed) of a task and making sure the changes occues at the local storage level.
    
      ➡️ Altering the state of the checkbox of a task and making sure the state(completed) of the task changes at the local storage level.

This is the first milestone of the testing part of the TODO app project it contains:

➡️ test file crud.test.js for the following functionalities :

      ➡️ Adding a task to the list of todo tasks and a mocked version of the local storage.
    
      ➡️ Deleting tasks from the tasks array and the mocked local storage.
    
      ➡️ adding list elements to the DOM.

This is the last milestone of the TODO app project it contains:

➡️ Creating a new crud.js file that contains the following functions :

      ➡️ Adding a task to the list of todo tasks and reordering the indexes properties of the task object.
    
      ➡️ Deleting completed tasks function that also rearranges the indexes properties of the task object in 
           `window.localStorage` .
    
      ➡️ Updating the content of the task function when the list area is clicked and storing the new description in 
            `window.localStorage`.
    
      ➡️ Inline deleting functionality with `trash icon` when the updating event is triggered.  The deleted task is automatically 
             deleted from the local storage and the indexes are rearranged in  `window.localStorage`.

This is the second milestone of the TODO app project it contains:

➡️ Creating a new module methods.js containing a function to update the completed states of tasks depending on checkbox status and storing of updated data in LocalStorage.

➡️ Adding event listener to listen to changes in checkbox status inside the new module upon user desire to mark a task as completed.

➡️ Using Local Storage to retrieve and store user task's data upon page reload.

This is the first milestone of the TODO app project it contains:

➡️ Setting up the project using Webpack. ➡️ Creating Index.html file used as a template for Webpack using HTML Webpack plugin. ➡️ Creating an index.js file and setting an array of some simple to-do tasks (array of objects). Each task object contains three keys:

    ⚜️  description [string].
    ⚜️   completed [bool].
    ⚜️   index: [number].

➡️ Creating a function to populate the HTML with the list of tasks, the function is executed on page load. ➡️ Creating a style.css. CSS is loaded by Webpack Style/CSS Loader and the styling follows the following template.

Hi, @redwing555, Your project looks good. I was looking at it and I noticed you have a bug on methods.js

https://github.com/redwing555/todo-list/blob/ed2ba5ec516060208e1c799a2e2cd43e2b56999d/src/methods.js#L48

here you are getting the id by indexing into position 5. however once you have more than 10 tasks on the page that index will be wrong because it will only give you the first digit ( in this case 1) and will end up selecting the wrong task.

simplify these lines of code by giving the HTML element [...[...[...event.target.children][2].children][0].children][1] a descriptive variable name ex : trashcan , bin ... :

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/crud.js#L63-L64 https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/crud.js#L54-L55

Give this function the taskArr as a variable so It can be used whenever I need to update thelocalStorage provided the right array :

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/crud.js#L3-L6

call addTaskToStorage(taskArr) instead of localStorage.setItem('tasksList', JSON.stringify(taskArr)); in the following lines of code :

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/crud.js#L19-L31

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/crud.js#L33-L46

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/index.js#L74-L77

https://github.com/redwing555/todo-list/blob/ab9ced74c95408228904e0ed1f77fd2282045fdc/src/methods.js#L13-L15

Also export the addTaskToStorage function and import it in both methods.js and index.js