Arrow Functions in JavaScript

React apps rely heavily on arrow functions for event handling and logic. These functions keep your code concise and readable.

In this app, you use functions like:

const addTodo = () => { ... }

const deleteTodo = (index) => { ... }

They’re passed into JSX elements like buttons or checkboxes using event listeners:

<button onClick={addTodo}>Add</button>

Here’s what happens:

• When the user clicks the button, addTodo runs.
• React calls your function and updates the app’s state (and UI).

The same applies for:

• onChange (used for input fields)
• onClick (used for buttons)
• onCheckboxChange (used to toggle tasks)

This is how user interaction turns into visible changes on the page.