Frontend

Laravel ha evolucionat significativament en la seva aproximació al desenvolupament frontend. Durant anys, Laravel Mix va ser l'eina estàndard per gestionar assets: un wrapper elegant sobre webpack que simplificava la compilació de CSS i JavaScript amb una API fluida. Tot i que Mix va complir la seva funció admirablement, el 2022 Laravel va adoptar Vite com a eina nativa de bundling. Vite ofereix un servidor de desenvolupament extremadament ràpid gràcies al Hot Module Replacement (HMR) instantani, temps de compilació molt més curts i una arquitectura moderna basada en ES modules que s'adapta millor a les necessitats actuals del desenvolupament web.

La filosofia de Laravel respecte al frontend és radicalment flexible: el framework no imposa cap arquitectura concreta i ofereix múltiples camins per construir la interfície d'usuari. Pots optar per vistes Blade renderitzades al servidor amb un toc d'interactivitat mitjançant Alpine.js, crear components completament reactius sense escriure una sola línia de JavaScript gràcies a Livewire, construir aplicacions d'una sola pàgina (SPA) amb Vue o React sense necessitat de cap API dedicada utilitzant Inertia.js, o simplement configurar Vite per compilar qualsevol framework CSS o JavaScript que prefereixis. Cada aproximació té els seus punts forts i cap és inherentment millor que les altres: tot depèn dels requisits del projecte.

Aquesta flexibilitat s'articula al voltant del concepte de millora progressiva. El punt de partida natural és el renderitzat al servidor amb Blade, que genera HTML complet al backend i l'envia al navegador. Quan algunes parts de la pàgina necessiten comportament dinàmic sense recarregar (dropdowns, modals, toggles), Alpine.js permet afegir interactivitat declarativa directament a les plantilles Blade amb directives HTML lleugeres. Si el projecte requereix components que actualitzin el seu estat de forma reactiva, Livewire permet escriure tota la lògica en PHP al servidor mentre el frontend s'actualitza automàticament. I quan l'experiència d'usuari demana una aplicació completa amb navegació sense recàrregues de pàgina, Inertia.js connecta el backend de Laravel directament amb components Vue o React sense necessitat de construir una API REST separada.

Alpine.js funciona com un "jQuery modern": és un framework JavaScript minimalista que s'integra de manera natural amb Blade. Amb directives com x-data, x-show, x-on i x-transition, pots afegir comportament interactiu directament al markup HTML sense cap pas de compilació. Això el fa ideal per a projectes que necessiten interactivitat puntual sense la complexitat d'un framework JavaScript complet. Laravel inclou Alpine.js per defecte en els seus starter kits, de manera que està disponible des del primer moment.

Livewire porta la reactivitat al món PHP d'una manera sorprenentment elegant. Cada component Livewire és una classe PHP amb propietats i mètodes que es sincronitzen automàticament amb el frontend mitjançant peticions AJAX. Pots crear formularis amb validació en temps real, taules amb paginació dinàmica, cercadors amb resultats instantanis i molt més, tot sense escriure JavaScript. Livewire s'integra perfectament amb Blade i Alpine.js, permetent combinar el renderitzat al servidor amb interactivitat al client quan calgui.

Inertia.js representa una aproximació diferent: permet construir aplicacions d'una sola pàgina completes amb Vue, React o Svelte, però mantenint el routing, els controladors i el middleware de Laravel al backend. En lloc de crear una API JSON i un frontend separat, Inertia actua com a pont entre les dues capes. Els controladors retornen respostes Inertia amb les dades necessàries, i els components del frontend les reben directament com a props. El resultat és una experiència SPA fluida amb tota la potència del backend de Laravel, incloent Server-Side Rendering (SSR) per millorar el rendiment i el SEO.

Per facilitar l'inici d'un projecte, Laravel ofereix starter kits que vénen preconfigurats amb aquestes eines. Laravel Breeze proporciona una implementació lleugera d'autenticació amb opcions per a Blade amb Alpine.js, Livewire, Inertia amb Vue o Inertia amb React. Laravel Jetstream va un pas més enllà i inclou funcionalitats avançades com la gestió d'equips, autenticació de dos factors i gestió de sessions. Ambdós kits configuren Vite, Tailwind CSS i l'stack frontend escollit automàticament, permetent començar a desenvolupar amb totes les eines integrades des del primer minut.

En definitiva, Laravel no et força a triar un únic camí per al frontend. Cada projecte pot adoptar l'aproximació que millor s'adapti a les seves necessitats, i fins i tot combinar diverses eines dins la mateixa aplicació. Un projecte pot tenir la majoria de pàgines renderitzades amb Blade i Alpine.js, utilitzar Livewire per als components més complexos i reservar Inertia per a les seccions que requereixen una experiència SPA completa. Aquesta llibertat és un dels grans avantatges de l'ecosistema Laravel.