What Are Custom Events?
A custom event is a user-defined DOM event you create and dispatch in your application. Once you dispatch a custom event, you can listen for it just like any other DOM event using addEventListener. This makes it easy for any part of your app to react—regardless of who fired it or where. Use them when built-in events (like click, submit, etc.) are too limiting or when you want to broadcast state changes across components or even separate apps loaded onto the same website.
