At the very beginning of our journey, back in Chapter 1, Understanding Magento Architecture, we mentioned how Magento consists of different areas. Developing for Magento admin implies developing for the adminhtml area. While the majority of code is applicable across different areas, there are certain subtle differences. Unlike frontend which is mostly built via HTML (.phtml, .html), the Magento adminhtml area is mostly built via UI components which are referenced, stacked, and configured through .xml files. This is not to say that the same components cannot be used both for frontend and admin, because all UI components can be configured for both of these areas; we just need to configure styles manually for components on the frontend.

There are two basic UI components in Magento: listing and form. The rest are secondary components, which serve as extensions...