Drupal/C4/Creating-a-simple-custom-module/English-timed
From Script | Spoken-Tutorial
| |
|
| 00:01 | Welcome to the spoken tutorial on Creating a simple custom module. |
| 00:06 | In this tutorial, we will learn to- Create a basic module |
| 00:11 | Add a basic controller and |
| 00:13 | Add a routing file |
| 00:15 | To record this tutorial, I am using Ubuntu Linux 16.04 |
| 00:21 | Drupal 8 , Firefox web browser and Gedit text editor |
| 00:27 | You can use any text editor and web browser of your choice. |
| 00:32 | To practise this tutorial, you should have basic knowledge of Drupal. |
| 00:38 | If not, for relevant Drupal tutorials, please visit the link shown. |
| 00:43 | To create a custom module in Drupal, you should be familiar with
Object oriented programming terminology |
| 00:51 | Programming in PHP |
| 00:53 | Namespacing in PHP and |
| 00:55 | Symfony 2 |
| 00:57 | For details of pre-requisites, please see the “Additional reading material” link of this tutorial. |
| 01:04 | We have already learnt about contributed modules earlier. |
| 01:08 | Now we will learn to create a simple custom module. |
| 01:12 | This module will create a custom page showing “hello world”. |
| 01:17 | Here is the workflow of this module. |
| 01:20 | The Request is what we request to the website. |
| 01:24 | Router determines what should be done with the request. |
| 01:29 | The controller builds the response for the given request. |
| 01:33 | The View creates the response. |
| 01:36 | The response is what the website returns. |
| 01:40 | Here is the file structure of the custom module which we are going to create. |
| 01:45 | Let us start creating the files required for a custom module. |
| 01:50 | Open your File browser. |
| 01:52 | Go to the folder where we have installed Drupal locally. |
| 01:57 | Now go to apps -> drupal -> htdocs -> modules folder. |
| 02:03 | We have to always create our custom modules inside this modules folder. |
| 02:09 | Let’s create a folder and name it as custom. |
| 02:13 | This will separate our custom modules from the contributed modules. |
| 02:18 | Inside this custom folder, we will create a folder called hello_world. |
| 02:25 | This folder name is the machine name. |
| 02:28 | It will be used by core Drupal, to refer to this module. |
| 02:33 | There are some rules to follow when naming a custom module. |
| 02:37 | It must contain only lower-case letters, underscores but no spaces. |
| 02:43 | It must be unique and cannot have the same short name as any other module or theme |
| 02:50 | It cannot have any reserved terms such as src, lib, vendor, templates, includes, fixtures, etc. |
| 03:00 | Switch back to our file browser |
| 03:03 | Inside this hello_world folder, we will create a file called hello_world with info.yml extension. |
| 03:13 | The name of the info.yml file and the name of the module folder should be the same. |
| 03:20 | Yml is the file extension of YAML. |
| 03:24 | YAML is a unicode based data serialization standard for all programming languages. |
| 03:31 | It is a human-readable language. |
| 03:34 | This info.yml file is to tell Drupal about our module. |
| 03:40 | In this file, we will store the metadata of our module. |
| 03:44 | So type the following metadata. |
| 03:47 | Let's save this file. |
| 03:49 | This is the title of our module which will be shown on the extend page. |
| 03:54 | This is a small description of our module. |
| 03:58 | This is what category our module will be listed under on the extend page. |
| 04:04 | This is to tell Drupal that we are making a module. |
| 04:08 | The core key specifies the version of Drupal core that our module is compatible with. |
| 04:15 | Here name, type and core keys are required. Other keys can be ignored. |
| 04:21 | Next, we will create a file called hello_world with module extension. |
| 04:28 | For this demonstration, we are not going to add any functionality in this file.
But we just need to create this file. |
| 04:37 | In this file, type the following. |
| 04:39 | Let us save the file. |
| 04:41 | These are the two files Drupal requires to create a module. |
| 04:46 | Now we will install this module in our website. |
| 04:50 | Open our local Drupal website. |
| 04:53 | Before installing the new module, we will clear the cache first. |
| 04:58 | To do that, click on the Configuration menu. |
| 05:01 | Under Development, click on the Performance option. |
| 05:05 | Now click on the Clear all caches button. |
| 05:08 | You can see that the caches are cleared. |
| 05:11 | It is compulsory to clear the caches every time we modify our website. |
| 05:17 | Now to install the module, click on the Extend menu and scroll down. |
| 05:23 | Under Custom, you can see the Hello World module which we created just now. |
| 05:28 | Click on it to select. |
| 05:30 | Click on the Install button at the bottom. |
| 05:33 | Our custom module is enabled now. |
| 05:36 | Next, we have to add the router file. |
| 05:40 | This is to tell Drupal where the module can be accessed from. |
| 05:44 | The router determines what should be done with the request. |
| 05:48 | The router also checks if the access is permitted. |
| 05:53 | Switch back to our File browser. |
| 05:55 | Now we will create the routing file called hello_world.routing.yml |
| 06:03 | Type the following inside the routing file. Let us understand the code. |
| 06:08 | This line is the route. |
| 06:10 | This indicates what path will be used to access our module. |
| 06:15 | This is to tell Drupal where to get the content from. |
| 06:20 | Here content is the function which we will create in the controller file. |
| 06:25 | This is to ensure only users who can access content, will be able to see our Hello World page. |
| 06:33 | Next we should add the functionality about what this module is going to do. |
| 06:38 | This is done by adding a controller. |
| 06:41 | What is a controller? Controller is a PHP function. |
| 06:46 | It takes information from the HTTP request and constructs and returns an HTTP response. |
| 06:54 | Switch back to our File browser. |
| 06:56 | To add a controller, we should create a folder named src here. |
| 07:02 | Inside the src folder, we should create another folder named Controller. |
| 07:07 | Inside this Controller folder, we will create the controller file called HelloController.php |
| 07:15 | Inside this file, type the following. |
| 07:18 | Now save the file. |
| 07:20 | The namespace allows to place a bunch of code under a name, to avoid naming conflicts. |
| 07:28 | This use statement will import the ControllerBase class. |
| 07:32 | We have a class HelloWorldController with the function content. |
| 07:38 | It will return the markup text when the routing system invokes the page. |
| 07:43 | Now switch to the web browser. |
| 07:46 | Click on the Back to site button. |
| 07:48 | Add hello in the address bar as a request to the web browser. |
| 07:53 | This is the path we created in the routing file to access our module.
Now press Enter. |
| 08:00 | We can see our custom page which we created just now. This is the response. |
| 08:07 | Likewise, we can create other simple custom modules in Drupal 8. |
| 08:13 | With this, we come to the end of this tutorial. |
| 08:16 | Let us summarize. In this tutorial, we have learnt to-
Create a basic module, Add a basic controller, Add a routing file |
| 08:27 | As an assignment, create a custom module for “About us” page of your website. |
| 08:33 | The video at the following link summarises the Spoken Tutorial project.
Please download and watch it. |
| 08:41 | The Spoken Tutorial Project Team conducts workshops and gives certificates.
For more details, please write to us. |
| 08:49 | Spoken Tutorial Project is funded by NMEICT, Ministry of Human Resource Development and NVLI, Ministry of Culture, Government of India. |
| 09:00 | This is Priya from IIT Bombay signing off. Thanks for joining. |
