Panoramica
Laravel è un framework backend, ma cura anche l’esperienza di sviluppo estesa al frontend.In Laravel 13 hai a disposizione sia un approccio centrato su PHP sia uno che sfrutta framework JavaScript come React, Vue e Svelte. Per scegliere l’approccio più adatto, ragiona su questi tre punti:
- Vuoi scrivere la UI principalmente in PHP?
- Vuoi scrivere la UI principalmente in JavaScript / TypeScript?
- Vuoi tenere tutto in un unico repository o separare API e SPA?
Procedere con PHP
Blade
Blade è il motore di template standard di Laravel. Da controller o route restituisci le viste e invii al browser l’HTML generato sul server. Pro- Si integra naturalmente con routing, validazione e autenticazione di Laravel
- Si riesce a fare tutto in PHP; costo di apprendimento contenuto
- Adatto a pagine in cui SEO e first paint sono importanti
- Ogni transizione di pagina o invio form tende a ricaricare tutta la pagina
- Le interazioni complesse richiedono aiuto da JavaScript
Livewire
Laravel Livewire è un approccio che parte da Blade ma consente di realizzare UI più dinamiche restando principalmente in PHP. Puoi costruire interazioni come modali, ricerche, editing inline con un’esperienza vicina a React o Vue. Pro- Puoi creare UI dinamiche come estensione di PHP e Blade
- Si lega bene a gestione dello stato e validazione di Laravel
- Se vuoi aggiungere JavaScript solo dove serve, si combina bene con Alpine.js
- Non è forte come i framework JavaScript nella gestione di stati client complessi
- Non sempre adatto a SPA di grandi dimensioni in cui la responsabilità del frontend è preponderante
Starter kit PHP-first
Gli starter kit di Laravel 13 offrono un’opzione basata su Livewire per i team che vogliono creare, restando su PHP, anche UI dinamiche. Puoi ovviamente partire con la sola Blade, ma la scelta PHP-first pronta all’uso negli starter kit è Livewire. Include autenticazione, layout e configurazione di Vite: il modo più rapido per iniziare lo sviluppo.Usare un framework JavaScript
Inertia + React / Vue / Svelte
Inertia fa da ponte tra Laravel — sfruttandone route, controller e autenticazione — e la costruzione delle pagine con React, Vue o Svelte. Senza separare completamente un API server e una SPA, puoi realizzare UI moderne in un’unica applicazione Laravel. Pro- Puoi usare il modello a componenti di React / Vue / Svelte
- Routing e autenticazione restano lato Laravel
- Gestisci facilmente backend e frontend nello stesso repository
- Rispetto alla sola Blade, aumentano le tecnologie da imparare
- Servono conoscenze della toolchain Node.js e spesso TypeScript
Separare API e SPA
Puoi anche scegliere di separare completamente il frontend da Laravel e consumare le API da SPA distinte o app mobili. Adatto quando più client condividono lo stesso backend. In questo caso, Laravel svolge principalmente questi ruoli:- Espone le route API
- Autenticazione/autorizzazione (ad esempio Sanctum)
- Formattazione delle risposte JSON (ad esempio Eloquent API Resources)
- Facile distribuire su più client (web, mobile, desktop)
- Puoi disaccoppiare la scelta della tecnologia frontend dal core di Laravel
- Autenticazione, fetching dei dati e deploy vanno progettati separatamente
- Tende a essere più complesso di una configurazione contenuta in un’unica app Laravel
Starter kit JavaScript-first
Usando uno starter kit parti con Inertia, React / Vue / Svelte, Tailwind CSS e Vite già configurati. Le schermate di autenticazione sono pronte fin da subito, così ti concentri più facilmente sullo sviluppo della UI.Fare il build degli asset con Vite
Qualunque approccio tu scelga, in Laravel 13 di norma userai Vite per fare il build di CSS e JavaScript. Con Blade e Livewire raggruppi script e stili leggeri, con Inertia raggruppi tutto il codice frontend dell’applicazione. I vantaggi di Vite:- HMR veloce durante lo sviluppo locale
- Bundle e versioning degli asset di produzione
- Integrazione con la direttiva
@vite()di Laravel
Negli starter kit di Laravel 13 la configurazione frontend basata su Vite è già impostata.
Confronto tra gli approcci
| Approccio | Casi d’uso adatti | Pro | Contro |
|---|---|---|---|
| Blade | Pagine incentrate sui contenuti, back office con molti form | Semplice e facile da imparare. Si integra naturalmente con le funzionalità standard di Laravel | Nelle UI evolute il refresh dell’intera pagina cresce |
| Livewire | Applicazioni gestionali dinamiche in cui vuoi restare in PHP | Puoi creare UI reattive restando in PHP | Meno adatto a gestioni di stato client complesse |
| Inertia + React / Vue / Svelte | App che vogliono conciliare UI moderna e gestione unificata con Laravel | Costruisci un’esperienza simile a SPA in un unico repository | Serve dimestichezza con JavaScript / TypeScript |
| API + SPA indipendente | Prodotti con più client o integrazione mobile | Più semplice distribuire il frontend in autonomia | Autenticazione, deploy e operazioni tendono a essere complessi |
Prossimi passi
Template Blade
Rivedi le basi del rendering lato server.
Starter kit
Confronta le configurazioni iniziali di React, Vue, Svelte e Livewire.
Bundle degli asset con Vite
Impara il flusso di dev server, HMR e build di produzione.
Introduzione a Inertia
Impara come Inertia collega Laravel e i framework JavaScript.