View source for Web Frameworks - Workbook - Week 02

[[Main Page]] >> [[CP2132|Web Frameworks]] >> [[Web Frameworks - Workbook|Workbook]] >> Workshop - week 02

== Install Zend Framework ==

Zend is already installed on mi-linux, so you don't have to worry about that... However if you wish to install it at home, please see [http://framework.zend.com/docs/quickstart/create-your-project this page]

== Step 1 - Create Your Project ==

Open a terminal (command window if you are working on Linux, Putty if you are working from Windows). 
Navigate to a directory where you would like to start a project (in this case your public_html folder). Then execute the following: 

<pre>
zf.sh create project quickstart
</pre>

Note: "quickstart" is the name of your project... you can call it anything you like! (but avoid spaces please).

Running this command will create your basic site structure, including your initial controllers and views. The tree looks like the following: 

<pre>
quickstart
|-- application
|   |-- Bootstrap.php
|   |-- configs
|   |   `-- application.ini
|   |-- controllers
|   |   |-- ErrorController.php
|   |   `-- IndexController.php
|   |-- models
|   `-- views
|       |-- helpers
|       `-- scripts
|           |-- error
|           |   `-- error.phtml
|           `-- index
|               `-- index.phtml
|-- library
|-- public
|   `-- index.php
`-- tests
    |-- application
    |   `-- bootstrap.php
    |-- library
    |   `-- bootstrap.php
    `-- phpunit.xml
</pre>

Important: you need to set the permissions so you can browse to your files from a web browser... this command will do the trick:

<pre>
chmod 755 quickstart -R
</pre>

== Step 2 - Edit the .htaccess file ==

The public/.htaccess file (generated automatically above) contains URL rewriting rules that reformat your website's URLs into more user friendly ones... On mi-linux you need to add the following line though:

<pre>
RewriteBase /~in9352/zend/quickstart/public/
</pre>

So the file should now look like this:

<pre>
SetEnv APPLICATION_ENV development

RewriteEngine On
RewriteBase /~in9352/zend/quickstart/public/

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]
</pre>

==[[Image:Bg-checkpoint.png]] Checkpoint ==

Your project is now created and accessible:
http://mi-linux.wlv.ac.uk/~0123456/quickstart/public/

(obviously replace "0123456" by your own student number, and "quickstart" by your own project name!)

Your homepage should look like this:

[[Image:zend_01.jpg]]

Obviously it's not doing much just yet, but it's a start! Now let's try and understand how it all works.

== The Bootstrap ==

Your Bootstrap class defines what resources and components to initialize. By default, Zend Framework's Front Controller is intialized, and it uses the application/controllers/ as the default directory in which to look for action controllers (more on that later). The class looks like the following:

<pre>
// application/Bootstrap.php

class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
}
</pre>

As you can see, not much is necessary to begin with. 

==Configuration==

While Zend Framework is itself configurationless, you often need to configure your application. The default configuration is placed in application/configs/application.ini, and contains some basic directives for setting your PHP environment (for instance, turning error reporting on and off), indicating the path to your bootstrap class (as well as its class name), and the path to your action controllers. It looks as follows: 

<pre>
; application/configs/application.ini

[production]
phpSettings.display_startup_errors = 0
phpSettings.display_errors = 0
includePaths.library = APPLICATION_PATH "/../library"
bootstrap.path = APPLICATION_PATH "/Bootstrap.php"
bootstrap.class = "Bootstrap"
resources.frontController.controllerDirectory = APPLICATION_PATH "/controllers"

[staging : production]

[testing : production]
phpSettings.display_startup_errors = 1
phpSettings.display_errors = 1

[development : production]
phpSettings.display_startup_errors = 1
phpSettings.display_errors = 1
</pre>

Several things about this file should be noted. First, when using INI-style configuration, you can reference constants directly and expand them; APPLICATION_PATH is actually a constant. Additionally note that there are several sections defined: production, staging, testing, and development. The latter three inherit settings from the "production" environment. This is a useful way to organize configuration to ensure that appropriate settings are available in each stage of application development. 

==Action Controllers==

Your application's action controllers contain your application workflow, and do the work of mapping your requests to the appropriate models and views.

An action controller should have one or more methods ending in "Action"; these methods may then be requested via the web. By default, Zend Framework URLs follow the schema /controller/action, where "controller" maps to the action controller name (minus the "Controller" suffix) and "action" maps to an action method (minus the "Action" suffix).

Typically, you always need an IndexController, which is a fallback controller and which also serves the home page of the site, and an ErrorController, which is used to indicate things such as HTTP 404 errors (controller or action not found) and HTTP 500 errors (application errors).

The default IndexController is as follows: 

<pre>
// application/controllers/IndexController.php

class IndexController extends Zend_Controller_Action
{

    public function init()
    {
        /* Initialize action controller here */
    }

    public function indexAction()
    {
        // action body
    }
}
</pre>

And the default ErrorController is as follows: 

<pre>
// application/controllers/ErrorController.php

class ErrorController extends Zend_Controller_Action
{

    public function errorAction()
    {
        $errors = $this->_getParam('error_handler');
        
        switch ($errors->type) { 
            case Zend_Controller_Plugin_ErrorHandler::EXCEPTION_NO_CONTROLLER:
            case Zend_Controller_Plugin_ErrorHandler::EXCEPTION_NO_ACTION:
        
                // 404 error -- controller or action not found
                $this->getResponse()->setHttpResponseCode(404);
                $this->view->message = 'Page not found';
                break;
            default:
                // application error 
                $this->getResponse()->setHttpResponseCode(500);
                $this->view->message = 'Application error';
                break;
        }
        
        $this->view->exception = $errors->exception;
        $this->view->request   = $errors->request;
    }
}
</pre>

You'll note that (1) the IndexController contains no real code, and (2) the ErrorController makes reference to a "view" property. That leads nicely into our next subject.

==Views==

Views in Zend Framework are written in plain old PHP. View scripts are placed in application/views/scripts/, where they are further categorized using the controller names. In our case, we have an IndexController and an ErrorController, and thus we have corrsponding index/ and error/ subdirectories within our view scripts directory. Within these subdirectories, you will then find and create view scripts that correspond to each controller action exposed; in the default case, we thus have the view scripts index/index.phtml and error/error.phtml.

View scripts may contain any markup you want, and use the <?php opening tag and ?> closing tag to insert PHP directives.

The following is what we install by default for the index/index.phtml view script: 

<pre>
<!-- application/views/scripts/index/index.phtml -->
<style>
    
    a:link,
    a:visited
    {
        color: #0398CA;
    }

    span#zf-name
    {
        color: #91BE3F;
    }

    div#welcome
    {
        color: #FFFFFF;
        background-image: url(http://framework.zend.com/images/bkg_header.jpg);
        width:  600px;
        height: 400px;
        border: 2px solid #444444;
        overflow: hidden;
        text-align: center;
    }
    
    div#more-information
    {
        background-image: url(http://framework.zend.com/images/bkg_body-bottom.gif);
        height: 100%;
    }

</style>
<div id="welcome">
    <h1>Welcome to the <span id="zf-name">Zend Framework!</span><h1 />
    <h3>This is your project's main page<h3 />
    <div id="more-information">
        <p>
            <img src="http://framework.zend.com/images/PoweredBy_ZF_4LightBG.png" />
        </p>

        <p>
            Helpful Links: <br />
            <a href="http://framework.zend.com/">Zend Framework Website</a> |
            <a href="http://framework.zend.com/manual/en/">Zend Framework 
                Manual</a>
        </p>
    </div>
</div>
</pre>

The error/error.phtml view script is slightly more interesting as it uses some PHP conditionals: 

<pre>
<!-- application/views/scripts/error/error.phtml -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"; 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>  
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <title>Zend Framework Default Application</title> 
</head> 
<body> 
  <h1>An error occurred</h1> 
  <h2><?php echo $this->message ?></h2> 

  <?php if ('development' == $this->env): ?> 
  
  <h3>Exception information:</h3> 
  <p> 
      <b>Message:</b> <?php echo $this->exception->getMessage() ?> 
  </p> 

  <h3>Stack trace:</h3> 
  <?php echo $this->exception->getTraceAsString() ?> 

  <h3>Request Parameters:</h3> 
  <?php echo var_export($this->request->getParams(), 1) ?> 
  <?php endif ?>
  
</body> 
</html>
</pre>