Time Tracking Dashboard

Community feedback

• 

  Devmor•470

  @devmor-jPosted over 2 years ago

  Hey! This looks identical and you did a great job 🎉.

  If this helps and you like other's opinions then there's one little tip that makes this project more maintainable and that basicly is to use data-[...] on html elements that are accessed in your javascript.

  For example in this project you used <li> tags with no other specifications and later on if someone adds another <li> tag then this code might break:

  ...
  const interval = document.querySelectorAll("li");
  
  interval[1].classList.add("current");
  interval.forEach((e) => {
    e.addEventListener("click", () => {
    ...
  

  If we apply the practice we discussed above then in index.html we could write like so:

  <ul>
    <li data-interval>Daily</li>
    <li data-interval>Weekly</li>
    <li data-interval>Monthly</li>
   </ul>
  

  therefore js would become:

  const interval = document.querySelectorAll("[data-interval]");
  

  You get the idea and this was just my opinion, As I said overall this is a really good and minimal solution. Cheers 😃

  Marked as helpful

  1

  ---

  

  Obinna Achazie•650

  @acha-jrPosted over 2 years ago

  @devmor-j Thanks for the feedback, that's correct and I understand completely. I actually used the <li> only because they were the only ones so as to not fatten the html.

  Thanks for the commendation too 😊 👍🏾

  1