Event-driven development

Before we start talking about components, you need to understand how events and listeners work behind the scenes. The first thing you need to learn is the observable pattern.

Basically, the observable pattern is designed to allow entities or objects to communicate with each other using events. When a certain action occurs inside an object or component, this object should broadcast an event to whoever is listening.

For example, when a button is clicked on, it fires the click event. When a row of a grid is clicked on, the grid fires the itemclick event. All components have defined events and they are fired when an action occurs.

The component that is firing the event doesn't know who will listen to its messages, but its responsibility is to let others know that something has happened. Then, maybe other components will do something about it, or nothing at all.

The Ext.util.Observable base class allows us to add, fire, and listen to events from a specific object or component...