Adobe Commerce Front-End Developer Expert AD0-E720 Exam Questions

Page: 1 / 14
Total 50 questions
Question 1

An Adobe Commerce developer wants to initialize a JS component via Layout XML in custom reference block test. component. Which Layout XML instruction would be used to initialize this JS component?

A)

B)

C)



Answer : A

Option A is the correct way to initialize a JS component via Layout XML in a custom reference block. The x-magento-init tag is used to specify the component name and the options. Option B is incorrect because it uses the data-mage-init attribute, which is only valid for HTML elements. Option C is incorrect because it uses the x-magento-component tag, which is deprecated and should not be used.

https://developer.adobe.com/commerce/frontend-core/

https://experienceleague.adobe.com/docs/certification/program/technical-certifications/ac/ac-expert/ac-e-fedeveloper0623.html?lang=en


Question 2

An Adobe Commerce developer wants to determine which template is rendering a specific element on the storefront. Which two methods can they use to turn on template hints? (Choose two.)



Answer : A, D

Template hints are a useful tool for frontend developers to determine which template is rendering a specific element on the storefront. Template hints can be turned on using either of these two methods:

In the Admin Panel, navigate to Stores > Configuration > Advanced > Developer > Debug. Set Enabled Template Path Hints for Storefront to Yes

On the command line, run the command; php bin/magento dev:template-hints:enable The other two options are incorrect because they do not exist as valid methods to turn on template hints. Reference:Adobe Commerce Developer Documentation,Adobe Inc.


Question 3

An Adobe Commerce developer is customizing buttons for a custom theme that inherits Magento/blank theme and needs to override the default values. Where would the default values for the buttons be located?



Answer : A

To find the default values for the buttons, the developer needs to look at the lib/web/css/source/lib/_buttons.less file. This file contains various variables, mixins, and styles for defining and customizing buttons. The developer can override these values in their custom theme by using the .lib-button() mixin or by creating their own mixins or classes. For example:

.lib-button( @_button-selector, @_button-type, @_button-shape, @_button-color, @_button-background, @_button-border, @_button-text-transform, @_button-box-shadow, @_button-hover-color, @_button-hover-background, @_button-hover-border, @_button-hover-box-shadow );

The lib/web/less/source/lib/_buttons.less and lib/web/css/source/lib/_button.less files are not valid and do not exist. Reference: [Buttons], [Magento UI library]


Question 4

An Adobe Commerce developer was asked to customize a JavaScript component which is written as a function. How would the developer extend the native JavaScript function?

A)

B)

C)



Answer : A

To customize a JavaScript component that is written as a function, the developer can use option A. This option will use the prototype property of the function to extend its functionality and add new methods or properties. For example:

function Component() { // Component logic }

Component.prototype.customMethod = function() { // Custom method logic };

This will create a new method called customMethod on the prototype of the Component function, which can be accessed by any instance of the Component object. The developer can also override existing methods or properties on the prototype by reassigning them with new values.

Option B is not correct because it will not extend the native JavaScript function, but create a new function that wraps the original function. This will not allow the developer to access or modify the properties or methods of the original function. Option C is not correct because it will not extend the native JavaScript function, but create a new object that inherits from the original function. This will not allow the developer to customize the original function itself, but only its instances.


Question 5

An Adobe Commerce developer wants to remove the default Wishlist and Compare Products blocks on a category page with layered navigation Where would this modification be placed, assuming the developer only wants to make this change?



Answer : B

To remove the default Wishlist and Compare Products blocks on a category page with layered navigation, the developer should place the modification in the app/design/frontend/Vendor/Theme/Magento_LayeredNavigation/layout/catalog_category_view_type_layered.xml file. This file is specific to the category pages with layered navigation and will override the default layout file from the Magento_LayeredNavigation module. The modification should use the <referenceBlock> tag with the name attribute specifying the name of the block and the remove attribute set to true. For example:

<referenceBlock name=''catalog.compare.sidebar'' remove=''true''/> <referenceBlock name=''wishlist_sidebar'' remove=''true''/>

The app/design/frontend/Vendor/Theme/Magento_LayeredNavigation/layout/override/catalog_category_view_type_layered.xml file is not valid and will not work, as it is not a valid override path. The app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_category_view.xml file is not specific to the category pages with layered navigation and will affect all category pages. Reference: [Layout override], [Remove an element]


Question 6

An Adobe Commerce developer needs to create translations for the Orange/custom theme. Which directory would the developer place the translations?



Answer : C

To create translations for a theme, the developer needs to place the translation files in the il8n directory of the theme. The translation files should have the format <language code>_<country code>.csv, such as en_US.csv or fr_FR.csv. The etc and translations directories are not used for storing translation files. Reference: [Translations overview], [Translate theme strings]


Question 7

An Adobe Commerce developer wants to create a new theme Vendor_Orange which extends from MagentoMum

a. Which file is responsible for specifying the parent theme?



Answer : C

The theme.xml file is responsible for specifying the parent theme of a custom theme. The file should contain the element with the value of the parent theme's directory, such as MagentoMuma. The view.xml file is used to configure the theme's images, fonts, and layout. The registration.php file is used to register the theme in the system. Reference: [Create a theme], [theme.xml]


Page:    1 / 14   
Total 50 questions