En la raíz del proyecto, vamos a crear un par de carpetas que nos permitirán definir, la URL de la página, la cual nos permitirá colocar desde el navegador para poder acceder a ella, así como nuestra carpeta principal de nuestro controlador.
Dentro de nuestro módulo recién creado Marcgento_HolaMundo. hay que asegurarse de tener este módulo en el proyecto de Magento. Además, asegúrate de que la caché de página completa esté deshabilitada durante el desarrollo. Puedes deshabilitarla desde el backend, accediendo a Sistema | Gestión de Caché.
Si me sigues paso a paso, te voy a mostrar cómo agregar páginas adicionales mediante controladores y acciones de controlador, si no sabes que es un Controlador seguramente no sabes que es un MVC Modelo Vista Controlador y si es ese tu caso no te preocupes tómate tu tiempo y revisa con calma mi artículo de MVC en Magento 2.
-
Lo primero que debes hacer es crear la siguiente estructura de carpetas:
-
app/code/Marcgento/HolaMundo/etc/frontend
-
app/code/Marcgento/HolaMundo/Controller
-
app/code/Marcgento/HolaMundo/Controller/Index
-
En la carpeta app/code/Marcgento/HolaMundo/etc/frontend, debes crear un archivo llamado route.xml con el siguiente contenido:
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
<router id="standard">
<route id="holamundo" frontName="holamundo">
<module name="Marcgento_HolaMundo" />
</route>
</router>
</config>
Lo que hay que destacar en este archivo XML son un par de elementos que nos permite identificar nombres clave para continuar con nuestro desarrollo, lo primero es fíjate bien en el atributo id del nodo router, ya que mediante este valor standard define en que área estará mostrándose este controlador, en este caso indicamos que será una URL para la vista del cliente, el otro valor que existe es admin para el área de Back-end.
-
Dentro de la carpeta Index es decir, en app/code/Marcgento/HolaMundo/Controller/Index, vamos a crear el archivo Index.php con el siguiente contenido:
<?php
namespace Marcgento\HolaMudno\Controller\Index;
class Index extends \Magento\Framework\App\Action\Action
{
/**
* Index action
*
* @return $this
*/
public function execute()
{
// Aqui codigo
}
}
Del archivo que acabamos de crear no hay mucha, ciencia. Es un archivo de clase PHP que define solo una función llamada execute. Es muy importante entender que esta función es el punto de partida de una clase de Controlador en un módulo de Magento.
-
Te recomiendo limpiar la caché en este punto mediante el comando php bin/magento cache:clean.
-
En este punto vamos a realizar una primera prueba abriendo tu navegador y accediendo a la URL /holamundo del proyecto. Verás una página en blanco. Esto es normal porque la acción del controlador está vacía.
-
Vamos a modificar el archivo de la clase Index.php para cargar el diseño del controlador, te recuerdo que una clase de controlador en combinación con un par de archivos que iremos viendo representa una página del proyecto, vamos a agregar el siguiente código en el archivo para ver un resultado más claro:
<?php
namespace Marcgento\HolaMudno\Controller\Index;
class Index extends \Magento\Framework\App\Action\Action
{
/** @var \Magento\Framework\View\Result\PageFactory */
protected $resultPageFactory;
public function __construct(
\Magento\Framework\App\Action\Context $context,
\Magento\Framework\View\Result\PageFactory
$resultPageFactory
) {
$this->resultPageFactory = $resultPageFactory;
parent::__construct($context);
}
public function execute()
{
$resultPage = $this->resultPageFactory->create();
return $resultPage;
}
}
- Ahora vamos a crear una acción adicional que nos redirija a nuestro controlador Index, para lo cual creamos una nueva clase en la siguiente ruta app/code/Packt/HelloWorld/Controller/Index/Redirect.php con el siguiente contenido:
<?php
namespace Marcgento\HolaMundo\Controller\Index;
class Redirect extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$this->_redirect('holamundo');
}
}
Aunque esta tarea es engorrosa, tener que estar limpiando la caché en cada cambio por ahora es así por el tema del paso a paso del curso, en un escenario de trabajo cotidiano esta tarea solo la realizas cuando finalizas todo tu desarrollo o el componente que estés creando en ese momento, posterior a que limpies la caché accede a la URL /holamundo/index/redirect. Y en automático serás redirigido a la acción index, por ahora esto es un simple ejercicio, pero te irás dando cuenta de que sirve una clase de controlador.
- Y ya para finalizar esta lección, vamos a hacer un pequeño ajuste en tu clase controlador Redirect dentro del método execute(). Cambia su contenido por $this->_forward(‘index’) . Si posteriormente ejecutas el mismo proceso de recargar la página, verás el mismo resultado, pero si te fijas muy bien en la URL, esta no cambia en la barra del navegador. En una lección más en profundidad, te explicaré por qué ocurre esto.
<?php
namespace Marcgento\HolaMundo\Controller\Index;
class Redirect extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$this->_forward('index');
}
}
En resumen
En esta lección te enseñé un par de cosas. Lo primero fue a que puedas crear URL’s de navegación a las cuales llamamos archivos de ruteo, en esos archivos XML de configuración route.xml definimos dos atributos importantes, id y frontName el primero lo utilizaremos como identificador para crear nuestros archivos de Layout que más adelante aprenderemos a crear y el segundo es el frontName que representará el nombre de la URL creada.
Todas las páginas de Magento se ejecutan mediante acciones del controlador. Todos los controladores se ubican en módulos, y cada controlador puede tener múltiples acciones. Esto nos da la siguiente estructura de una URL: <NombreModulo o frontName>/<NombreControlador>/<NombreAccion>, el primer parámetro ya sabes que lo definimos en el archivo route.xml el segundo es el nombre que tendrá la carpeta dentro de Controller en este caso la llamamos Index y el último parámetro ya representa la Clase que en nuestro ejemplo llamamos Index.php.
Si comparas la parte del controlador con Magento 1, te vas a dar cuenta de muchos cambios y una mayor simplificación. Bueno, eso con el entendido que conociste Magento 1, si no es tu caso, olvídalo, que es mejor enfocarte en esta nueva y mejorada versión de Magento 2. En Magento 2, cada acción del controlador se escribe en una clase independiente. Esta clase extiende la clase Magento\Framework\App\Action\Action. Y el controlador es la carpeta donde se almacenan las acciones.
También es posible que el controlador esté en una clase independiente, pero esto solo ocurre cuando existen funciones genéricas que las acciones pueden utilizar. Un buen ejemplo se puede encontrar en el módulo Product Controller del módulo Magento_Catalog.
En una acción del controlador, el método execute() se usa para iniciar la renderización de la página. Si no hay nada en este método, la página mostrará una pantalla vacía. Si queremos renderizar el diseño, inicializaremos la instancia resultPageFactory en el método __construct() del controlador. Esta clase Factory se usa para iniciar la renderización del diseño de la página.
Seguramente te estarás preguntando que porque menciono tantos conceptos que no logras entender, pero tranquilo no te preocupes que poco a poco iras entendiendo que es cada uno de los conceptos mencionados aquí, si ya eres un nivel intermedio en Magento vas a entender a la perfección de lo que estoy hablando.
Por cierto, la segunda clase del controlador que creamos redirige a otra página. Al llamar al método _redirect() en una acción del controlador, se devuelve una redirección 301 a la URL indicada. El método _forward() parece que hace lo mismo, pero reenvía internamente la acción a otro controlador. Esto significa que la salida de otra acción del controlador se mostrará en la página, pero la URL no cambiará. Este método se utiliza para traducir una URL optimizada para SEO (como la URL de un producto, por ejemplo) a la acción del controlador correcta con los parámetros correctos.
Consejos
Si las cosas no funcionan como esperas, puedes seguir estos consejos para solucionarlo:
- Limpiar la caché cada que realizas un cambio representativo en una clase. Puedes hacerlo con el comando php bin/magento cache:clean.
- También puedes hacer una limpieza de la caché con mayor profundidad con el comando php bin/magento cache:flush.
- Si eliminas la carpeta var/generation y var/view_preprocessed en ocasiones, podría evitarte muchos dolores de cabeza cuando modificas varios archivos como clases, estilos LESS, archivos JS, ya que al hacerlo obligas al proyecto a tener que regenerar las clases generadas en sus carpetas correspondientes.
