> Manuales > Manual de Laravel

Qué es Laravel Breeze, qué nos ofrece para mejorar las posibilidades de Laravel y todo el proceso de login, registro de usuarios, verificación, etc. Qué piezas de código incluye y cómo instalar y configurar el sistema.

Laravel Breeze

Laravel Breeze consiste en un andamiaje de una aplicación web, sencillo y comprensible, que puede instalarse sobre proyectos Laravel limpios y que ofrece funcionalidades de autenticación ya implementadas de casa. Esto incluye el login y registro, pero también otras necesidades básicas de las aplicaciones como recuperar claves olvidadas, la verificación del email, etc.

Si eres nuevo en Laravel o deseas que el stack de tecnologías que te monta el framework de casa sea el mínimo posible, Laravel Breeze es una buena alternativa, ya que para funcionar simplemente se hace uso del sistema de templates Blade.

También integra Tailwind de casa, aunque es fácilmente intercambiable por cualquier otro framework CSS, Sass, o bien por la siempre existente alternativa de escribir tu CSS completamente a mano.

Instalación de Laravel Breeze

Comenzamos la instalación de Laravel Breeze con el siguiente comando.

composer require laravel/breeze --dev

Recuerda que si trabajas con Sail, tendrás que ejecutar los comandos desde el contenedor, por lo que necesitarás anteponer "sail" antes de todos estos comandos: sail composer require laravel/breeze --dev

A continuación vamos a hacer la publicación de todos los elementos que nos ha proporcionado Laravel Breeze, mediante el comando:

php artisan breeze:install

Posteriormente podemos instalar dependencias del frontend y correr migraciones para asegurarnos que todos los componentes necesarios para que Laravel Breeze funcionen estén listos en tu proyecto.

npm install
npm run dev
php artisan migrate

Instalar las funcionalidades para autenticación de API

Si la idea es desarrollar un API con Laravel podemos usar Breeze también como starter kit, pero en este caso necesitaremos instalar el scaffolding del sistema de autenticación del API, mediante los siguientes pasos.

Primero debemos haber instalado Breeze vía composer con el comando que se señaló al principio. Luego realizamos la instalación de breeze así:

php artisan breeze:install api

Puedes correr las migraciones si aún no las tenías:

php artisan migrate

Esto nos habrá creado dos variables de configuración en el .env que indican dónde estarán los servidores de la aplicación frontend y la aplicación backend:

APP_URL=http://localhost:8000
FRONTEND_URL=http://localhost:3000

APP_URL se usará para cuando sirvas la aplicación mediante php artisan serve. Si queremos que funcione el puerto 8000 tenemos que configurar docker-compose.yml ports:

  • '${APP_PORT:-80}:80'
  • '8000:80'

Qué incluye Breeze

Para los que llevan tiempo en Laravel podríamos resumir este punto diciendo que Breeze incluye más o menos lo que teníamos con Laravel UI, es decir, los módulos, rutas y controladores para crear un sistema de login completo.

Al entrar en nuestro sitio web con Breeze, podremos ver esta página, donde en la parte superior derecha se encuentran los enlaces de login y registro.

Enlaces de login y registro creados con Laravel Breeze

Los formularios de login y registro se ofrecen con un diseño bastante vistoso y adaptable fácilmente a cualquier aplicación. Para la definición de este diseño se ha incorporado Tailwind.

Aspecto del formulario de login que se obtiene con Laravel Breeze

Ya en piezas de código, podemos encontrar en la carpeta "models" el model de User (User.php). Y en Http/Controllers/Auth encontramos toda una serie de controladores que nos permiten implementar las necesidades básicas del sistema de login y registro.

Adicionalmente, las rutas de la aplicación para todo el sistema de control de usuarios están definidas en routes/auth.php, que es un archivo que se incluye directamente desde las rutas web en routes/web.php.

Encontrarás rutas para las páginas de login y registro, pero también para las páginas de envío del email para resetear la clave, creación de una nueva contraseña, verificación del email de los usuarios y para el logout del usuario.

Laravel Mix en Laravel Breeze

Otra de las cosas que realiza Laravel Breeze es la generación de un código de compilado de archivos frontend personalizado, que se encuentra en el archivo webpack.mix.js que hay en la ruta principal del proyecto.

Dentro del archivo webpack.mix.js encontrarás la configuración de Laravel Mix, que es una capa por encima de Webpack. Este archivo tiene la responsabilidad de configurar cómo se va a hacer la compilación de los assets de código frontend, como el Javascript y el CSS.

Si deseas usar un stack de tecnologías frontend personalizado tendrás que comenzar editando este archivo, por ejemplo eliminando la carga de Tailwind, si no piensas usar este framework CSS.

Para entender mejor el código del archivo webpack.mix.js y el compilado de archivos que realiza Mix en general, puedes leer el artículo de Laravel Mix.

Conclusión

Laravel Breeze no tiene mucho más, es un scaffolding elemental de todo el proceso de login y registro de usuarios. Te quitará mucho trabajo en aplicaciones nuevas que requieran usuarios (prácticamente todas) y ayudará a comenzar con un conjunto de archivos un poco más amplio.

Si quieres mayores posibilidades Laravel incluye también un completo paquete de andamiaje que se llama Jetstream, que gestiona cosas como la autenticación en dos pasos.

Miguel Angel Alvarez

Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...

Manual