A Complete Tutorial on Magento 2 Module Development

A Complete Tutorial on Magento 2 Module Development

Hello-World-Meetanshi

“Hello World” is where a new programmer is born! 😄
Starting with the ABCD of Magento 2 development, hello world module is mandatory!

So, here I am, with a post for newbies to create a simple module in Magento 2, for hello world. Magento 2 module development is a stepwise process and needs to be done with some prerequisites conditions.

Follow the below tutorial and create your own basic module in Magento 2!

Things to take care of before you create a custom module in Magento 2:

Switch to developer mode: Switch to developer mode in order to see every error Magento is throwing at you. Use the below command:

Learn more about the Magento 2 Modes

Method for Magento 2 Module Development:

  1. Module Setup
  2. Creating a Controller
  3. Creating a Block
  4. Creating a Layout and Template Files

Getting to each step,

  1. Module Setup

    1. Create the below folders
      1. app/code/Meetanshi
      2. app/code/Meetanshi/Helloworldwhere Meetanshi folder is the module’s namespace and our module’s name is Helloworld!Note: You’d be required to create the “code” folder manually if it is not in the “app” directory.
    2. Create a module.xml file in the app/code/Meetanshi/Helloworld/etc  folder with the below code:
    3. Create a registration/php file in the app/code/Meetanshi/Helloworld folder to register the module. Implement the below code:
    4. Open the terminal and go to the Magento 2 root. Run the below command
      Note: Make sure if your module is installed. Go to Admin > Stores > Configuration > Advanced > Advanced. Check if the module is present in the list. Else, open app/etc/config.php and check the array for the “Meetanshi_Helloworld” key whose value must be 1.
  2. Creating a Controller

    1. Define the router with routes.xml file in the app/code/Meetanshi/Helloworld/etc/frontend folder with the below code:
      We define the frontend router and router with an id “helloworld”. The Magento 2 URL syntax is <frontName>/<controler_folder_name>/<controller_class_name> and according to this, our URL will be helloworld/index/index.

       

    2. Create the Index.php file in the app/code/Meetanshi/Helloworld/Controller/Index folder with the below code:

      In Magento 2 every action has its own class which implements the execute() method.

  3. Creating a block

    Create a simple block class with the getHelloWorldTxt() method which returns the “Hello world” string.

    1. Create a Helloworld.php file in the app/code/Meetanshi/Helloworld/Block folder with the below code:
  4. Creating a layout and template files

    Layout files and templates are placed in the view folder inside the module. We can have three subfolders inside the view folder: adminhtml, base, and frontend.

    1. Use the below code to create a helloworld_index_index.xml file in the app/code/Meetanshi/Helloworld/view/frontend/layout folder:
       

      Every page has a layout hand. For our controller action, the layout handle is helloworld_index_index. You may create a layout configuration file for every layout handle. In our layout file, we have added a block to the content container and set the template of our block to helloworld.phtml, which we create in the next step.

    2. Create a helloworld.phtml file in the app/code/Meetanshi/Helloworld/view/frontend/templates folder

      $this variable refers to our block class. Our method getHelloWorldTxt() returns the string “Hello world!”

Open the /helloworld/index/index URL in the browser to check the below output.

Hello World Module by Meetanshi

That’s it with the custom Magento 2 module development!

Hopefully, the post helps you go through the first Magento 2 module development stage! If you get stuck in the between, make sure to solve your doubts using the Comments section below. I’d be happy to help 🙂

Do rate the post with 5 stars!

Thank you.

Get Weekly Updates

Never miss Magento tips, tricks, tutorials, and news.

Thank you for subscribing.

Something went wrong.

4.9
(based on 20 Reviews)

Sanjay is a co-founder at Meetanshi. He is a Certified Magento Developer who loves creating Magento E-commerce solutions. Owing to his contributions in Magento Forums and posting solutions, he is among the top 50 contributors of the Magento community in 2019. When he is not engrossed with anything related to Magento, he loves to play cricket.

5 comments On A Complete Tutorial on Magento 2 Module Development

Leave a reply:

Your email address will not be published.