Magento 2 Magento Extensions Magento 2 TutorialsAugust 6, 2015

Step by Step Guide to Create a Magento 2 Module

After receiving a good feedback on Magento 2.0 installation, FME developers were asked to show the basic steps for creating a simple module for Magento 2.0. To give the viewers a clearer picture, FME has decided to post a step by step blog for creating Magento 2.0 module. The primary objective of this post is to help customers understand the new and improved concepts/structures Magento 2.0 developers encounter. With the upcoming version getting closer, Magento 2.0 needs to be understood the best way possible before changes are made. For creating a simple extension you must first consider integrating controller, block and view. You can start by putting FME extensions on the content block. The new thing that you will come across at first while developing an extension in Magento 2.0, is the absence of the code pool. What you now have is app/code/. We are going to initiate by creating the following directory app/code/FME/Test/etc/module. 1. Create a module.xml in app/code/FME/Test/etc/module.xml to declare the module.

<?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="FME_Test" schema_version="0.0.1" setup_version="0.0.1"/>
</config>

2. Create registration.php in app/code/FME/Test/registration.php

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

3. Create Controller And Action Of Module Create the file Index.php in app/code/FME/Test/Controller/Index/Index.php Index controller folder, while Index.php is action. The executive function of action Index is execute()

<?php
    /**
    * Test Controller
    *
    * @category    FME
    * @package     FME_Test
    * @author      Fme Extensions Development Company
    *
    */ 
    namespace FME\Test\Controller\Index;
    class Index extends \Magento\Framework\App\Action\Action
    {
        public function execute()
        { 
            $this->_view->loadLayout();
            $this->_view->renderLayout();
        }
    }

4. Now Create A Block File in app/code/FME/Test/Block/Test.php

<?php
    
     * Test Block
     *
     * @category    FME
     * @package     FME_Test
     * @author      Fme Extensions Development Company
     *
     */ 
namespace FME\Test\Block;
class Test extends \Magento\Framework\View\Element\Template
{
	public function _prepareLayout()
    {
        parent::_prepareLayout();
        $this->pageConfig->getTitle()->set(__('FME Test'));
        return $this;
    }
}

5. Create front-end router configuration file /app/code/Magento/Test/etc/frontend/routes.xml In magento 2 declaration of controller is differ from magento 1.x. in Magento 2.0, file config.xml only configures the default configuration value in tag <default> Information about controller of frontend will be reported in: Magento/Test/etc/frontend/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="test" frontName="test">
            <module name="FME_Test" />
        </route>
    </router>
</config>

5. Create Layout and Template file for front-end Create file app\code\FME\Test\view\frontend\layout\test_index_index.xml Name of layout file is really important In Magento 2 For every action you must create a layout file. Router name_controlle namer_action name

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"?>
    <body>
       <referenceContainer name="content"?>
           <block class="FME\Test\Block\Test" name="test" template="FME_Test::test.phtml"></block?>
        </referenceContainer?>
    </body?>
</page?>

After that create template file app\code\Magento\Test\view\frontend\templates\test.phtml

<?php echo 'My First Module in Magento 2'; ?>

In Magento 2 there are 2 ways to activate module. One is edit to config.php file (old method)

Open the file app/etc/config.php
In the module array, add ‘FME_Test’ => 1,

Second to update the magento through shell In Shell in your magento 2 root directory execute below two commands

php bin/magento module:enable --clear-static-content FME_Test, after that
php bin/magento setup:upgrade

Now go through the link http://localhost/magento2/test/index/index

This blog was created with FME's SEO-friendly blog