Crear un página en symfony 3/4

Hemos visto que es symfony, cuales son los conocimientos necesarios para trabajar con este framework, hemos visto como instalarlo en nuestro ordenador y como comprobar las vulnerabilidades de una versión tanto en symfony 3 como en symfony 4

Ahora vamos a ir un paso mas y vamos a empezar a crear páginas con symfony y entender como este framework nos facilita la vida a la hora de programar nuestras webs en php y lo que nos reduce el trabajo a la hora de crear dichas páginas.


Si tienes cualquier duda hasta aqui de symfony o tienes dudas futuras te animo a que me contactes por twitter y me sigas para hacerme cualquier pregunta que estaré encantado de resolverte.

 

Creando una Página: Ruta y Controlador en symfony 3

Vamos a empezar creando un página en symfony 3 pero antes de empezar tenemos que realizar los siguientes pasos:

  1. Crear una ruta (URL, /about) que apunte a un controlador
  2. Crear un controlador. Con el controlador recibes la solicitud y lo transformas en un objeto respuesta.

Estos dos pasos son un requisito para cualquier aplicación symfony sea la versión que sea, ahora vamos a ver como crear una pagina en symfoy 3 y luego veremos las diferencias con symfony 4.

Supongamos que desea crear una página /lucky/number que genere un número afortunado (bien, al azar) y lo imprima. Para hacer eso, crea una "clase de controlador" y un método de "controlador" dentro de ella que se ejecutará cuando alguien vaya a /lucky/number:

Luckycontroller symfony 3

Para ver el resultado, ejecuta el servidor web interno de PHP y escribe la siguiente dirección:

http://localhost:8000/lucky/number

Observamos que se muestra en la página un número de la suerte.

Para llegar a este resultado hemos tenido que:

  • Crear una ruta : la @Route es la ruta que define el patrón de URL para esta página (/lucky/number). En este caso estamos usando una anotación dentro del controlador para redirigir a la ruta.
  • Crear un controlador : el método debajo de la ruta - numberAction() - se llama controlador . Se trata de una función donde se construye la página y en última instancia, devuelve un objeto Response . 

Crear una página en symfony 4

Vamos a ver las diferencias con symfony 3, en este caso no vamos a crear la ruta dentro del controlador, aquí unicamente generaremos una respuesta con el componente httpFoundation - Response.

Luckycontroller symfony 4

Ahora necesita asociar esta función de controlador con una URL pública (por ejemplo /lucky/number) para que el método number() se ejecute cuando un usuario navega hacia él. Esta asociación se define creando una ruta en el config/routes.yaml:

crear una ruta en el fichero config yml symfony 4

Para symfony 3 hicimos los mismos pasos que en symfony 4 pero en este caso la ruta esta en un archivo.

  • Crea una ruta : en config/routes.yaml, la ruta define la URL a tu página ( path) y qué controller llamar.
  • Crear un controlador : Se trata de una función donde se construye la página y en última instancia, devuelve un objeto Response

 

lucky number resultado

Rutas de anotación

En lugar de definir su ruta en un archivo YAML, Symfony también le permite usar rutas de anotación dentro del controlador como hicimos en symfony 3. Para hacer esto, instale el paquete de anotaciones:

composer require annotations

instalando anotaciones con composer symfony4

Con esto ya podemos agregar la ruta directamente en el controlador:

agregando la ruta directamente en el controlador de symfony4

Las anotaciones son la forma correcta de crear las rutas y muchos mas sencillo solo hay que incorporar el componente en el controlador y como se puede compribar el resultado es el mismo que antes. Ejecuta el servidor web php y escribe http://127.0.0.1:8000/lucky/number

resultado con rutas en controlador symfony4

 Podemos hacer que symfony genere controladores por nosotros con la siguiente instrucción 
 php bin/console make:controller

generar controladores por symfony

Instalación automática de recetas con Symfony Flex 

Puede que no lo haya notado, pero cuando corrió composer require annotations, dos cosas especiales sucedieron, ambas gracias a un poderoso plugin de Composer llamado Flex .

En primer lugar, annotationsno es un nombre de paquete real: es un alias (es decir, acceso directo) que Flex resuelve sensio/framework-extra-bundle.

En segundo lugar, después de descargar este paquete, Flex ejecutó una receta , que es un conjunto de instrucciones automatizadas que le dicen a Symfony cómo integrar un paquete externo. Existen recetas flexibles para muchos paquetes y tienen la capacidad de hacer mucho, como agregar archivos de configuración, crear directorios, actualizar .gitignore y agregar nuevas configuraciones a su .envarchivo. Flex automatiza la instalación de paquetes para que pueda volver a la codificación.

El comando bin / console 

Su proyecto ya tiene una poderosa herramienta de depuración dentro: el bin/consolecomando. Intenta ejecutarlo

php bin/console

Ejecutando este comando verá todas las instrucciones que contiene, aqui te muestro algunas:

ejemplo php bin console en symfony 4

Debería ver una lista de comandos que pueden darle información de depuración, ayudar a generar código, generar migraciones de bases de datos y mucho más. A medida que instale más paquetes, verá más comandos.

Para obtener una lista de todas las rutas en su sistema, use el debug:routercomando:

php bin/console debug:router

informacion que muestra debug router en symfony 4

Como puedes observar entre todas las rutas que se muestran aparece la que hemos creado /lucky/number.

La barra de herramientas Web Debug: Debugging Dream

 Una de las características de symfony es su barra de depuración que muestra una gran cantidad de información en la parte inferior de las páginas que se muestran en el navegador mientras se están desarrollando.

Para usar la barra de herramientas de depuración web, primero instale el paquete Profiler:

 composer require --dev symfony/profiler-pack

instalando la barra depuracion en symfony4

El resultado es el siguiente:

barra depuracion symfony 4

Renderizar una plantilla

Si devuelve HTML desde su controlador, probablemente quiera renderizar una plantilla para ello symfony viene con el gestor de plantillas Twig.

Primero vamos a instalar Twig con el siguiente comando

composer require symfony/twig-bundle

instalando twig en symfony 4

En segundo lugar debemos de extender la clase Controller a LuckyController y usar la función render() como muestra el siguiente ejemplo

funcion render en controlador para mostrar plantillas twig en symfony4

Para que se muestra el código html en la página web tenemos que crear la plantilla en el directorio /templates, el cual ha instalado symfony cuando le dijimos que instalará Twig para que guardemos en el las plantillas, crearemos dentro de el un directorio llamado /lucky y dentro de él un archivo llamado number.html.twig.

number thml twig en symfony4

Con esto hemos creado nuestra primera plantilla, si te fijas bien es código html y dentro de las etiquetas {{ }} metemos una variable que viene del controlador que es number, esta variable es la que se muestra en la plantilla. Además hemos extendido la plantilla base.html.twig para que extendiera todo lo que en ella esta incluido y poder ver la barra debug en depuración. 

El resultado es el siguiente:

plantilla twig de ejemplo number en symfony 4

Verificando la Estructura del Proyecto

Hasta ahora hemos trabajado con los siguientes directorios en symfony:

  • config/  Configurará rutas, servicios y paquetes.
  • src/Todo su código PHP vive aquí.
  • templates/Todas sus plantillas de Twig viven aquí.

y el resto de directorios que iremos usando son:

  • bin/. El archivo  bin/console vive aquí (y otros archivos ejecutables menos importantes).
  • var/ Aquí es donde se almacenan los archivos creados automáticamente, como los archivos de caché ( var/cache/) y los registros ( var/log/).
  • vendor/ Las bibliotecas de terceros (es decir, "proveedores") viven aquí. Estos se descargan a través del administrador de paquetes Composer.
  • public/ Esta es la raíz del documento para su proyecto: aquí coloca los archivos accesibles públicamente.

Y cuando instales nuevos paquetes, se crearán automáticamente nuevos directorios cuando sea necesario.

 

 

 

 

 

Web Analytics