PHP Modelo - Vista - Controlador

Introdución

• Aquí temos unha explicación do que é Modelo-Vista-Controlador.

• Existen moitos frameworks PHP que nos permiten programar seguindo o patrón de deseño de software Model-View-Controller.

• Symhony
• Zend Framework
• CakePHP

• Nota: Como editor de texto para manexar os arquivos do proxecto no framework Laravel recomendo instalar Brackets.

Instalación

• Primeiro vídeo: basicamente fala de instalar composer e con el instalar Laravel.

Para instalar Laravel necesitamos:

• Ter php instalado.
• Ter composer instalador.
• Ter git instalado.

• Os pasos para instalar php os tedes na wiki.
• Os pasos para instalar composer os tedes na wiki.
• Os pasos para instalar git os tedes na wiki.
• Os pasos para instalar Mysql, un xestor de bases de datos, os tedes na wiki.

• Para instalar e crear un proxecto Laravel, dende consola, sen ser root,escribiremos situados no cartafol onde queiramos crear o proxecto: composer create-project laravel/laravel nome_proxecto "5.1.*"

Sendo 5.1 a versión de Laravel a utilizar

Para lanzar o servidor web do proxecto creado, estando no cartafol raíz de dito proxecto, escribiremos: php artisan serve

Aparecerá unha mensaxe informando de que o servidor web está levantado e escoitando no porto 8000. Escribiremos na URL do navegador: http://localhost:8000

• Artisan é un comando de Laravel. Podedes consultalo neste enlace.

• Para executar un comando de artisan temos que escribir: php artisan comando dende o raíz do sitio web creado.

• Cando creamos un modelo coa orde: php artisan make:model Note

Isto crea un arquivo de nome Note.php no cartafol /app no raíz do proxecto.

Primeiros pasos

• Primeiros pasos.
• Coñecendo a estruturas de carpetas.

Nesta parte imos usar diferentes 'verbos' do protocolo HTTP.

Instalaremos o complemento de firefox HttpRequester para simular o envío utilizando os verbos (get, post, put,...).

Exercicios: Unha vez lido os puntos anteriores deberedes facer diferentes rutas utilizando diferentes verbos có complemento.

Coidado coa orde das rutas, xa que se temos varias rutas nas que especificamos verbos que coincidan, cargará primeiro as que estean ao final do arquivo (por exemplo, unha con get e outra con match(['get']).

No caso das rutas que veñen na URL, se temos varias entradas no arquivo routes.php que coincidan coa mesma URL, cargará primeiro a que estea antes no arquivo routes.php.

EXEMPLO:

Exemplo de envío utilizando o método POST a url http://localhost:8000/testpost, sendo 'testpost' unha ruta previamente definida:

1 Route::post('/testpost',function() {
2    echo "Isto é un post a /testpost"; 
3 });

• Paso de parámetros na rutas.

• Durante o manual fala de utilizar un controlador para recibir un parámetro.

Se queredes facer a proba teredes que definir un arquivo php no cartafol: /proxecto/app/Http/Controllers/ControladorProba.php

O nome ControladorProba.php é un exemplo.

O código de dito arquivo pode ser algo parecido a isto:

 1 <?php
 2 
 3 namespace App\Http\Controllers;
 4 
 5 use App\User;
 6 use App\Http\Controllers\Controller;
 7 
 8 class ControladorProba extends Controller {
 9     
10     public function procedementoControlador($id){
11         return "Esta información ven dun controlador especifico. Recibido o dato $id";
12     }
13     
14 }

Como se pode ver, o nome da clase é igual ao nome do arquivo php. Deriva da clase Controller.

Leva un procedemento de nome 'procedementoControlador' cun parámetro.

Agora debemos crear a ruta que vai facer uso de esta clase controladora:

Modificamos o arquivo routes.php.

Route::get('controlador/{identificador}','ControladorProba@procedementoControlador');

Como vemos, agora en vez de ter unha función anónima, temos o nome da clase controladora (ControladorProba) e o nome do procedemento almacenado ao que vai chamar (procedementoControlador). Dito procedemento vai levar un parámetro que está definido na parte Get da orde route ({identificador}).

Agora podemos poñer unha URL da forma: http://localhost:8000/controlador/1000

Enviaremos o dato 1000 á clase controladora.

• Recurso:

• Páxina web para verificar unha expresión regular: regex101.com.

• Exercicios:

• Crea unha ruta con dous parámetros que sexan opcionais. Dalle un valor por defecto a cada un deles.
• Crea unha ruta que acepte como parámetro unha expresión regular de 5 números do 0 ao 7.
• Crea outra ruta que acepte como parámetro unha expresión regular que acepta un número-letras (número guión letras)

Solucións:

 1 Route::get('/opcionais/{param1?}/{param2?}',function($par1=1,$par2='valor defecto'){
 2    echo "O param1 ten valor $par1 e o param2 ten valor $par2"; 
 3 });
 4 
 5 Route::get('/rutaNumeros/{numero}',function($numero){
 6    echo "5 números de 0 ao 7: $numero";    
 7 })->where(array('numero' => '[0-7]{5}'));
 8 
 9 Route::get('/rutaNumerosCadea/{dato}',function($dato){
10    echo "Dato numérico-texto: $dato";    
11 })->where(array('dato' => '[0-7]+-[a-z|A-Z]+'));

• Mellora: A validación dos parámetros que enviamos dende a URL para que cumpran unhas determinadas condicións (por exemplo, no caso dun nif, que teña 8 números e unha letra), o podemos implementar da seguinte forma:

1 Route::pattern('id', '\d+');
2 Route::pattern('username', '[a-z]{3,16}');
3 
4 
5 Route::get('usuarios/{id}', 'UserController@obterInformacion');
6 Route::get('productos/{id}', 'ProductController@obterInformacion');

No exemplo, ao parámetro {id} estámoslle a indicar que sexa un número.

Establecemos con 'pattern' as condicións que teñen que cumprir os parámetros da URL.

Desta forma, o parámetro {id} terá que cumprir as regras indicadas en todas as rutas onde sexa empregado.

Máis información neste enlace.

Vistas

• Introdución ás vistas.

Exemplo 1 do manual anterior. Creación dunha vista

• Lembrar que as vistas é onde se atopa o código que vai amosarse ao usuario (html,css,javascript).

A vista foi creada previamente no cartafol: /raiz_proxecto/resources/views

Arquivo: algo.blade.php

 1 <!DOCTYPE html>
 2 <html lang="es">
 3 <head>
 4 	<meta charset="UTF-8">
 5 	<title>Isto é unha vista de proba</title>
 6 </head>
 7 <body>
 8 	<h1>Vista "algo"</h1>
 9 	<p>Esta é a miña primeira vista en Laravel</p>
10 </body>
11 </html>

Un exemplo de código dunha ruta (routes.php) cun if condicional para preguntar se a vista existe dende .

1 Route::get('vistas',function(){
2    if(view()->exists("algo")){
3         return view('algo');
4    }else {
5        echo "A vista non existe";
6    }
7 });

Exemplo 2 do manual anterior. Creación dunha vista nun cartafol e paso de parámetros á vista dende a ruta

• Seguindo o exemplo do manual, imos crear unha vista no cartafol /sitio_raiz/resources/views/outro.

Arquivo: index.blade.php

 1 <!DOCTYPE html>
 2 <html lang="es">
 3 <head>
 4 	<meta charset="UTF-8">
 5 	<title>Isto é unha vista de proba dentro dun cartafol</title>
 6 </head>
 7 <body>
 8 	<h1>Vista "algo" dentro dun cartafol</h1>
 9     <p>Benvido {{$nomeVista}}. Xa vexo que tes {{$idadeVista}} anos :)</p>
10 </body>
11 </html>

• Liña 9: Como vemos imos facer uso de dúas variables que van vir dende a ruta (poderían vir da mesma forma dende o controlador). Como estamos nun arquivo blade.php podemos facer uso da sintaxe das plantillas, no que para 'imprimir as variables' utilizamos {{ }}. Se queremos podemos facer uso da sintaxe 'clásica' de PHP, poñendo <?php echo $variable ?> ou a sintaxe abreviada:<?= $variable ?>.

Como norma xeral imos utilizar a sintaxe 'blade' xa que fai que o código sexa moito mais lexible.

Podedes ver as normas xerais de uso neste enlace.

Arquivo: routes.php

 1 Route::get('vistas',function(){
 2    if(view()->exists("outro.index")){
 3        $nome='Angel';
 4        $idade=45;
 5        return view('outro.index',[
 6             'nomeVista' => $nome,
 7             'idadeVista' => $idade
 8         ]);
 9    }else {
10        echo "A vista non existe";
11    }
12 });

• Como vemos no return view enviamos en forma de array as variables que imos utilizar na vista (nomeVista e idadeVista) cos valores das variables definidas na ruta ($nome e $idade).

• Exercicio proposto: Modifica a ruta anterior para que reciba dous parámetros e sexan os que se envíen á vista (Nota: podemos ter as dúas vistas á vez)

Solución:

 1 Route::get('vistas/{nome}/{idade}',function($nome,$idade){
 2    if(view()->exists("outro.index")){
 3        return view('outro.index',[
 4             'nomeVista' => $nome,
 5             'idadeVista' => $idade
 6         ]);
 7    }else {
 8        echo "A vista non existe";
 9    }
10 });

Controlador

• Controladores.

A diferenza do feito ata o de agora, non imos a chamar á vista directamente dende a páxina 'router.php', se non que imos chamar a unha páxina 'controller' que é a que vai invocar a vista.

Ven ser unha ponte entre o controlador frontal e as vistas, e vai ser dende onde chamemos ao modelo para obter ou enviar datos á base de datos.

• As páxinas controladoras se atopan no cartafol: app/Http/Controllers

Exercicio 1. Creación dun controlador

• Para crear unha páxina controlador podemos facer uso do comando php artisan dende o raíz do noso proxecto laravel da forma:

1 php artisan make:controller CategoriasController

Isto creará unha páxina de nome 'CategoriasController' no cartafol 'app/Http/Controllers'.

• Nota: Podemos crear clases controladoras dentro de cartafoles da seguinte forma:

1 php artisan make:controller CARTAFOL/CategoriasController

• Modifica o exercicio anterior e fai que a vista sexa cargada dende o controlador.

A forma de carga a vista é a mesma (return view) pero agora terás que enviarlle os datos que van chegar á clase controladora en forma de parámetros dende route.php.

Solución:

Arquivo routes.php

1 Route::get('vistas/{nome}/{idade}','DatosController@amosarVista');

Arquivo DatosController.php

 1 <?php
 2 
 3 namespace App\Http\Controllers;
 4 
 5 use Illuminate\Http\Request;
 6 
 7 use App\Http\Requests;
 8 
 9 class DatosController extends Controller
10 {
11     // Poñemos $param_ para amosar como non teñen que chamarse igual que os parámetros definidos en router.php
12     public function amosarVista($param_nome,$param_idade){
13       return view('outro.index',[
14             'nomeVista' => $param_nome,
15             'idadeVista' => $param_idade
16         ]); 
17     }
18 }

Nota: Indicar que tamén podemos enviar array de datos á vista da seguinte forma

Arquivo DatosController.php

 1     public function amosarVista($param_nome,$param_idade){
 2         $datos = array();
 3         $datos[]=1;
 4         $datos[]=2;
 5         return view('outro.index',[
 6             'nomeVista' => $param_nome,
 7             'idadeVista' => $param_idade,
 8             'datosArray' => $datos
 9         ]); 
10     }

Arquivo index.blade.php (a vista)

 1     ...............
 2    <p>Volcado dos datos do array como fixemos en PHP:
 3     <?php
 4         var_dump($datosArray);
 5     ?>
 6     </p>
 7     <p>
 8     Forma de percorrer un array en blade (máis lexible)<br />
 9     @foreach ($datosArray as $n)
10         Valor: {{ $n }}
11     @endforeach
12     </p>    
13 
14     <p>
15         Un dato en PHP:<?= $datosArray[0]?><br />
16         Un dato en Blade:{{$datosArray[1]}}
17     </p>
18 </body>

Exercicio 2. Creación dun controlador

• Crea unha nova ruta que responda a petición get: www.oteusitio.es/buscar/nif/, sendo nif un nif válido (9 díxitos e unha letra).

En caso de que sexa correcto, enviarase a unha vista de nome DatosAlumnos.blade.php, creada no cartafol ALUMNOS/, o nif xunto cun array cos seguintes datos: 'nome'=>'Angel', 'Idade=>45'. Dita vista amosará dentro dun <h5> e en cor vermella os datos enviados, en forma de lista desordenada.

O control de se se carga unha vista ou outra deberase facerse dende unha clase Controller de nome AlumnosController, dentro dun cartafol ALUMNOS/, e unha función de nome 'buscarAlumnos'.

Solución:

Arquivo routes.php

1 Route::get('buscar/{nif}','ALUMNOS\AlumnosController@buscarAlumnos')->where(['nif' => '[0-9]{8}[A-Z]']);

Arquivo ALUMNOS/AlumnosController.php

 1 <?php
 2 
 3 namespace App\Http\Controllers\ALUMNOS;
 4 
 5 use Illuminate\Http\Request;
 6 
 7 use App\Http\Requests;
 8 use App\Http\Controllers\Controller;
 9 
10 class AlumnosController extends Controller
11 {
12     public function buscarAlumnos($nif){
13         if (view()->exists('ALUMNOS.DatosAlumnos')){
14             $datos=['nome'=>'Angel','idade'=>45];
15             return view ('ALUMNOS.DatosAlumnos',[
16             'nif' => $nif,
17             'datos' => $datos]);
18         }
19         else{
20             return 'Non se pode cargar a páxina...';
21         }
22         
23         
24     }
25 }

Arquivo ALUMNOS/DatosAlumnos.blade.php

 1 <!DOCTYPE html>
 2 <html lang="es">
 3 <head>
 4 	<meta charset="UTF-8">
 5 	<title>Datos do alumno buscado</title>
 6 </head>
 7 <body>
 8 
 9     <ul>
10         <li>Nif:{{ $nif }}</li>
11     @foreach ($datos as $key=>$valor)
12         <li>{{ $key }}:{{ $valor }}</li>
13     @endforeach
14     </ul>
15  
16 
17 </body>
18 </html>

HTTP Request

• HTTP Request.

Exemplo 1 do manual anterior. Uso de Http request

• Neste exemplo imos ver como a partires dun formulario no que se pide login-password imos recibir có método 'post' os datos do mesmo noutra vista.

Partimos do formulario.

Arquivo: /proxecto_raiz/resources/views/formulario/Formulario.blade.php

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 2     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3 <html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es">
 4     <head>
 5         <meta charset="utf-8" />
 6         <title>Formulario</title>
 7         <style>
 8             .formularios{
 9                 width: 30%;
10                 margin: 0px auto;
11             }
12             .etiqueta{
13                 float: left;
14                 width: 190px;
15             }
16             .botonesformularios{
17                 width: 50%;
18                 margin: 30px auto;
19                 text-align: center;
20             }
21             select {
22                 width:50%;
23             }
24         </style>
25     </head>
26     <body>
27         <form id="frmValidacion" class="formularios" method="post" action="/controlador">
28             <div>    
29                 <div class='etiqueta'>Login:</div>
30                 <input type="text" size="15" maxlength="15" name="txtLogin" />
31             </div>                
32             <div>
33                 <div class='etiqueta'>Password:</div>
34                 <input type="password" size="15" maxlength="15" name="txtPassword" />
35             </div>                
36             <div class="botonesformularios">
37                 <input type='submit' value="ENVIAR" />
38             </div>
39         </form>
40 
41     </body>    
42 </html>

Liña 27: Como vemos na action do formulario imos invocar un controlador a través dunha ruta definida no arquivo routes.php.

• Definimos unha ruta para cargar a vista do formulario:

Arquivo: proxecto_raiz/app/Http/routes.php

1 Route::get('formulario/',function(){
2     return view('formulario.Formulario');
3 });

Nota: Por practicar estamos amosando a vista directamente dende a ruta, cando deberíamos pasar por un controlador.

Se poñemos como url: http://localhost:8000/formulario aparecerá o formulario.

• Indicamos no arquivo de routes.php que se ten que facer cando reciba unha chamada do formulario. Fixarse como o verbo da ruta é post.

Arquivo: proxecto_raiz/app/Http/routes.php

1 Route::post('controlador/','ControladorProbaController@mostrarUriUrl');

• Agora creamos a clase controladora e método mostrarUriUrl dentro dela.

 1 <?php
 2 
 3 namespace App\Http\Controllers;
 4 
 5 use App\User;
 6 use App\Http\Controllers\Controller;
 7 use Illuminate\Http\Request;
 8 
 9 class ControladorProbaController extends Controller {
10     
11     public function procedementoControlador($id){
12         return "Esta información ven dun controlador especifico. Recibido o dato $id";
13     }
14     
15     public function mostrarUriUrl(Request $request){
16         echo $request->path();
17         echo "<br>";
18         echo $request->url();
19         echo "<br>";
20 
21         
22         var_dump($request->all());  // ou dd(($request->all())); ou print_r(($request->all()));
23         
24     }
25     
26 }

Nota:

• $request->all(): Devolve todos os datos enviados polo formulario.
• $request->input('txtLogin'): Devolve o texto do campo con name 'login' do formulario.

• Dará como resultado:

controlador
http://localhost:8000/controlador

/home/angel/laravel/first_steps/app/Http/Controllers/ControladorProbaController.php:22:
array (size=2)
  'txtLogin' => string 'dfsdf' (length=5)
  'txtPassword' => string 'dsfds' (length=5)

• Máis información neste enlace.

Exercicio 1

• Modifica o código anterior e crea unha vista de nome 'DatosFormulario.blade.php' que se atopa no cartafol 'formulario' dentro das views, que visualice o login e password enviado polo formulario.

• Solución

Páxina: DatosFormulario.blade.php

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 2     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3 <html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es">
 4     <head>
 5         <meta charset="utf-8" />
 6         <title>Formulario</title>
 7     </head>
 8     <body>
 9         LOGIN:{{$datos['txtLogin']}}<br />
10         PASSWORD:{{$datos['txtPassword']}}
11         
12 
13     </body>    
14 </html>

Páxina: ControladorProbaController.blade.php

1 <?php
2     ...................
3     
4     public function mostrarUriUrl(Request $request){
5         return view('formulario/DatosFormulario',['datos'=>$request->all()]);
6         
7        
8     }
9 }

Introdución aos modelos

• Introdución aos modelos.

Exemplo 1 do manual anterior

• Temos que ter creada unha base de datos Mysql cun usuario e password que teña permiso sobre dita base de datos.

• Os pasos para instalar Mysql, un xestor de bases de datos, os tedes na wiki.

Unha vez creada debemos editar o arquivo proxecto_raiz/app/.env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_DATABASE=homestead
DB_USERNAME=laravel
DB_PASSWORD=laravel

Unha vez cambiado debemos parar o servidor laravel e volvelo a iniciar coa orde: php artisan serve dende o raíz do proxecto.

• Partindo que xa temos a táboa e a base de datos seguindo o manual...

• Imos facer que se amosen os datos nunha vista en forma de lista.

• Arquivo: proxecto_raiz/resources/views/basedatos/articles.blade.php

 1 <!DOCTYPE html>
 2 <html lang="es">
 3 <head>
 4 	<meta charset="UTF-8">
 5 	<title>Isto é unha vista de proba dunha táboa mysql</title>
 6 </head>
 7 <body>
 8     <!-- Formato utilizando blade --> 
 9     <ul>
10     @foreach ($datos as $fila)
11         <li>{{ $fila->id }}---->{{ $fila->name }}</li>
12     @endforeach
13     </ul>
14 
15 
16     <!-- Formato utilizando php tradicional --> 
17     <ul>
18         <?php
19             foreach($datos as $fila){
20                 printf("<li>%s--->%s",$fila->id,$fila->name);
21             }
22 
23         ?>
24         
25     </ul>
26 </body>
27 </html>

Liña 10: Nomeamos $datos á variable que vai vir do controlador cos datos da táboa. Segundo o manual isto non é necesario xa que podemos acceder dende calquera parte aos datos do modelo coa orde: \App\Article::all(); Pero desta forma practicamos o paso de datos dende o controlador e ademáis supoño que será a forma correcta :)

• Arquivo: /proxecto_raiz/app/Http/Controllers/ArticulosController.php

 1 <?php
 2 
 3 namespace App\Http\Controllers;
 4 
 5 use App\User;
 6 use App\Http\Controllers\Controller;
 7 use Illuminate\Http\Request;
 8 
 9 class ArticulosController extends Controller {
10     
11     public function amosarArticulos(){
12         $datos=\App\Article::all();
13         return view('basedatos.articles',[
14             'datos' => $datos
15         ]);
16 
17     }
18     
19     
20 }

Liñas 13,14: Dende este método do controlador enviamos os datos da táboa á vista.

• Arquivo: /proxecto_raiz/app/Http/routes.php

1 Route::get('articulos/','ArticulosController@amosarArticulos');

Cando na url poñamos: http://localhost:8000/articulos chamará ao método amosarArticulos do controlador ArticulosController.

• Resultado:

    1--->Probando
    2--->Algo
    3--->Lindo

-- Ángel D. Fernández González -- (2016).