• Blog >
  • Creating your first drupal 8 module

module.jpg

With the release of Drupal 8 a lot has changed. Drupal 7 primarily relies on procedural PHP code whereas Drupal 8 is mostly object oriented. To get to grips with some of the fundamentals of Drupal 8 we’re going to create a custom module, register a menu router item within said module and finally output some rendered markup on the page.

Creating our module folder
In Drupal 7 sites core modules are located in the root directory of your site in a sub-folder called “modules”. In Drupal 8 these core modules have now moved to “core/modules”. What this means to us the developer is that the “modules” that was once out of bounds can be used freely.

Navigate to the “modules” directory from the root of your site and create a folder called “custom” Navigate into the newly created “custom” directory and create another folder called “hello_world” (this will be the name of our module).

Registering our module
Unlike previous iterations of Drupal with version 8 we don’t need to include a *.module file in our module structure - we do however need an info file, which is now a YAML file (the information stored in the file is however very similar).

Within your module directory, create a file named hello_world.info.yml and add the following:

info.yml_.png

For anyone comfortable creating Drupal 7 modules most of the information contained within the info.yml file will be familiar. 

-Name simply put is the name of our module

-Type is a new component that defines the type of extension (another “type” being theme)

-Description is a way of letting users know what our module actually does

-Package is used to group modules together on the module overview page (all core modules have a “package” of “Core” for example)

-Core is the version of Drupal the module is intended for (this does not increment with each minor release of Drupal)

Enabling our module
Navigate to “admin/modules”, filter the list of modules by typing “Hello” and you should see our newly created module listed.

module-listing.png

Select the checkbox next to our module and click “Install”.

Extending our module structure
We’re going to crete a controller class for use with our module, so we need to extend the module structure by adding a “src” directory. The “src” directory stores controllers, plugins, forms, templates and tests used with the associated module. 

Within our module create a folder called “src”. Navigate into the “src” directory and create a new folder called “Controller”.

Creating our controller
Navigate into the “Controller” directory and create a file called “HelloWorldController.php”. Open up the file and add the following:

conrtoller.png

Here we’re declaring a namespace (Drupal\hello_world\Controller) and creating a class (called HelloWorldController), which extends the ControllerBase class. The extended class “ControllerBase” is available to us due to the “use” clause including the namespace.

Our class “HelloWorldController” contains a very simple public method called “content” and all this does is return a simple render array.

Tying it all together
We now have a module defined along with a controller class that returns markup in a render array, but the user can’t see this, so let’s register a menu router item, which will define a URL accessible to end-users.

Unlike Drupal 7 we don’t need to invoke “hook_menu()” to create menu router item - this can simply be achieved using another YAML file. 

In the root directory of our module crete a new file called “hello_world.routing.yml” and add the following:

screen_shot_2016-01-14_at_10.21.13.png
Here we’re defining the following attributes:

-Path: The path the end-user will navigate to to access the page

-Controller: The namespace, class name, and method of the controller we’re invoking

-Title: The title of the page

-Permissions: Any permissions that are required for the user to access the page

Providing everything went according to plan you should now be able to navigate to the URL “/hello-world” and see something similar to the following:

web-out.png

Congratulations, you’ve just created your first Drupal 8 module!

Troubleshooting
At the end of this tutorial, the folder structure of your module should be as follows:

screenshot_2015-12-10_16.31.14.png

Source files
The source files for this project are available at the following Git repository: https://github.com/craigweb/first-drupal-8-module

Find me on Twitter: @craigperks


 

NWDUG Unconference 2017

● ● ●