I am going to create simple custom module in magento2. This module will be used magento’s block, layout, template and router section. I will be explaining these section one by one but not briefly. But you will be getting the basic understanding on magento’s module with creating simple custom module in magento2 with router as well as accessing template file from block or layout.If you are a magento1 developer then there is no issue to understand this tutorial, because this most of all logic of magento1 is similar to magento2 . But if you are not then you must have knowledge on MVC.

So before starting any developement we need to check two things in magento2.

1: Disable magento2’s cache

navigate : backend => system => cache management => select all cahce type => disable them

2: set magento mode into developer mode

In developer mode you will be getting the benefit of getting all errors that magento through.
command: php bin/magento deploy:mode:set developer

Magento1 has code pool concept but in magento2 that has been removed. Here modules are grouped by namespaces and placed directly in app/code folder.

Module creations step:

Step1:

All modules names divided into two parts 1: namespace 2: actual module name. Let take example of creating our module “JRB_HelloWorld“. Here we will divide our module “JRB_HelloWorld” into two parts

  1. namespace: JRB
  2. actual module name: HelloWorld

so depending upon that we will create folder like app/code/JRB/HelloWorld and all folder belongs to this module will be placed inside this folder app/code/JRB/HelloWorld.

Step2:

We need to declare our module by module.xml file. So lets create and declare inside app/code/JRB/HelloWorld/etc/module.xml

Config.xml:

<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="JRB_HelloWorld" schema_version="1.0.0" setup_version="1.0.0">
    </module>
</config>

Step3:

Include our module into magento2’s autoload class by registration.php file. So lets create registration.php inside the folder app/code/JRB/HelloWorld/

registration.php

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'JRB_HelloWorld',
    __DIR__
);

Step4:

Now empty module has been created and if you run the command: php bin/magento module:status.
you could see list disable modules. From those list our module will be also there. So for enabling our module just run the command: php bin/magento module: JRB_HelloWorld

after doing all these process, you need to run php bin/magento setup:upgrade

after upgrading you will be getting our custom module in backend with enable status. Navigate to see : admin => store => configuration => advanced => disable module output

Step5:

First we need to add router. To do this we need to create routes.xml file in the folder app/code/JRB/HelloWorld/etc/frontend (frontend : for frontend , adminhtml : for admi side controller)

routes.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="standard">
        <route id="helloworld" frontName="helloworld">
            <module name="JRB_HelloWorld" />
        </route>
    </router>
</config>

here we saw frontend router with router id helloworld. So as similar to magento1, magento2 has the frontName as first part of URL.

<frontName>/<controle_folder_name>/<controller_class_name>

so for our example final URL will be looking like this: http://example.com/helloworld/index/index/

helloworld/index/index/

  • helloworld: frontName
  • index: controller
  • index: controller class

Now we need to create Index.php controller file having below code.

<?php
 
namespace JRB\Helloworld\Controller\Index;
 
use Magento\Framework\App\Action\Context;
 
class Index extends \Magento\Framework\App\Action\Action
{
    protected $_resultPageFactory;
 
    public function __construct(
        Context $context, 
        \Magento\Framework\View\Result\PageFactory $resultPageFactory
    ){
        $this->_resultPageFactory = $resultPageFactory;
        parent::__construct($context);
    }
 
    public function execute()
    {
        $resultPage = $this->_resultPageFactory->create();
        return $resultPage;
    }
}

In magento1 each controller has multiple action but in magento2 each action has its own class which implements execute methods.

Now we created a simple module in magento which has just contained router and for block we need to go for step6;

step6:

we will create simple block class with getHelloWorldTxt method which will return “My first modules with “hello world” .
create a Helloworld.php class inside the folder app/code/JRB/HelloWorld/Block/

Helloworld.php

<?php
namespace JRB\Helloworld\Block;
 
class Helloworld extends \Magento\Framework\View\Element\Template
{
    public function getHelloWorldTxt()
    {
        return 'My first modules with "hello world"';
    }
}

step7:

In step7 we will create layout and template to display our out put to user. So layout files and template are placed in view folder of each module. Inside view folder we can have three sub folder

  1. adminhtml (for admin)
  2. base (for both frontend and admin)
  3. frontend (for frontend)

first we will create helloworld_index_index.xml file inside the folder app/code/JRB/HelloWorld/view/frontend/layout/ with following code

<?xml version="1.0" encoding="UTF-8"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd" layout="1column">
    <body>
        <referenceContainer name="content">
            <block class="Magento\Framework\View\Element\Template" name="helloworld" template="JRB_HelloWorld::helloworld.phtml" />
        </referenceContainer>
    </body>
</page>

Each layout has a handle(“helloworld_index_index“) . We have added block to the content container and set the template helloworld.phtml .

helloworld.phtml

create a helloworld.phtml file inside app/code/JRB/HelloWorld/View/Frontend/templates with following code.

<h1><?php echo $this->getHelloWorldTxt(); ?></h1>

download full module from here

best sellers in amazon






custom module in magento2
Tagged on:             

Leave a Reply

Your email address will not be published. Required fields are marked *