Summary
Attaching event listeners to elements using addEventListener so that callback functions run in response to specific user interactions (e.g., clicks or input), allowing code to act and print data when those events occur.

General domain of usage
Interactive web applications


Web pages become interactive when JavaScript responds to user actions like clicks or typing.

To handle user actions, use the `addEventListener()` method.

```js
const button = document.querySelector(".btn");

button.addEventListener("click", () => {
  console.log("Button clicked");
});
```

When the button is clicked, the function runs.

Common events:

* `"click"`: when an element is clicked;
* `"input"`: when a user types in a field;
* `"submit"`: when a form is submitted.

Example with user input:

```js
const input = document.querySelector("input");

input.addEventListener("input", () => {
  console.log(input.value);
});
```

JavaScript listens for events and runs code in response, which makes web pages interactive.



Learn how to write JavaScript to control behavior in web applications. Work with variables, conditions, functions, arrays, and objects to build and organize logic. Handle user interactions, update content in the browser, and work with asynchronous code using promises and APIs. Prepare for building dynamic interfaces with Vue.js by understanding how data and logic drive UI.

Responding to User Events