Todo app

Thankz for such an Explantion..!!!✨ Surely Implimenting this Thought in code..

Hi Adarsh,

Your app looks amazing, without bugs and has great animations, well done !

I have one feedback for you when I forked your project and looked at your script.js file. It is quite long and not very readable, especially the main function. What you can do is you can extract some code inside your function to another smaller function. Example : Instead of :

function main() {
   code...
   code.. 
   code..
}

You can write as :

function main() {
   function1()
   function2()
   function3()
}

This is more readable for the one who will read your code (your co-workers) and cleaner as it follow the principle of one function should only do one thing and one thing only. Also, make sure your function name is meaningful so others can understand its job in one glance.

Secondly, you can further improve your code by separating your code into several files, grouping similar functions and variables inside a file and making use of import and export statements.

For example you can split into three files : script.js for storing your global variables and main function, addTodo.js for adding todo and utils.js for other functions. Then, you can export function to be available in another file. For example :

Firstly, you need to make change to your HTML file, add type="module" to your link to script.js file. This will make your JS files able to import and export function and variables to each other.

For example :

// addTodo.js
export function addTodo() {
  …doAwesomeThings()
}

// main.js
import { addTodo} from “./addTodo.js”

function main() {
...code...
addTodo()
...code...
}

You can do this for every other function and group similar functions in one js file.

Just reply me if something is not working.

Hope it helps and good luck Adarsh!