Hướng dẫn tạo module đơn giản trong Magento 2

Trong bài viết này mình sẽ hướng dẫn các bạn cách tạo 1 module Magento 2 đơn giản – Hello world module.

Bước 1 : Tạo thư mục module

Các module trong Magento 2 sẽ được chứa trong thư mục app/code và có tên theo dạng Vendorname_Modulename.

Thư mục thì sẽ có dạng là : app/code/Vendorname/Modulename

Vd: tên module là Magetop_Helloworld thì thư mục bạn cần tạo sẽ là app/code/Magetop/Helloworld.

app/code/Magetop/Helloworld

Bước 2 : Tạo registration.php

Tạo file registration.php trong app/code/Magetop/Helloworld với đoạn code sau đây:

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

Bước 3 : Tạo module.xml

Tạo module.xml trong thục mục etc theo đường dẫn app/code/Magetop/Helloworld/etc với đoạn code sau:

<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * module
 *
 * @copyright Copyright © 2020 MAGETOP. All rights reserved.
 * @author    [email protected]
 */
-->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Magetop_Helloworld" setup_version="1.0.0">
    </module>
</config>

Bước 4 : Tạo routes.xml

Tạo routes.xml theo đường dẫn app/code/Magetop/Helloworld/etc/frontend với đoạn code sau :

<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * routes
 *
 * @copyright Copyright © 2020 MAGETOP. All rights reserved.
 * @author    [email protected]
 */
-->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="standard"> <!-- standard or admin -->
        <route id="hello" frontName="hello">
            <module name="Magetop_Helloworld" />
        </route>
    </router>
</config>

Việt này sẽ tạo ra url hiển thị module của bạn, trong Magento 2 url sẽ có dạng : <domain>/<frontName>/<Controller>/<action>

Như vậy url của chúng ta sẽ là : <domain>/hello/<Controller>/<action>

Bước 5 : Tạo Controller

Tạo file Helloworld.php theo đường dẫn app/code/Magetop/Helloworld/Controller/Index với đoạn code sau:

<?php
namespace Magetop\Helloworld\Controller\Index;

use Magento\Framework\App\Action\Action;
use Magento\Framework\View\Result\PageFactory;
use Magento\Framework\App\Action\Context;

class Helloworld extends Action
{
    protected $pageFactory;

    public function __construct(Context $context, PageFactory $pageFactory)
    {
        parent::__construct($context);
        $this->pageFactory = $pageFactory;
    }


    public function execute()
    {
        return $this->pageFactory->create();
    }
}

Url sẽ là : <domain>/hello/index/helloworld

Như mình chạy trên localhost thì url sẽ là : localhost/magento232sd/hello/index/helloworld

Bước 6 : Tạo Block

Các bạn tạo file Index.php theo đường dẫn app/code/Magetop/Helloworld/Block với đoạn code sau:

<?php
namespace Magetop\Helloworld\Block;

use Magento\Framework\View\Element\Template;
use Magento\Widget\Block\BlockInterface;

class Index extends Template
{

}

Bước 7 : Tạo view

Tạo file với tên theo dạng <routes>_<controller>_<action>.xml theo đường dẫn app/code/Magetop/Helloworld/view/frontend/layout. Như trong bài viết này tên file sẽ là hello_index_helloworld.xml, trong file sẽ có code :

<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * hello_index_helloworld
 *
 * @copyright Copyright © 2020 MAGETOP. All rights reserved.
 * @author    [email protected]
 */
-->
<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="Magetop\Helloworld\Block\Index" name="hello_index_helloworld" template="Magetop_Helloworld::hello.phtml"/>
        </referenceContainer>
    </body>
</page>

Tiếp theo các bạn tạo file hello.phtml theo đường dẫn app/code/Magetop/Helloworld/view/frontend/templates với đoạn code sau:

<h1>Hello World</h1>

Cấu trúc thư mục module Magetop_Helloworld

Bước 8 : Kích hoạt module

Có 2 cách để kích hoạt module.

Cách thứ nhất các bạn chạy lệnh: php bin/magento module:status sẽ thấy danh sách những module chưa kích hoạt.

danh sách những module chưa kích hoạt

Để kích hoạt các bạn chạy lệnh: php bin/magento module:enable Magetop_Helloworld

Sau đó chạy lệnh php bin/magento setup:upgrade rồi tới php bin/magento setup:static-content:deploy -f

Chạy xong các bạn truy cập vào url : localhost/magento232sd/hello/index/helloworld và kiểm tra.

Hello world

Vậy là mình đã hướng dẫn xong cách tạo 1 module đơn giản. Bài sau mình sẽ hướng dẫn các bạn cách tạo table database trong Magento 2.

Cảm ơn các bạn đã đọc bài viết.

4.9 13 votes
Article Rating

Callula Huy

Callula is the Marketing Executive at Magetop. With more than 5 years of copywriting under her belt, Callula is into creating valuable content that is straight to the point. Life student. Workaholic. Foreign languages and traveling aficionado.

Leave a Reply or put your Question here

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x