Intro To Magento 2, Part 1: Create A Module

Embarking on your quest to create a module for Magento 2 doesn’t have to be daunting. Magento is a flexible, powerful, and extensive e-commerce framework that lets you customize and add-on just about anything you want. It all begins with a custom module.

There are a couple of key elements we should talk about first.

1. Where does it go?

app/code/Yourmodulespace/Yourmodule

That’s the folder structure where you will put your module. This is a little bit of a change from Magento 1.x. You no longer have to put things outside of your module’s folder.

For this tutorial, we will put our module in:

app/code/Danjoseph/Helloworld

2. What is the folder/file structure?

Depending on what you want your module to do, you will need a variety of folders and files, let’s explain the basics of a module that will simply echo a message from a controller.

app/code/Danjoseph/Helloworld/Controller/Index/Index.php
app/code/Danjoseph/Helloworld/etc/module.xml
app/code/Danjoseph/Helloworld/etc/frontend/routes.xml
app/code/Danjoseph/Helloworld/registration.php

3. How do I get this going?

The first file is the controller. Magento was originally built on the MVC pattern. Since 2.0 was release, they appear to have moved more towards the MVVM pattern. Either way, you’re still touching the controller first when you load up a page. Let’s start by building our controller.

Let’s write some code.

app/code/Danjoseph/Helloworld/Controller/Index.php

<?php

namespace Danjoseph\Helloworld\Controller\Index;

class Index extends \Magento\Framework\App\Action\Action
{
    public function __construct(
        \Magento\Framework\App\Action\Context $context)
    {
        return parent::__construct($context);
    }

    public function execute()
    {
        echo "Hello, World!";
        exit();
    }
}

The basic function of a controller in Magento 2. You start by extending the \Magento\Framework\App\Action\Action class. There are other types of controllers, such as Admin. We will talk about those in later tutorials.

We’re not really doing much with our __construct() in this situation. The only thing we’re doing is instantiating our Context class. This gives us access to things like request, object manager, view, results, messages, and other core framework objects. In future tutorials, we’ll include some custom things in there as well.

Your execute() function is what will be executed first when you pull up your browser and browse to the path of your new module. In here, we’re simply echoing out “Hello, World!” and then exiting the application.

app/code/Danjoseph/Helloworld/etc/module.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd">
    <module name="Danjoseph_Helloworld" setup_version="1.0.0" schema_version="2.0.0"></module>
</config>

Magento loves XML files. This is your main “setup” XML file, giving your module a name, version, and identifying the schema version you’re using.

As you can see from the tag, we have named our’s “Danjoseph_Helloworld”.

Danjoseph = app/code/Danjoseph
Helloworld = app/code/Danjoseph/Helloworld

Get it? Basic path stuff.

app/code/Danjoseph/Helloworld/etc/frontend/routes.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../lib/internal/Magento/Framework/App/etc/routes.xsd">
    <router id="standard">
        <route id="helloworld" frontName="helloworld">
            <module name="Danjoseph_Helloworld" />
        </route>
    </router>
</config>

The routes.xml is something you will use when setting up any type of new browsing path, or setting up API paths. We want to be able to go to www.danjoseph.me/helloworld/ and see our module in this instance.

Let’s start with router and id. The id we’re using is just a standard Magento route. There are other types. We will also talk about those in later tutorials.

app/code/Danjoseph/Helloworld/registration.php

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

Finally, we have our php script that registers the module with Magento 2. You’re essentially telling it “I exist, and here’s what I am.”

Again, “Danjoseph_Helloworld” is the name of our module, and it corresponds with our path.

4. Now that I have my code written, what is left?

There are a couple things that need to happen now that you have your module written. You need to tell Magento 2 that it exists so that it cane include it in the main config file.

% php bin/magento module:enable Danjoseph_Helloworld

This will create an entry in your app/etc/config.php that looks like this:

'Danjoseph_Helloworld' => 1

config.php is an array of your modules. Setting them to 1 enables them, setting them to 0 disables them.

Next, you will want to run an upgrade of your Magento 2 DB data and schema.

% php bin/magento setup:upgrade

This will go through and do all the magic. Even if you were to edit the config.php manually to enable your module, you will still need to run this.

If you have cache on, you’ll need to clean that out.

% php bin/magento cache:clean

5. Is that it?

Yes! You have your first module. Head to your browser of choice and go to www.yourwebsite/helloworld/index/index and you will see your output.

Now you have the base knowledge to add-on to your web site. You have created a basic Magento 2 module, and are ready to explore a new world.

Written by Dan
Welcome to my blog! Here you'll find my collection of bible study lessons, book reviews, and other posts I feel inspired to write. I am a Christian currently serving at First Baptist Church of Northville in Northville, MI.