Creating our first Module

Zend Framework 2 module is characterised by a defined directory structure and a few files that have to be part of every module.

The module can be created with all the basic directory and files if we installed zftool but we are going to create the module manually to give us a better understanding.

First we are going to create a folder that would represent our module inside the module directory (i.e. C:\xampp\htdocs\zfnigeria\module). Our module would be called, “Apps”.

If you have done that we should then have two folders inside of the module folder, Application and Apps. See screen cast below.

Now open the Apps folder and create three folders inside it naming them config, src and view. See screen cast below.

Open the src folder and create another folder, call it Apps and inside this new Apps folder create three folders call them Controller, Form and Model. See screen cast below.

Now open the Apps folder under modules (i.e. C:\xampp\htdocs\zfnigeria\module\Apps) and then open the view folder and create inside it another folder and name it apps. Open it and create another folder inside it call it apps again so that you now have two apps folder inside view folder with one inside the other.

We have created the basic directory needed in Zend Framework 2 module. It is now time to create the files and our first file would be Module.php and it would be in the Apps’s main directory (i.e. C:\xampp\htdocs\zfnigeria\module\Apps).  Open notepad and save the blank file as Module.php and use Netbeans editor to open this file, this is to enable us get help when writing the code with the IDE.

Inside the file type the lines below.

1:  namespace Apps;  
2:  use Zend\ModuleManager\Feature\AutoloaderProviderInterface;  
3:  use Zend\ModuleManager\Feature\ConfigProviderInterface;  
4:  class Module implements AutoloaderProviderInterface, ConfigProviderInterface  
5:  {  
6:  public function getAutoloaderConfig()  
7:    {  
8:    return array(  
9:    'Zend\Loader\ClassMapAutoloader' => array(  
10:    __DIR__ . '/autoload_classmap.php',  
11:    ),  
12:    'Zend\Loader\StandardAutoloader' => array(  
13:    'namespaces' => array(  
14:    __NAMESPACE__ => __DIR__ . '/src/' . __NAMESPACE__,  
15:    ),  
16:    ),  
17:    );  
18:    }  
19:   public function getConfig()  
20:    {  
21:    return include __DIR__ . '/config/module.config.php';  
22:    }  
23:  }  

If you remember in our previous tutorial we said, “The module manages uses the Module.php file to configure the module and invoke the getAutoloaderConfig() and getConfig() methods”. If you look at the code again you would see it is divided into two part the function for getAutoloaderConfig() and the function for getConfig(). Don’t worry we are going to explain this functions and file again.

The next file we would create is the autoload_classmap.php and this would also be in the Apps main directory too (i.e. C:\xampp\htdocs\zfnigeria\module\Apps). After you create the file just type this code inside.

return array();

This all you need to add to this file and again we are going to look at this file in another tutorial. The Apps module directory should now look like this.

If you try to access the modules from the browser (i.e. http://localhost/zfnigeria/public/apps/home) you would get this error “A 404 error occurred Page not found. The requested URL could not be matched by routing. No Exception available”. This is because the routing is not yet recognised; our module is also not recognized by the system. So we need to add our routing and register our module.

Open the config directory in your Apps module and create a file name module.config.php. Type the code below inside it.

1:  return array(  
2:    //Add Your Controllers Here  
3:   'controllers' => array(  
4:    'invokables' => array(  
5:      'Apps\Controller\Apps' => 'Apps\Controller\AppsController',  
6:      ),  
7:    ),  
8:    //Add Routes Here  
9:    // The following section is new and should be added to your file  
10:    'router' => array(  
11:      'routes' => array(  
12:        'apps' => array(  
13:          'type' => 'segment',  
14:            'options' => array(  
15:            'route' => '/apps[/][:action][/:id]',  
16:            'constraints' => array(  
17:              'action' => '[a-zA-Z][a-zA-Z0-9_-]*',  
18:              'id' => '[0-9]+',  
19:            ),  
20:            'defaults' => array(  
21:              'controller' => 'Apps\Controller\Apps',  
22:              'action' => 'index',  
23:            ),  
24:          ),  
25:        ),  
26:      ),  
27:    ),  
28:    //Add View Paths  
29:    'view_manager' => array(  
30:    'template_path_stack' => array(  
31:    'apps' => __DIR__ . '/../view',  
32:      ),  
33:    ),  
34:   );  

Open the zfnigeria main directory, then open the config directory (i.e C:\xampp\htdocs\zfnigeria\config) and you would see the file named application.config.php, open it and under the first multidimensional array called modules add the name of your module (i.e. Apps) under where you have application like this, ‘Apps’, .

Though our module is ready we do have any so within it yet, so to create the page we need to create a controller and a view script.

Open the src directory under your Apps module, inside is another Apps folder open it (i.e. C:\xampp\htdocs\zfnigeria\module\Apps\src\Apps) and you would find the controller folder there.

Start your notepad create a blank php file save it in the controller folder above with the name AppsController.php then type inside the code below.

1:  namespace Apps\Controller;  
2:  use Zend\Mvc\Controller\AbstractActionController;  
3:  use Zend\View\Model\ViewModel;  
4:  class AppsController extends AbstractActionController  
5:  {  
6:    public function homeAction()  
7:    {  
8:      return new ViewModel;  
9:    }  
10:  }  

A look at the code where we have the action function you would see we named our page home (i.e. public function homeAction()). This should also be the name you give your view script. You could give it any name like index.

Now open the view directory under the the Apps main directory and open the two apps folder (i.e. C:\xampp\htdocs\zfnigeria\module\Apps\view\apps\apps). Create a blank file and save it to this directory name it home.phtml. Note the extension (i.e. phtml) Zend Framework view scripts are saved with that extension.

Inside it just type, “welcome to Zend Framework Nigeria ”. Our module is ready and can be access with the browser (i.e. http://localhost/zfnigeria/public/apps/home ). In the next tutorial we are going to talk about our website and look at editing our css and html to get the page in the screen cast below.