Hello welcome to Funky technologies, Its Part 7 of Fundamentals of Magento 2 development from scratch.
Today we will learn how to add view on a module of magento 2
Dependency injection is a way to retrieve objects. In this process, classes receive objects they depend on as constructor arguments.
In Magento 2, the object manager is responsible for creating all objects a class requires.
Dependency injection (di) and object manager are complex topic. We will cover its details some other time as it is not our today’s focus.
Note: Please do not confuse dependency injection with module decency (which usually means a module is loaded after another module )
Today our goal is to render a string “Hello world” on a view page. So actually we are going to render HTTP response. In magento 2 its controller functionality to tells system that “render Http response”.
As we know in controllers there is only one entry point which in execute() method. So in execute() method we need an instance of “MagentoFrameworkViewResultPageFactory” class, because in magento 2 “PageFactory” is class which is responsible to create page. So here we will use Dependency Injection. Means we have to add __construct() method here, how will override the __construct() method of controller’s base class.
Due to the overriding of __construct() function. Now we need call to patent’s __construct() function inside current controller’s construct() to make sure proper working of base class.
So know we also have to inject “MagentoFrameworkViewResultPageFactory” class instance in our constructor due to the fact that base class’s __construct() takes this class’s instance in its constructor.
Now, its time to add layout xml file in module. Layout XML is a tool to build pages of magento 2. Simply we can say that Layout XML files tells Magento rendering system which elements should be on a page (topology).
There are two main stages in working with the layout XML:
Create the page content structure (create a logical page content structure)
Render the structure (generate the HTML output)
The whole idea of the layout XML is to define the logical page structure. Once all the layout XML instructions from all the modules have been processed, the result is rendered and sent to the browser for display.
Structure of layout xml file:
Class: Class of the block object
Template: Template of the block
Name: Unique name which globally identify the name of block
With layout handles or update handles Magento view knows which layout XML instructions to process for a given request.
A “layout handle” is sort of like an event or notify for the Page Layout System. Certain handles “fire” on each page.
Page-specific action handles
Page-specific content is associated with a page, using the action handle specific to the request.
Action handles is the combination of route, ActionPath and action name in lower case, separated by underscore(_) e.g. route_ActionPath_action.xml
In our case it will be funky_path_helloworld.xml
Now its time to create block class, A block is a class that calls a template and provides data to that template. Blocks often instantiate models, which then can query databases, and so on. Blocks is a complex topic, it is impossible to discuss, study all of its accepts in one tutorial even, we will discuss blocks in later videos. For you only have to understand that:
Every block class extends a base class “MagentoFrameworkViewElementTemplate”. A block will render its HTML is its template property, we already sets is its template property to “blockcontent.phtml”.
Every block Class must implements _prepareLayout() method. _prepareLayout() specific method that is executed when a block is created. It is often re-declared in a specific block and contains certain init operations.
Blocks are located inside “Blocks” folder of a module. In our case it will be Funky/Hello/Block/BlockFile.php
Now in this step, we have to create a template (.phtml) file. Templates are snippets of phtml code that contain PHP elements, such as instructions, variables, and calls for class methods.
Location: template files located inside view folder of a module. e.g module dir/view/area/file.phtml
In our case it will be Funky/Hello/view/view/blockContent.phtml
Run/test your module.
In Magento 2 an url composed of magento dir/frontName/actionPath/action
So in our case to test module hit url:
mage2: magento installation directory
funky: frontName of the module.
path: ActionPath connected to the Controller folder
HelloWorld: php class of action or controller