Building a Module in Magento 2- PART 1

June 30, 2018
keya

Magento 2 is a popular eCommerce platform used for online stores. Today we are going to see how to build a simple “Hello World” module in Magento 2.

Prerequisite of this tutorial:

Magento 2.1.x installed along with Apache2, correct Php and MySql version supported by Magento 2.1.x.

Follow this link for setup and installation guide: https://devdocs.magento.com/guides/v2.1/install-gde/install-quick-ref.html

  1. After Installation, disable all Magento 2 cache: Disabling Magento 2 cache during development will save you some time because you won’t need to manually flush the cache every time you make changes to your code. The easiest way to disable cache is to go to Admin → System → Cache Management → select all cache types and disable them.
  2. Turn on Developer mode: This will allow you to see all the errors Magento 2 will throw during application development. Open the terminal and go to your Magento 2 project directory. Type the following command and press enter:
    php bin/magento deploy:mode:set developer

Creating the “Demo_HelloWorld” Module:

The module name is defined as “VendorName_ModuleName”. First part is the name of the vendor and last part is the name of the module. In our case, the module name is Demo_HelloWorld. In order to create the module go to your app directory. Inside app->code create folders according to the following structure.

Demo->HelloWorld. Your final directory should look like this app/code/Demo/HelloWorld.

Inside the Demo/HelloWorld folder that you have just created, make a folder name etc. Inside etc add a file module.xml. The final structure is app/code/Demo/HelloWorld/etc/module.xml

Edit module.xml with the following code:

<?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="Demo_HelloWorld" setup_version="1.0.0">

   </module>

</config>

After this, we need to register our module to use it so we will have to create a registration.php file.

In the HelloWorld folder in app/code/Demo/HelloWorld create a filename registration.php

Edit the registration.php using the following code

<?php

\Magento\Framework\Component\ComponentRegistrar::register(

\Magento\Framework\Component\ComponentRegistrar::MODULE,

'Demo_HelloWorld',

__DIR__

);

Now we have to enable the module. Before that let's check the status of the module.

Inside the project directory opens the terminal and type:

php bin/magento module:status

You will see in the output the module is disabled now:

List of disabled modules: Demo_HelloWorld

Type in the terminal to enable it:

php bin/magento module:enable Demo_HelloWorld

It’s time to create the controller now. However, before this, we need to define the route.

In Magento, routes are divided into 3 parts: Route front name, controller, and action. For example:

http://example.com/frontname/controller/action

To add a route, it is necessary to create routes.xml file.

Create the following routes.xml file in the specified directory app/code/Demo/HelloWorld/etc/frontend/routes.xml

Magento has an admin panel too which also has its individual routes. To separate the frontend routes the routes.xml file is created inside the frontend folder. But for the backend routes which we do not need right now, it is created inside app/code/Demo/HelloWorld/etc/adminhtml/routes.xml.

Open the file app/code/Demo/HelloWorld/etc/frontend/routes.xml and paste the below code:

<?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 frontName="helloworld" id="helloworld">

           <module name="Demo_HelloWorld"/>

       </route>

   </router>

</config>

After this, we will create the controller and action

The folder and file you need to create is:

app/code/Demo/HelloWorld/Controller/Index/SayHello.php

Here, the controller is “index” and action is “say hello”.

So as mentioned earlier our overall URL according to this format http://example.com/frontname/controller/action becomes http://<yourhost.com>/helloworld/index/sayhello.

Open the SayHello.php and edit with the following code.

<?php

namespace Demo\HelloWorld\Controller\Index;


class SayHello extends \Magento\Framework\App\Action\Action

{

protected $_pageFactory;

public function __construct(

\Magento\Framework\App\Action\Context $context,

\Magento\Framework\View\Result\PageFactory $pageFactory)

{

$this->_pageFactory = $pageFactory;

return parent::__construct($context);

}

public function execute()

{

echo "Hello World";

exit;

}

}

Now inside your project directory run the following command:

sudo php bin/magento setup:upgrade

sudo php bin/magento setup:di:compile

sudo php bin/magento setup:static-content:deploy

sudo php bin/magento cache:clean

sudo chmod -R 777 .

*For development mode, I like to give all 777 permission which is not permissible in production

For development mode, I like to give all files and folder 777 permission to avoid constant write permission error. However, for production following files and folder permission should be used.

cd <your Magento install dir>

find . -type f -exec chmod 644 {} \;                       

// 644 permission for files

find . -type d -exec chmod 755 {} \;                       

// 755 permission for directory

find ./var -type d -exec chmod 777 {} \;               

// 777 permission for var folder   

find ./pub/media -type d -exec chmod 777 {} \;

find ./pub/static -type d -exec chmod 777 {} \;

chmod 777 ./app/etc

chmod 644 ./app/etc/*.xml

chown -R :<web server group> .

chmod u+x bin/magento

We are done creating our Demo_HelloWorld module. Open your browser and visit the following URL: http://<yourhost.com>/helloworld/index/sayhello

You will see Hello World as output.

Source link: https://medium.com/@ishtiaque05/building-a-module-in-magento-2-part-1-fc08da0befae

Contributor: Syed Ishtiaque AhmadNascenia


						

No comments

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.