Creando un panel de control desde cero con Laravel
¿Hola, cómo estas? Esta es la primera entrada de una serie donde crearemos una aplicación de panel de control desde cero con Laravel, Liveware y AlpineJS.
Esta serie va dirigida a desarrolladores principiantes con algo de experiencia en PHP y Javascript que quieran hacer porfolio con una aplicación propia o también que pueda servirles de ayuda en su actual empleo.
¿Por que Laravel?
Si bien existen muchas y muy buenas alternativas para construir aplicaciones de panel de control como pueden ser Spring, .NET, Django, NestJS, NextJS, etc… A la hora de elegir tenemos que tener en cuenta varios aspectos:
- Robustez del framework y el lenguaje.
- Experiencia de desarrollo, despliegue y mantenimiento.
- Código boilerplate o herramientas pre-codificadas, librerías y demás a disposición.
- Recursos, documentación y comunidad.
- Tipo o escala del proyecto a realizar.
Normalmente y en mi humilde opinión para proyectos genéricos y de pequeña/mediana escala Laravel es el que mejor balance tiene en los aspectos descritos anteriormente, porque es un proyecto robusto y muy contrastado en el tiempo, el lenguaje PHP ha sabido renovarse y adaptarse a los tiempos y existen infinidad de herramientas, librerías, servicios de despliegue, documentación, tutoriales, etc para solucionar todo tipo de funcionalidades que puedan requerir aplicaciones de este tipo.
Cometido principal del proyecto
A lo largo de estos 10 años que llevo en el mundo del desarrollo web tan solo al final después de observar los problemas que existen en las aplicaciones en producción con interacción de los usuarios, me he dado cuenta de la necesidad yo diría casi obligatoria de tener un buen sistema de gestión de errores y monitorización de los mismos, acompañado también de un buen esquema de roles y permisos. El cometido de este proyecto irá dirigido precisamente a esto, construir las herramientas fundamentales para que nuestro panel de control tenga un buen sistema de monitorización de la interacción de los usuarios con el mismo.
Instalación
La novedad que voy a introducir en esta serie es que acompañaré cada post con un video para que se haga más ameno, y los recursos como comandos, enlaces a librerías y demás los dejaré justo debajo del video.
Comencemos nuestra instalación de Laravel con la ayuda de Docker y Sail. Si bien hay muchas formas de instalar el framework en local o remoto, considero que esta es la manera más cómoda y rápida, además una forma de asegurarte que cuando compartas la aplicación con otros estos tengan exactamente las mismas versiones de servicios (como puede ser la base de datos) que la tuya o las del despliegue original. De todas formas es muy buena idea que aprendas a instalar y configurar servicios como Apache, NGINX, MySQL o MariaDB porque depende de la empresa o proyecto donde trabajes lo vas a necesitar.
curl -s "https://laravel.build/dashboard-app?with=mysql&devcontainer" | bash
phpmyadmin:
image: phpmyadmin
ports:
- 5050:80
depends_on:
- mysql
environment:
- PMA_ARBITRARY=1
- PMA_HOST=mysql:3306
- PMA_USER=root
- PMA_PASSWORD=password
networks:
- sail
Ya con Laravel instalado y rodando vamos a instalar nuestros paquetes base. El más importante de todos se llama Breeze y nos crea la estructura necesaria para un sistema de autenticación y registro de usuarios. Existen otros paquetes que te entregan lo mismo pero yo me decanto por este ya que te da a elegir entre varias formas de crear tu aplicación y crea un esqueleto base modificable mientras que otras como Jetstream, si bien son muy potentes, a mi criterio son un poco más opinionadas osea menos flexibles o más complejas en su modificación.
Entre las formas o stacks tecnológicos en las que puedes crear tu aplicación voy a destacar tres de ellas:
Tradicional o Legacy
Esta es la forma más antigua pero también más utilizada sobre todo en aplicaciones que ya tienen tiempo en producción. Yo no empezaría un proyecto de esta forma hoy en día por varios motivos pero sí estaría al tanto de como funciona por si toca refactorizar o actualizar alguna aplicación de este tipo. Entre las tecnologías más importantes que se suelen encontrar están:
Liveware
Esta es la forma que vamos a utilizar en esta aplicación y digamos también la recomendada o acogida y estandarizada por Laravel. Una vez la hallas escogido en la instalación de Breeze por defecto te instala estas tecnologías:
Inertia
Si estás acostumbrado a crear aplicaciones con tu librería favorita de frontend React o Vue esta es tu opción. La única pega es que para los tests de integración se sale un poco del estándar de aserciones y trae un método propio para asegurarte de que los cambios están reflejados en el front-end pero es bastante intuitivo y al menos nos podemos asegurar la integración. También puedes optar por hacer los tests solo en el front-end o en los dos sitios a la vez.
Aquí te dejo el resto de paquetes necesarios:
- laravel-permission: Con esta librería dispondrás de lo necesario para la gestión de roles y permisos.
- log-viewer: Esta librería te genera una interfaz para revisar los logs del sistema.
- laravel-debugbar: Esta es la barra de depuración más famosa y utilizada para Laravel que ya veremos que nos será de mucha utilidad con Volt.
- laravel-query-builder: Esta librería nos va a ayudar a hacer nuestras peticiones a la base de datos un poco más sencillas.
- laravel-activitylog: Aparte de los logs del sistema utilizaremos nuestros custom logs de comportamientos de usuario.
- laravel-data: En ocasiones vamos a querer guardar en formato json en la base de datos, con esta librería vamos a declarar objetos que luego podremos validar, manipular y demás.
- TW Elements: Esta librería ofrece componentes de tailwind que utilizaremos en nuestro proyecto.
También te dejo el enlace al repositorio.
¡Un saludo y nos vemos pronto en el próximo post! 🙋♂️