Self Javascript Project

Code Feedback
1

Made my first project with javascript from scratch. It was tough for a while, but after much googling, i present to you, my todo list.
Here
As much as i like it, i would like to know how well or bad i did on my js code structuring, and if there’s something i can improve on.

p.s The comments are mostly so i can know why i did what i did in case i forget something and look at it again in the future.

1 Like
2

Nice! I like that most of your functions are short and have descriptive names, and the comments are helpful. Some things that come to my mind:

  1. You named the variable that stores your <li> element “list” which was confusing to me. <li> is a list item, not a list. If I were you I’d rename that variable to something like “todoElement” or “listItem”.
  2. addList function can probably be broken up. You could factor out all the DOM-generating parts into a separate function, like generateTodoElement. Have that new function return a ready-made todo element, call it inside addList, and append the result to your list. This may require some additional restructuring of your code, but I think it’s worth it.
  3. You have multiple event listeners for the same type of event (click) and I think it may be more clean and efficient to combine them into one. Have the callback check event.target, and then do appropriate steps based on what it is. This is a good place to read more about this pattern.
  4. Personally, instead of listening for keypress event, I would wrap that input and button in a form, and listen for a submit event on it. This way I wouldn’t need some callback to be fired every time a user presses a key when typing, and instead only fire once (when user clicks the button or presses enter).

But that’s all, like, just my opinion, maan :slight_smile:

3

More than i was expecting, but i appreciate it honestly. I’ll keep working on it.
Thank you so much

1 Like
4

Good job! Next up, store your data in a store of data like MongoDB.

1 Like