Magento 2 create a module or extension
In start of learning Magento 2 every developer must need to learn how to create a simple module or extension. But before start it you must have initial knowledge of Php too. Here it is easy way to create the extension or module in magento 2. In this custom module we have to learn how to create router,controller,block,xml layout and phtml files. Combination of these file will make a simple Hello World module. That will listed in admin module list and show the output on fronteend So lets start the fun learning of magento 2. Before we start playing with magento 2 we must do these tasks disabled cache from admin panel or you can do it via command (php bin/magento cache:disable) and set the developer mode on by following command (php bin/magento deploy:mode:set developer).
Note: Check code folder in your app directory. If not have code folder then create it.
First Step:
First step is register your module with registration.php . The file location will be
app/code/QaisarSatti/HelloWorld/registration.php
/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'QaisarSatti_HelloWorld',
__DIR__
);
Second Step:
Create module.xml file. In this file you will define your module name and version. The file location will be
app/code/QaisarSatti/HelloWorld/etc/module.xml
<!--/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/ -->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="QaisarSatti_HelloWorld" schema_version="0.0.1" setup_version="0.0.1"/>
</config>
Third Step:
Create the block file.The file location will be
app/code/QaisarSatti/HelloWorld/Block/HelloWorld.php
/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/
namespace QaisarSatti\HelloWorld\Block;
class HelloWorld extends \Magento\Framework\View\Element\Template
{
public function _prepareLayout()
{
parent::_prepareLayout();
$this->pageConfig->getTitle()->set(__('First Hello World Module'));
return $this;
}
}
Fourth Step:
Create the controller file.The file location will be
app/code/QaisarSatti/HelloWorld/Controller/Index/Index.php
/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/
namespace QaisarSatti\HelloWorld\Controller\Index;
class Index extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$this->_view->loadLayout();
$this->_view->renderLayout();
}
}
Fifth Step:
Create frontend router. Here you will declare your frontName make sure it is unique name.
app/code/QaisarSatti/HelloWorld/etc/frontend/routes.xml
<!--/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/ -->
<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="QaisarSatti_HelloWorld" />
</route>
</router>
</config>
Sixth Step:
Create frontend template file.
app/code/QaisarSatti/HelloWorld/view/frontend/templates/HelloWorld.phtml
/**
* Catalog Product Rewrite Helper
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/
echo 'Hello World';
?>
Seventh Step:
Add frontend layout handle for your router. First letter will be your frontName as you mention in your router.xml file (helloworld) then your folder name (index) then in the last your controller name (Index).
app/code/QaisarSatti/HelloWorld/view/frontend/layout/helloworld_index_index.xml
<!--/**
* Simple Hello World Module
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email qaisarssatti@gmail.com
*
*/ -->
<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="QaisarSatti\HelloWorld\Block\HelloWorld" name="HelloWorld" template="QaisarSatti_HelloWorld::HelloWorld.phtml"></block>
</referenceContainer>
</body>
</page>
Now your simple hello world module is complete. You can do following step to activate this module.
php bin/magento module:enable QaisarSatti_HelloWorld
You can see the output of module front page by http::yoururl/helloworld
Qaisar Satti
Hi, I'm Qaisar Satti! I've been a developer for over 20 years, and now I love sharing what I've learned through tutorials and guides. Whether you're working with Magento, PrestaShop, or WooCommerce, my goal is to make your development journey a bit easier and more fun. When I'm not coding or writing, you can find me exploring new tech trends and hanging out with the amazing developer community. Thanks for stopping by, and happy coding!
9 thoughts on “Magento 2 create a module or extension”
Leave a Reply
You must be logged in to post a comment.
Vary nice blog, it help me alot for creating my first Magento 2 module.
Really appreciated. Surely you’ll like other blog posts as well.
Stay tuned, There is a lot coming in next few days.
Very helpful article to start developing in magento 2 extension.
Really appreciated. Surely you’ll like other blog posts as well.
Stay tuned, There is a lot coming in next few days.
Sono d’accordo con lei, la ringrazio per l’assistenza in materia. Come sempre, tutti i semplicemente brillante.
Hi my friend! I want to say that this article is awesome, nice written and include approximately all important infos. I like to see more posts like this.
Good – I should certainly pronounce, impressed with your website. I had no trouble navigating through all the tabs and related information ended up being truly easy to do to access. I recently found what I hoped for before you know it in the least. Reasonably unusual. Is likely to appreciate it for those who add forums or something, web site theme . a tones way for your client to communicate. Nice task..
Very nice blog, it help me alot for creating my first Magento 2 module
thank you so much,you help me a lot!