En la primera parte de esta serie vimos que son los frameworks, las razones para usar Zend Framework y, finalmente, analizamos como instalarlo. En este artículo crearemos nuestro primer proyecto. Vamos a eso.
Nota: se asume que conoces el Modelo Vista Controlador.
Nuestro Primer Proyecto
Zend Framework tiene una clase llamada “Bootstrap” que nos permite iniciar los recursos que utilizaremos en nuestro proyecto, la ubicación de esta clase es: /var/www/zf/primer-proyecto/application/Bootstrap.php.
Lo primero que haremos es agregar al Bootstrap la funcionalidad de autocarga de recursos:
// /var/www/zf/primer-proyecto/application/Bootstrap.php
<?php
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
protected function _initAutoload()
{
$moduleLoader = new Zend_Application_Module_Autoloader(array(
'namespace' => '',
'basePath' => APPLICATION_PATH));
return $moduleLoader;
}
}En nuestras aplicaciones con Zend Framework tenemos controladores (controllers) y dentro de ellos existen acciones (actions), así si por ejemplo estuviéramos programando un blog y llamamos a: http://localhost/zf/primer-proyecto/public/entradas/agregar, el controlador sería “entradas” y la acción “agregar”.
Para nuestro proyecto inicial lo que haremos es un directorio de contactos, es decir, una aplicación simple que nos servirá para gestionar la información relacionada con las personas que conocemos. Como es un proyecto simple nos basta con trabajar con el controlador por defecto (“index”) y dentro de este las siguientes acciones:
Creando el controlador
Para crear nuestras acciones basta con abrir una terminal, acceder al directorio de nuestro proyecto (/var/www/zf/primer-proyecto/application/controllers) y ejecutar los siguientes comandos:
zf create action add index
zf create action edit index
zf create action delete index
Estos crearan las acciones “add”, “edit” y “delete” dentro del controlador “index”. Si todo se realizó correctamente deberías poder ver dentro del directorio application/controllers un archivo llamado “IndexController.php” que contiene las acciones antes mencionadas:
<?php
class IndexController extends Zend_Controller_Action
{
public function init()
{
/* Initialize action controller here */
}
public function indexAction()
{
// action body
}
public function addAction()
{
// action body
}
public function editAction()
{
// action body
}
public function deleteAction()
{
// action body
}
}Estos mismos comandos además de crear el controlador y sus acciones también crea las vistas que mas tarde utilizaremos.
Resumiendo ya tenemos la siguiente estructura:
Si pruebas cada URL deberías ver el siguiente mensaje (con excepción de la primera URL que tiene aún la vista por defecto de Zend Framework)
View script for controller index and script/action name delete
Creando el modelo
En el apartado anterior definimos el esquema general del controlador y ahora es tiempo que trabajemos en el modelo.
Lo primero es que configuremos la información de nuestra base de datos, para esto abrimos el archivo: “/var/www/zf/primer-proyecto/application/configs/application.ini” y agregamos dentro de “[production]” (antes de “[staging : production]”), lo siguiente:
resources.db.adapter = PDO_MYSQL
resources.db.params.host = localhost
resources.db.params.username = usuario
resources.db.params.password = clave
resources.db.params.dbname = nombrebasededatos
A continuación crearemos la tabla que almacenará nuestros contactos. Para esto podemos usar phpmyadmin o el programa de tu preferencia:
CREATE TABLE `zfdb`.`contacts` (
`id` INT NOT NULL AUTO_INCREMENT ,
`name` VARCHAR( 30 ) NOT NULL ,
`lastname` VARCHAR( 30 ) NOT NULL ,
`email` VARCHAR( 60 ) NOT NULL ,
PRIMARY KEY ( `id` )
)
Además agregaremos una entrada a la tabla para tener datos con los que trabajar:
INSERT INTO contacts (name,lastname,email)
VALUES
('Juan','Perez','juan@perez.com'),
('Maria','Gonzalez','maria@gonzalez.com'),
('Sofia','Alvarez','sofía@alvarez.com'),
('Pedro','Sanchez','pedro@sanchez.com');Una vez realizado esto podemos generar nuestro modelo creando el siguiente archivo:
<?php
class Model_Table_Contacts extends Zend_Db_Table
{
protected $_name = 'contacts';
public function getContact($id)
{
$id = (int)$id;
$row = $this->fetchRow('id = ' . $id);
if (!$row) {
throw new Exception("No se encuentra la fila $id");
}
return $row->toArray();
}
public function addContact($name, $lastname, $email)
{
$data = array(
'name' => $name,
'lastname' => $lastname,
'email' => $email,
);
$this->insert($data);
}
function updateContact($id, $name, $lastname, $email)
{
$data = array(
'name' => $name,
'lastname' => $lastname,
'email' => $email,
);
$this->update($data, 'id = '. (int)$id);
}
function deleteContact($id)
{
$this->delete('id =' . (int)$id);
}
}Así dentro del modelo tendremos los métodos que nos ayudarán a interactuar con nuestra base de datos.
Creando las vistas
En Zend Framework encontramos las vistas en el directorio “views” y se organizan de la forma: views/scripts/{nombredelcontrolador}/{nombredelaaccion}.phtml .
Como te habrás dado cuenta nuestras vistas ya están creadas (ocurrió cuando creamos el controlador en el punto 4.1), ahora corresponde que nos ocupemos del “layout”.
En la mayoría de los proyectos hay partes de código HTML que se repite para todas las vistas, por ejemplo: un encabezado, una columna lateral y el pie de página. Para evitar repetir código es que existe la posibilidad de crear un “layout” o plantilla donde colocaremos el código común y desde donde llamaremos las vistas.
Lo primero que debemos hacer es crear el directorio: “application/layouts/” y agregar en nuestro archivo de configuración (configs/applications.ini) la siguiente linea (justo después de la configuración de la base de datos que agregamos):
resources.layout.layoutpath = APPLICATION_PATH “/layouts”
También agregaremos las definiciones generales para nuestro layout editando la clase Bootstrap (“/application/Bootstrap”) y agregando lo siguiente:
function _initViewHelpers()
{
$this->bootstrap('layout');
$layout = $this->getResource('layout');
$view = $layout->getView();
$view->doctype('XHTML1_STRICT');
$view->headMeta()->appendHttpEquiv('Content-Type', 'text/html;charset=utf-8');
$view->headTitle()->setSeparator(' - ');
$view->headTitle('Primeros pasos en Zend Framework');
}Por último crearemos el archivo de nuestro “layout” en “/application/layouts/layout.phtml”:
<?php echo $this->doctype(); ?>
<html>
<head>
<?php echo $this->headMeta(); ?>
<?php echo $this->headTitle(); ?>
</head>
<body>
<h1><?php echo $this->escape($this->title); ?></h1>
<?php echo $this->layout()->content; ?>
</body>
</html>Con esto finalizamos lo relacionado con la estructura del sistema, en adelante nos corresponde “darle vida” a sus funcionalidades.
Implementando las funcionalidades
En esta quinta parte analizaremos como implementar las funcionalidades de nuestro sistema, es decir, como mostrar, agregar, editar y eliminar nuestros contactos.
Mostrando los contactos
El primer paso es agregar la lógica de la funcionalidad en la acción del controlador, por lo que vamos a “/application/controllers/IndexController.php” y agregamos lo siguiente en nuestra acción por defecto (“indexAction”):
// action body
// Título de la vista
$this->view->title = "Mis Contactos";
// Iniciamos una instancia del nuestro modelo
$contacts = new Model_Table_Contacts();
// Asignamos a la vista el resultado de consultar por todos los registros
$this->view->contacts = $contacts->fetchAll();
El segundo paso es ir a la vista para esta acción (“/application/ views/ scripts/ index/ index.phtml”) y cambiamos su contenido por el siguiente:
<p><a href="<?php echo $this->url(array('controller'=>'index','action'=>'add'));?>">Agregar contacto</a></p>
<table>
<tr>
<th>Nombre</th>
<th>Apellido</th>
<th>Correo</th>
<th> </th>
</tr>
<?php foreach($this->contacts as $contact) : ?>
<tr>
<td><?php echo $this->escape($contact->name);?></td>
<td><?php echo $this->escape($contact->lastname);?></td>
<td><?php echo $this->escape($contact->email);?></td>
<td>
<a href="<?php echo $this->url(array('controller'=>'index','action'=>'edit','id'=>$contact->id));?>">Editar</a>
<a href="<?php echo $this->url(array('controller'=>'index','action'=>'delete','id'=>$contact->id));?>">Borrar</a>
</td>
</tr>
<?php endforeach; ?>
</table>Ahora si abrimos la página de inicio (“http://localhost/zf/primer-proyecto/public/index/”) nos deberíamos encontrar con lo siguiente:
Agregando contactos
Para agregar contactos crearemos un formulario en “/application/forms/Contact.php ”:
<?php
// Creamos una clase que extiende el componente Zend_Form
class Form_Contact extends Zend_Form
{
public function __construct($options = null)
{
parent::__construct($options);
$this->setName('contact');
$id = new Zend_Form_Element_Hidden('id');
$name = new Zend_Form_Element_Text('name');
$name->setLabel('Nombre')
->setRequired(true)
->addFilter('StripTags')
->addFilter('StringTrim')
->addValidator('NotEmpty');
$lastname = new Zend_Form_Element_Text('lastname');
$lastname->setLabel('Apellido')
->setRequired(true)
->addFilter('StripTags')
->addFilter('StringTrim')
->addValidator('NotEmpty');
$email = new Zend_Form_Element_Text('email');
$email->setLabel('Correo')
->setRequired(true)
->addFilter('StripTags')
->addFilter('StringTrim')
->addValidator('NotEmpty');
$submit = new Zend_Form_Element_Submit('submit');
$submit->setAttrib('id', 'submitbutton');
$this->addElements(array($id, $name, $lastname, $email, $submit));
}
}Ahora sólo nos resta agregar en nuestro controlador la lógica de la acción destinada a agregar contactos (addAction):
public function addAction()
{
$this->view->title = "Agregar un nuevo contacto";
$form = new Form_Contact();
$form->submit->setLabel('Agregar');
$this->view->form = $form;
if ($this->getRequest()->isPost()) {
$formData = $this->getRequest()->getPost();
if ($form->isValid($formData)) {
$name = $form->getValue('name');
$lastname= $form->getValue('lastname');
$email= $form->getValue('email');
$contact = new Model_Table_Contacts();
$contact->addContact($name, $lastname, $email);
$this->_redirect('/');
} else {
$form->populate($formData);
}
}
}Por último, en la vista de la acción “agregar” (/views/scripts/index/add.phtml) incluíremos:
<?php echo $this->form ;?>
Si vamos a http://localhost/zf/primer-proyecto/public/index/add deberíamos ver lo siguiente:
Editando los contactos
La acción dedicada a la edición de nuestros contactos es muy similar a la ocupada para agregarlos. Luego en “editAction()” agregaremos lo siguiente:
public function editAction()
{
// action body
$this->view->title = "Editar contacto";
$form = new Form_Contact();
$form->submit->setLabel('Guardar');
$this->view->form = $form;
if ($this->getRequest()->isPost()) {
$formData = $this->getRequest()->getPost();
if ($form->isValid($formData)) {
$id = (int)$form->getValue('id');
$name = $form->getValue('name');
$lastname = $form->getValue('lastname');
$email = $form->getValue('email');
$contacts = new Model_Table_Contacts();
$contacts ->updateContact($id, $name, $lastname, $email);
$this->_redirect('/');
} else {
$form->populate($formData);
}
} else {
$id = $this->_getParam('id', 0);
if ($id > 0) {
$contacts = new Model_Table_Contacts();
$form->populate($contacts->getContact($id));
}
}
}Mientras que en la vista de esta acción (/views/scripts/index/edit.phtml)
<?php echo $this->form ;?>
Al visitar http://localhost/zf/primer-proyecto/public/index/edit deberíamos encontrar lo siguiente:
Borrando contactos
Por último necesitamos implementar una funcionalidad para eliminar registros en nuestro sistema. Para esto en el controlador definiremos la acción “deleteAction”:
public function deleteAction()
{
// action body
$this->view->title = "Eliminar contactos";
if ($this->getRequest()->isPost()) {
$del = $this->getRequest()->getPost('del');
if ($del == 'Yes') {
$id = $this->getRequest()->getPost('id');
$contacts = new Model_Table_Contacts();
$contacts->deleteContact($id);
}
$this->_redirect('/');
} else {
$id = $this->_getParam('id', 0);
$contacts = new Model_Table_Contacts();
$this->view->contact = $contacts->getContact($id);
}
}Mientras que en la vista incluiremos un mensaje de confirmación del registro que se quiere borrar:
<p>Está seguro de querer borrar el contacto:
<?php echo $this->escape($this->contact['name']); ?> <?php echo $this->escape($this->contact['lastname']); ?>?
</p>
<form action="<?php echo $this->url(array('action'=>'delete')); ?>" method="post">
<div>
<input type="hidden" name="id" value="<?php echo $this->contact['id']; ?>" />
<input type="submit" name="del" value="Yes" />
<input type="submit" name="del" value="No" />
</div>Al intentar borrar un contacto nos debería mostrar la siguiente confirmación:
En este artículo hemos visto como desarrollar una pequeña aplicación usando Zend Framework. Si bien el uso de estas herramientas nos permiten mantener en orden un proyecto y, además, aumentar la velocidad de desarrollo, también se debe considerar el tiempo que hay que invertir en su aprendizaje.
Si quieres profundizar en Zend Framework un buen comienzo es el sitio oficial del proyecto y su documentación (http://framework.zend.com/). Además te recomiendo el libro que utilicé como base para este artículo: “Zend Framework in Action” (http://www.zendframeworkinaction.com/)
