PoojaMoolya: Created page with " {| border = 1 | Time | Narration |- | 00:01 | Welcome to the spoken tutorial on''' Creating a simple custom module'''. |- | 00:06 | I..."

2018-05-23T09:15:39Z

Created page with " {| border = 1 | <center>Time</center> | <center>Narration</center> |- | 00:01 | Welcome to the spoken tutorial on''' Creating a simple custom module'''. |- | 00:06 | I..."

New page

{| border = 1
| <center>Time</center>
| <center>Narration</center>

|-
| 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.

|}

Drupal/C4/Creating-a-simple-custom-module/English-timed - Revision history

PoojaMoolya: Created page with " {| border = 1 | Time | Narration |- | 00:01 | Welcome to the spoken tutorial on''' Creating a simple custom module'''. |- | 00:06 | I..."