DRY rule:

• In these parts, I declared the dynamic event listeners separately each time createList is executed:

  TO-DO-list/src/index.js

  Lines 46 to 48 in e84dbd5

  	createList();
  	addTask.value = '';
  	deleteSingleTask();

  TO-DO-list/src/index.js

  Lines 60 to 63 in e84dbd5

  	document.addEventListener('DOMContentLoaded', () => {
  	createList();
  	deleteSingleTask();
  	});

  TO-DO-list/src/index.js

  Lines 34 to 38 in e84dbd5

  	deleteList = [];
  	createList();
  	deleteSingleTask();
  	}

  Although this is not very notorious, it may lead to some loops and exponentially growing code whenever the first function is called, a great solution to the problem would be fixing the next method:

  TO-DO-list/src/index.js

  Lines 9 to 21 in e84dbd5

  	function deleteSingleTask() {
  	const deleteBtns = document.getElementsByClassName('delete-button');
  	const deleteBtnsArr = Array.from(deleteBtns);
  	deleteBtnsArr.forEach((el, i) => {
  	el.addEventListener('click', () => {
  	const deleteList = [];
  	deleteList.push(i);
  	deleteTask(deleteList);
  	el.parentElement.parentElement.remove();
  	});
  	});
  	}

  A great solution to the issue would be to, first, move the event listeners to the end of the createList declaration

  TO-DO-list/src/index.js

  Lines 10 to 14 in e84dbd5

  	const deleteBtns = document.getElementsByClassName('delete-button');
  	const deleteBtnsArr = Array.from(deleteBtns);
  	deleteBtnsArr.forEach((el, i) => {
  	el.addEventListener('click', () => {

  followed by the second step, importing the algorithms from another file, and calling them as a function inside the event listeners moved beforehand

  TO-DO-list/src/index.js

  Lines 15 to 18 in e84dbd5

  	const deleteList = [];
  	deleteList.push(i);
  	deleteTask(deleteList);
  	el.parentElement.parentElement.remove();

  This way, everything is more organized and functional, preventing bugs and reducing the propensity to elongate the code meaninglessly.

HTML best practices:

• You can always add your h1 tag inside a header tag whenever you don't have a navbar:

  TO-DO-list/src/index.html

  Lines 11 to 12 in e84dbd5

  	<h1 class="title">Today's To Do</h1>
  	<input type="text" id="addText" placeholder="Add to your list...">

What we can change

• More comments to provide more clarity on functions
• Separate DOM content with functions