articles

Home / DeveloperSection / Articles / Learn How to make a Component in Magento 2

Learn How to make a Component in Magento 2

Cao Quang11747 13-Mar-2017

Module is an integral part of a program which includes one or more routines. Component is a couple of parts or devices that can be used to construct a far more complex framework. In MVC software, all the controllers and models have their split folders. All data are combined mutually predicated on their functionalities and it is called Modules.


To add custom-made functionality to your Magento, custom component is required. In such a tutorial, I am going to teach you how to create a module in Magento 2.

Before creating the module, it's essential to understand the dissimilarities in directory composition between the two variants of Magento. Within the Magento 2 website directory structure, code pools are taken off the file framework. In Magento 1, you can create modules in app/code/local but in Magento 2 you can create a component in app/code.
To learn more about Magento 1 component, you can go to 'magebay.com'

Create Directories

To create a module in Magento 2, create the directories as shown below:


directory structure


Magenticians: Namespace of Module

Mymodule: Name of module.

Block: Contain PHP files

Controller: Controls the flow of application execution.

Index: Module controller name and it contains the action file.

Etc: Configuration file of module will be placed here.

Etc/Frontend: Router file will be placed here.

View/Frontend: Layout and Templates Folder will be created here.

View/Frontend/Layout: Contain XML file.

View/Frontend/Templates: Contain .phtml file.

Configuration of Module

Now configure your module. Create module.xml file in app/code/Magenticians/Mymodule/etc and put the following code in this file:

Registration of Module

Registration of Module is required. To do this, go to app/code/Magenticians/Mymodule and create registration.php. Put the following code in it:

To create controller class for each action, you have to create separate files for each. Now we will create Index.php file in app/code/Magenticians/Mymodule/Controller/Index. Put the following code in it:

Create Block

As the block contains PHP view classes, so now we will create Mymodule.php file in app/code/Magenticians/Mymodule/Block. Put the following code in it:

Frontend layout File

Create mymodule_indeindex.xml in app/code/Magenticians/Mymodule/view/frontend/layout. This (mymodule_indeindex.xml) file is a frontend layout file in which I will write title for this page and give the template file name in the Block class. Put the following code in it:

Frontend Template File

Now create a template file which will be used to call block function. Create mymodule.phtml in app/code/Magenticians/Mymodule/view/frontend/templates. Put the following code in it:

Module Activation

All done! Now just activate the module by running the commands in your Magento’s root directory:

1- Check the status of your module:

php bin/magento module:status

2- If your module is in the disabled list then just run this command to enable it otherwise move to step 3 :

php bin/magento module:enable Magenticians_Mymodule

3- Now upgrade the setup:

php bin/magento setup:upgrade

4- At last, clean the cache:

php bin/magento cache:clean

php bin/magento cache:flush

Launch the browser, enter your store URL , and add /mymodule or /mymodule/index/index at the end of URL.

Output

Final Words

Custom module must add custom operation to your Magento store. After third , tutorial you ought to be able to make a module in Magento 2. When you have any distress or want to add something to the tutorial, simply use the comment section below!

View more our product : https://productsdesignerpro.com/


Updated 27-Mar-2018

Leave Comment

Comments

Liked By