Section 3: Customizing the Magento UI (10%)

Previous Section | Next Section

Section 3: Customizing the Magento UI (10%)

3.1 Demonstrate ability to utilize themes and template structure

Demonstrate the ability to customize the Magento UI using themes. When would you create a new theme? How do you define theme hierarchy for your project?

Demonstrate the ability to customize/debug templates using the template fallback process. How do you identify which exact theme file is used in different situations? How can you override native files?

3.2 Determine how to use blocks

Demonstrate an understanding of block architecture and its use in development. Which objects are accessible from the block? What is the typical block’s role?

Identify the stages in the lifecycle of a block. In what cases would you put your code in the `_prepareLayout()`, `_beforeToHtml()`, and `_toHtml()` methods? How would you use events fired in the abstract block?

Describe how blocks are rendered and cached.

Identify the uses of different types of blocks. When would you use non-template block types? In what situation should you use a template block or other block types?

3.3 Demonstrate ability to use layout and XML schema

Describe the elements of the Magento layout XML schema, including the major XML directives. How do you use "layout XML directives" in your customizations?

Describe how to create a new layout XML file.

Describe how to pass variables from layout to block.

3.4 Utilize JavaScript in Magento

Describe different types and uses of JavaScript modules. Which JavaScript modules are suited for which tasks?

Describe UI components. In which situation would you use UiComponent versus a regular JavaScript module?

Describe the use of `requirejs-config.js`, `x-magento-init`, and `data-mage-init`.