𝗗𝗮𝘆 𝟮𝟯: 𝗟𝗲𝗮𝗿𝗻𝗶𝗻𝗴 𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸

𝗗𝗮𝘆 𝟮𝟯: 𝗟𝗲𝗮𝗿𝗻𝗶𝗻𝗴 𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸

I finished Lecture 8 on JavaScript. I studied Event Listeners and the Event Object.

Standard event handlers overwrite previous code. Event listeners solve this.

Key concepts:

• The Event Object: The browser passes an object called e or evt.

• e.type: shows the event type.

• e.target: shows the element triggering the action.

• addEventListener: you listen for actions. You add multiple listeners to one element.

• removeEventListener: you stop the listener. You must store the function in a variable to remove it.

I built a Dark Mode toggle.

• Created a button.
• Added a click listener.
• Tracked state in a variable.
• Used classList to swap CSS classes.

The UI shifts from white to dark with one click.

I finished the DOM and Event lectures. Tomorrow I build a standalone mini-project using HTML, CSS, and vanilla JavaScript.

Do you use CSS classes or inline styles for theme toggles?

Source: https://dev.to/ali_hamza_589ec7b3eb6688d/day-23-of-leaning-mern-stack-5f8k