Está en la página 1de 33

GUÍA DE LABORATORIO 1

CakePHP 3 Web Framework


TECSUP Programación Web con PHP

LABORATORIO

Objetivos:

 Usar frameworks de desarrollo para crear aplicaciones Web con PHP.

Equipos, Materiales, Programas y Recursos:

 Sistema Operativo con soporte a Apache 2.


 PHP 5.4 y MySQL 5.
 Editor de texto.
 Navegador Web.

Introducción:

En la presente unidad, se detalla el uso de frameworks de desarrollo para PHP,


los cuales agilizan el desarrollo de aplicaciones Web, creando una arquitectura
base y ordenada.

Seguridad:

 Ubicar maletines y/o mochilas en el gabinete al final de aula de


laboratorio.
 No ingresar con líquidos ni comida al aula de laboratorio.
 Al culminar la sesión de laboratorio, apagar correctamente la computadora
y el monitor.

Preparación:

Durante el desarrollo de los temas de clase se tendrán ejercicios explicativos en


cada uno de los puntos, ello le dará a la sesión una interacción de la teoría y la
parte práctica, ya que en todo el momento el alumno podrá comprobar en su
propia PC, todos los ítems del manual.

Procedimiento y Resultados:

erick.benites@gmail.com Pág. 1
TECSUP Programación Web con PHP

Inicio con Framework CakePHP

1. Preparando los requisitos:

1.1. Instalar la plataforma WampServer (Apache/MySql/PHP sobre Win)


 Descargar la última versión estable del paquete wampserver (con PHP 5.5
o superior):
http://www.wampserver.com/

También es necesario que instale previamente las librerías de Visual Studio 2012 en caso no
las tenga: http://www.microsoft.com/en-us/download/details.aspx?id=30679

 Luego de la descarga proceda con la instalación:

 Acepte los acuerdos del programa:

erick.benites@gmail.com Pág. 2
TECSUP Programación Web con PHP

 Para este laboratorio se asume como ruta de instalación: c:\wamp\

 Acepte la creación de los accesos directos:

erick.benites@gmail.com Pág. 3
TECSUP Programación Web con PHP

 Finalmente, instalar:

 El siguiente cuadro solo dele click sobre el botón abrir para elegir el
navegador predeterminado:

erick.benites@gmail.com Pág. 4
TECSUP Programación Web con PHP

 En este caso no disponemos de un servidor de correos para especificar, así


que seleccionamos el botón siguiente:

erick.benites@gmail.com Pág. 5
TECSUP Programación Web con PHP

 Acepte los permisos para la aplicación en windows7:

 Al finalizar la instalación debe obtener debe aparecer el ícono del


wampserver en la barra de notificación de Windows de color verde:

En caso se muestre de color amarillo o rojo indica que no se ha iniciado


correctamente los servicios de apache/mysql, debe revisar las cusas.

 Verificar su directorio raíz del apache sea: c:\wamp\www

erick.benites@gmail.com Pág. 6
TECSUP Programación Web con PHP

 Probar el correcto funcionamiento de los servicios:

 Activar en el wampserver el módulo rewrite_module:

erick.benites@gmail.com Pág. 7
TECSUP Programación Web con PHP

1.2. Instalar Composer (Gestor de dependencias para PHP)


 Descargar la última versión estable del composer para Windows:
https://getcomposer.org/download/

 Proceder con la instalación luego de la descarga:

 En caso aparezca la advertencia acepte los permisos:

erick.benites@gmail.com Pág. 8
TECSUP Programación Web con PHP

 Acepte los valores predeterminados de instalación:

 Este punto es importante, debe indicar la ruta donde se encuentra instalado


PHP:

erick.benites@gmail.com Pág. 9
TECSUP Programación Web con PHP

 Especificar la ruta es: C:\wamp\bin\php\php5.5.12\php.exe

Recuerda que se debe contar con PHP 5.4 o superior.

erick.benites@gmail.com Pág. 10
TECSUP Programación Web con PHP

 Finalmente, proceder con la instalación:

Durante la instalación se descargará el archivo composer.phar.

 Luego, nos informa que se ha modificado nuestra variable PATH de


Windows con lo cual podremos usar el comando composer globalmente.

erick.benites@gmail.com Pág. 11
TECSUP Programación Web con PHP

 Probamos el correcto funcionamiento del comando composer. Para ello


abrimos una consola DOS y digitamos el siguiente comando:
composer list

erick.benites@gmail.com Pág. 12
TECSUP Programación Web con PHP

1.3. Instalar git (Sistema de control de versión para descargas)


 Descargar la última versión estable del comando git para Windows:
https://git-scm.com/downloads

erick.benites@gmail.com Pág. 13
TECSUP Programación Web con PHP

erick.benites@gmail.com Pág. 14
TECSUP Programación Web con PHP

erick.benites@gmail.com Pág. 15
TECSUP Programación Web con PHP

En la imagen anterior, debe seleccionar la segunda opción para configurar la


variable PATH de Windows y disponer del comando globalmente.

erick.benites@gmail.com Pág. 16
TECSUP Programación Web con PHP

erick.benites@gmail.com Pág. 17
TECSUP Programación Web con PHP

 Probamos el correcto funcionamiento del comando git, para ello abrimos


una consola DOS y digitamos el siguiente comando:
git --version

erick.benites@gmail.com Pág. 18
TECSUP Programación Web con PHP

2. Instalación de CakePHP Framework:


 Abrir una consola DOS y ejecutar el siguiente comando para ubicarnos
dentro del directorio público de apache:

cd c:\wamp\www

Mediante el comando composer creamos un proyecto nuevo llamado


“cakephp”:

composer create-project --prefer-dist cakephp/app cakephp

Por último preguntará si asignar permisos sobre el directorio recién creado


y Enter.

 Verificar que se haya creado los archivos en c:\wamp\www\cakephp:

erick.benites@gmail.com Pág. 19
TECSUP Programación Web con PHP

 Probar el funcionamiento del nuevo proyecto creado desde el navegador:

Más info: http://book.cakephp.org/3.0/en/quickstart.html

Podemos instalar manualmente el cake (sin composer) con solo


descargar el framework directamente desde su repositorio del GitHub:
https://github.com/cakephp/cakephp/releases

erick.benites@gmail.com Pág. 20
TECSUP Programación Web con PHP

 En netbeans debemos crear un proyecto nuevo PHP con fuentes


existentes con la ruta:
c:\wamp\www\cakephp

 Finalmente, click sobre el botón Finish.

 Observar la siguiente estructura del proyecto creado recientemente:

bin Contiene los comandos de desarrollo del


cakephp.
config Contiene los (pocos) archivos de
configuración que usa cakephp. Base de
datos, idioma, rutas, etc.
logs Reservado para los archivos logs del
framework.
plugins Reservado para los plugins adicionales que
puede usar el proyecto.
src Contendrá los archivos MVC de nuestra
aplicación que vamos a desarrollar
(Controladores. Vistas y Modelos).
tests Directorio reservado para las pruebas del
código.
tmp Directorio reservado para almacenar
archivos temporales del framework.
vendor Contiene las librerías del framework y
otras dependencias instaladas mediante
composer. No modificar.
webroot Es el directorio público de la aplicación.
Contiene archivos estáticos (javascript,
css, imágenes, fash, etc.)
.htaccess Archivo que hace posible la reescritura de
la URL (usado por el mod_rewrite).
composer.json Archivo de dependencias del proyecto.

erick.benites@gmail.com Pág. 21
TECSUP Programación Web con PHP

 Observar la estructura del directorio src:

Controller Contiene las clases controladores de la aplicación y sus


componentes.
Model Contiene las clases modelos de la aplicación,
comportamientos (behaviors) y orígenes de datos
(datasources).
View Contiene las clases que representan a las vistas
invocadas por cada controlador y ayudantes (helpers).
Template Contiene la lógica de presentación HTML, JSON, XML,
etc. Su extensión es *.ctp.

3. Configuración de CakePHP Framework:


 Crear la base de datos tienda (tienda.sql) y crear las tablas siguientes:

 Configurar el archivo /cakephp/config/app.php los valores de la


conexión a la base de datos tienda:

'Datasources' => [
'default' => [
'className' => 'Cake\Database\Connection',
'driver' => 'Cake\Database\Driver\Mysql',
'persistent' => true,
'host' => 'localhost',
//'port' => 'nonstandard_port_number',
'username' => 'root',
'password' => '',
'database' => 'tienda',
'encoding' => 'utf8',
'timezone' => 'UTC',
'flags' => [],

erick.benites@gmail.com Pág. 22
TECSUP Programación Web con PHP

'cacheMetadata' => true, // Si se va a modificar las tablas poner: false


'log' => false,

],

Actualmente CakePHP soporta MySQL, PostgreSQL, SQLServer y Oracle.


http://book.cakephp.org/3.0/en/orm/database-basics.html#supported-
databases

 Verificar que el framework haya podido conectarse a la base de datos:


http://localhost/cakephp/

4. Desarrollando el Modelo:

/calephp/src/Model/Entity/Rol.php
<?php
namespace App\Model\Entity;

use Cake\ORM\Entity;

class Rol extends Entity{

/calephp/src/Model/Entity/Usuario.php
<?php
namespace App\Model\Entity;

use Cake\ORM\Entity;

class Usuario extends Entity{

/calephp/src/Model/Table/RolesTable.php
<?php

erick.benites@gmail.com Pág. 23
TECSUP Programación Web con PHP

namespace App\Model\Table;

use Cake\ORM\Table;

class RolesTable extends Table{

public function initialize(array $config) {

$this->setTable('roles');
$this->setPrimaryKey('id');
$this->setEntityClass('App\Model\Entity\Rol');

// Indica el campo a mostrar en un input select


$this->displayField('nombre');
}

/calephp/src/Model/Table/UsuariosTable.php
<?php
namespace App\Model\Table;

use Cake\ORM\Table;

class UsuariosTable extends Table{

public function initialize(array $config) {

$this->setTable('usuarios');
$this->setPrimaryKey('id');
$this->setEntityClass('App\Model\Entity\Usuario');

// Relationship: many to one


$this->belongsTo('Roles', [
'className' => 'Roles',
'foreignKey' => 'roles_id',
'propertyName' => 'rol'
]);

5. Desarrollando el Controlador:

/calephp/src/Controller/RolesController.php
<?php
namespace App\Controller;

class RolesController extends AppController{

public function index() {


$roles = $this->Roles->find();
$this->set('roles', $roles);
}

erick.benites@gmail.com Pág. 24
TECSUP Programación Web con PHP

public function registrar() {

$rol = $this->Roles->newEntity();

if($this->request->is('post')){
$rol = $this->Roles->patchEntity($rol, $this->request->getData());
if($this->Roles->save($rol)){
$this->Flash->success('Registro guardado correctamente');
return $this->redirect(['action' => 'index']);
}else{
$this->Flash->error('Erro al momento de guardar');
}
}

$this->set('rol', $rol);
}

public function editar($id) {

$rol = $this->Roles->get($id);

if($this->request->is('put')){
$rol = $this->Roles->patchEntity($rol, $this->request->getData());
if($this->Roles->save($rol)){
$this->Flash->success('Registro actualizado correctamente');
return $this->redirect(['action' => 'index']);
}else{
$this->Flash->error('Erro al momento de actualizar');
}
}

$this->set('rol', $rol);
}

public function eliminar($id) {


$rol = $this->Roles->get($id);
if($this->Roles->delete($rol)){
$this->Flash->success('Registro eliminado correctamente');
}else{
$this->Flash->error('Erro al momento de eliminar');
}
return $this->redirect(['action' => 'index']);
}

/calephp/src/Controller/UsuariosController.php
<?php
namespace App\Controller;

class UsuariosController extends AppController{

public function initialize(){


parent::initialize();
$this->loadModel('Roles');
}

public function index() {

erick.benites@gmail.com Pág. 25
TECSUP Programación Web con PHP

$query = $this->Usuarios->find('all')->contain(['Roles']);
$this->set('usuarios', $query);
}

public function registrar() {


$usuario = $this->Usuarios->newEntity();
if($this->request->is('post')){
$usuario = $this->Usuarios->patchEntity($usuario, $this->request-
>getData());
if( $this->Usuarios->save($usuario) ) {
$this->Flash->success('Registro guardado correctamente');
$this->redirect(['action'=>'index']);
} else {
$this->Flash->error('Error al momento de guardar el registro');
}
}
$this->set('usuario', $usuario);

$query = $this->Roles->find('list');
$this->set('roles', $query);
}

public function editar($id) {


$usuario = $this->Usuarios->get($id);
if($this->request->is('put')){ // or post <form>
$usuario = $this->Usuarios->patchEntity($usuario, $this->request-
>getData());
if( $this->Usuarios->save($usuario) ) {
$this->Flash->success('Registro guardado correctamente');
$this->redirect(['action'=>'index']);
} else {
$this->Flash->error('Error al momento de guardar el registro');
}
}
$this->set('usuario', $usuario);

$query = $this->Roles->find('list');
$this->set('roles', $query);
}

public function eliminar($id) {


$usuario = $this->Usuarios->get($id);
if( $this->Usuarios->delete($usuario) ) {
$this->Flash->success('Registro eliminado correctamente');
} else {
$this->Flash->error('Error al momento de eliminar el registro');
}
$this->redirect(['action'=>'index']);
}

erick.benites@gmail.com Pág. 26
TECSUP Programación Web con PHP

6. Desarrollando la Vista (Template):

/cakephp/src/Template/Roles/index.ctp
<?php //foreach ($roles as $row) { var_dump($row); } ?>
<h2>Mantenimiento de Roles</h2>

<table border="1" width="100%">


<caption>Lista de Roles</caption>
<colgroup>
<col width="80"/>
<col/>
<col width="80"/>
<col width="80"/>
</colgroup>
<thead>
<th>ID</th>
<th>NOMBRE</th>
<th>&nbsp;</th>
<th>&nbsp;</th>
</thead>
<tbody>
<?php
foreach ($roles as $rol) {
?>
<tr>
<td><?= $rol->id ?></td>
<td><?= $rol->nombre ?></td>
<td><?= $this->Html->link('Editar', ['controller' => 'Roles', 'action' =>
'editar', $rol->id]) ?></td>
<td><?= $this->Html->link('Eliminar', '/roles/eliminar/'.$rol->id) ?
></td>
</tr>
<?php
}
?>
</tbody>
</table>

<br/>

<?= $this->Html->link('Nuevo', ['controller' => 'Roles', 'action' => 'registrar'])?>

/cakephp/src/Template/Roles/registrar.ctp
<?= $this->Form->create($rol); ?>
<fieldset>
<legend>Registro de Rol</legend>
<?= $this->Form->control('nombre', ['maxLength'=>20, 'label' =>
'Nombre']) ?>
<?= $this->Form->submit('Guardar'); ?>
</fieldset>
<?= $this->Form->end(); ?>

<br/>

<?= $this->Html->link('<< Regresar', ['controller' => 'Roles', 'action' =>


'index'])?>

erick.benites@gmail.com Pág. 27
TECSUP Programación Web con PHP

/cakephp/src/Template/Roles/editar.ctp
<?= $this->Form->create($rol); ?>
<fieldset>
<legend>Registro de Rol</legend>
<?= $this->Form->hidden('id') ?>
<?= $this->Form-> control('nombre', ['maxLength'=>20, 'label' =>
'Nombre']) ?>
<?= $this->Form->submit('Actualizar'); ?>
</fieldset>
<?= $this->Form->end(); ?>

<br/>

<?= $this->Html->link('<< Regresar', ['controller' => 'Roles', 'action' =>


'index'])?>

/cakephp/src/Template/Usuarios/index.ctp
<?php //foreach ($usuarios as $row) { var_dump($row); } ?>
<h2>Mantenimiento de Usuarios</h2>

<table border="1" width="100%">


<caption>Lista de Usuarios</caption>
<colgroup>
<col width="80"/>
<col/>
<col/>
<col/>
<col/>
<col width="80"/>
<col width="80"/>
</colgroup>
<thead>
<th>ID</th>
<th>USUARIO</th>
<th>ROL</th>
<th>NOMBRES</th>
<th>EMAIL</th>
<th>&nbsp;</th>
<th>&nbsp;</th>
</thead>
<tbody>
<?php
foreach ($usuarios as $usuario) {
?>
<tr>
<td><?= $usuario->id ?></td>
<td><?= $usuario->username ?></td>
<td><?= $usuario->rol->nombre ?></td>
<td><?= $usuario->nombres ?></td>
<td><?= $usuario->email ?></td>
<td><?= $this->Html->link('Editar', ['controller' => 'Usuarios', 'action'
=> 'editar', $usuario->id]) ?></td>
<td><?= $this->Html->link('Eliminar', ['controller' => 'Usuarios', 'action'
=> 'eliminar', $usuario->id]) ?></td>
</tr>
<?php

erick.benites@gmail.com Pág. 28
TECSUP Programación Web con PHP

}
?>
</tbody>
</table>

<br/>

<?= $this->Html->link('Nuevo', ['controller' => 'Usuarios', 'action' =>


'registrar'])?>

/cakephp/src/Template/Usuarios/registrar.ctp
<?= $this->Form->create($usuario); ?>
<fieldset>
<legend>Registro de Usuario</legend>
<?= $this->Form->control('username',['maxLength'=>20, 'label' =>
'Usuario']) ?>
<?= $this->Form->control('password',['maxLength'=>40, 'label' =>
'Clave']) ?>
<?= $this->Form->control('roles_id', ['type' => 'select', 'multiple' => false,
'options' => $roles, 'empty' => false]) ?>
<?= $this->Form->control('nombres',['maxLength'=>100, 'label' =>
'Nombres']) ?>
<?= $this->Form->control('email',['maxLength'=>100, 'label' =>
'Correo']) ?>
<?= $this->Form->submit('Guardar'); ?>
</fieldset>
<?= $this->Form->end(); ?>

<br/>

<?= $this->Html->link('<< Regresar', ['controller' => 'Usuarios', 'action' =>


'index'])?>

/cakephp/src/Template/Usuarios/editar.ctp
<?= $this->Form->create($usuario); ?>
<fieldset>
<legend>Registro de Usuario</legend>
<?= $this->Form->hidden('id') ?>
<?= $this->Form-> control('username',['maxLength'=>20, 'label' =>
'Usuario']) ?>
<?= $this->Form-> control('password',['maxLength'=>40, 'label' =>
'Clave']) ?>
<?= $this->Form-> control('roles_id', ['type' => 'select', 'multiple' => false,
'options' => $roles, 'empty' => false]) ?>
<?= $this->Form-> control('nombres',['maxLength'=>100, 'label' =>
'Nombres']) ?>
<?= $this->Form-> control('email',['maxLength'=>100, 'label' => 'Correo'])
?>
<?= $this->Form->submit('Actualizar'); ?>
</fieldset>
<?= $this->Form->end(); ?>

<br/>

<?= $this->Html->link('<< Regresar', ['controller' => 'Usuarios', 'action' =>


'index'])?>

erick.benites@gmail.com Pág. 29
TECSUP Programación Web con PHP

7. Modificar la plantilla principal de las vistas (layout default).

/cakephp/src/Template/Layout/default.ctp

Los estilos, scripts, imágenes, etc en /cakephp/webroot serán creados a


su criterio.

Cuando modifiques el layout, recuerda mantener estos helpers:

<?= $this->fetch('title') ?> <!—título del controlador -->

<?= $this->fetch('meta') ?> <!—toma la etiqueta meta de la vista embebida -->


<?= $this->fetch('css') ?> <!—toma la etiqueta css de la vista embebida -->
<?= $this->fetch('script') ?> <!—toma la etiqueta script de la vista embebida -->

<!—recuerde construir el menú de opciones a cada controlador -->


<?=$this->Html->link('Usuarios', ['controller' => 'usuarios'])?></li>

<?= $this->Flash->render() ?><!-- Mensajes desde los controladores -->

<?= $this->fetch('content') ?><!-- contenido de las plantillas de cada accion -->

Revisar las funciones del ‘helper’ Html:


http://book.cakephp.org/3.0/en/views/helpers/html.html

8. Ejecutar la aplicación:

http://localhost/cakephp/roles/
http://localhost/cakephp/usuarios/

erick.benites@gmail.com Pág. 30
TECSUP Programación Web con PHP

9. Debug:

Para visualizar el modo debug debe estar habilitado en el archivo


config/app.php:


'debug' => true,

Ejercicio Calificado

Desarrollar los módulos de mantenimiento (Listar, crear, actualizar y eliminar) de


las tablas categorias y productos, aplicar el framework bootstrap.

erick.benites@gmail.com Pág. 31
TECSUP Programación Web con PHP

Conclusiones:

En la presente sesión, se detalló el uso del framework CakePHP. Para ello, se


hicieron las operaciones básicas de manipulación de datos.

erick.benites@gmail.com Pág. 32