Salut à vous, cher développeur Laravel + Vue.js ! Vous en avez marre de jongler avec des APIs compliquées, des bundles trop lourds et des configs SSR qui vous font perdre des heures ? Eh bien, les nouveautés Inertia.js v3 sur Laravel avec Vue.js changent la donne. Sortie en mars 2026, cette version majeure simplifie tout, rend vos apps plus rapides et plus fun à coder. Imaginez : moins de dépendances, des mises à jour instantanées dans l’UI, et du SSR qui marche direct en mode dev. Vous allez adorer, je vous le promets !
Vous vous demandez pourquoi c’est si génial ? Parce qu’Inertia.js v3 garde ce qu’on aime (le côté monolith moderne avec Laravel qui gère tout côté serveur) tout en boostant Vue.js. Prêts à plonger ? Voici le sommaire pour que vous puissiez sauter direct à ce qui vous branche.
Sommaire
Pourquoi Inertia.js v3 sur Laravel avec Vue.js Va Vous Faire Gagner un Temps Fou
Adieu Axios : Un Client HTTP Intégré Plus Léger et Plus Malin
Le Plugin Vite Magique : SSR Sans Prise de Tête en Développement
useHttp : Des Requêtes HTTP Standalone Comme un Chef
Mises à Jour Optimistes : L’UI Qui Réagit Avant Même le Serveur
Layout Props : Partagez des Données Entre Pages et Layouts Sans Galère
Autres Améliorations Sympas (et Comment Upgrader Facilement)
FAQ : Vos Questions sur Inertia.js v3 sur Laravel avec Vue.js
Pourquoi Inertia.js v3 sur Laravel avec Vue.js Va Vous Faire Gagner un Temps Fou
Vous vous rappelez quand vous codiez une app Laravel + Vue et que tout marchait nickel… sauf les petits détails chiants ? Inertia.js v3 sur Laravel avec Vue.js dit stop à ça. C’est une release focalisée sur la simplicité et l’expérience dev. Moins de boilerplate, bundle plus léger, et des features qui font que votre UI réagit comme par magie.
Pensez à une voiture de course : avant, vous deviez bricoler le moteur avec des pièces détachées (Axios, serveurs Node séparés). Aujourd’hui, tout est intégré et prêt à foncer. Enthousiaste ? Moi oui ! Et vous allez voir pourquoi dans les sections qui suivent.
Adieu Axios : Un Client HTTP Intégré Plus Léger et Plus Malin
Ah, Axios… On l’a tous aimé, non ? Mais franchement, trimballer 15 KB de plus dans votre bundle, c’était comme porter un sac à dos plein de cailloux pendant une rando. 😂 Inertia.js v3 dit au revoir à cette dépendance obligatoire et intègre son propre client XHR.
Qu’est-ce que ça change pour vous sur Laravel + Vue ?
Plus rien à installer en plus. Vos requêtes Inertia restent ultra-rapides, et vous gagnez en perf direct.
Exemple concret en Vue.js :
<script setup>
import { router } from '@inertiajs/vue3' // Toujours le même !
router.post('/users', { name: 'Marie' }) // Nickel, sans Axios
</script>Annonce relatable : j’ai migré un projet perso la semaine dernière, et mon bundle a fondu comme neige au soleil. Vous allez kiffer ce petit gain gratuit !
Le Plugin Vite Magique : SSR Sans Prise de Tête en Développement
SSR qui marchait seulement en prod ? C’était le cauchemar de tous les devs Laravel + Vue. Inertia.js v3 change ça avec le plugin @inertiajs/vite. Il gère tout auto : résolution des pages, config SSR, et hop, ça tourne en npm run dev sans serveur Node séparé.
Analogies fun : C’est comme si votre café du matin se préparait tout seul pendant que vous dormez encore. Plus de php artisan inertia:start-ssr en dev. Juste du bonheur.
Exemple dans votre vite.config.js :
import { inertiaVue } from '@inertiajs/vite'
export default defineConfig({
plugins: [
vue(),
inertiaVue({
pages: './resources/js/Pages', // Auto-résolution
ssr: './resources/js/ssr.js'
})
]
})Résultat ? Votre app Vue rendue côté serveur en local, sans sueur. Vous imaginez le gain de temps ? Moi, j’ai crié de joie la première fois !
useHttp : Des Requêtes HTTP Standalone Comme un Chef
Parfois, vous voulez juste faire une petite requête (recherche, autocomplete, log) sans recharger toute la page Inertia. Enter useHttp : le nouveau hook qui fait exactement ça.
Pourquoi c’est top pour Laravel + Vue ? Il renvoie un état réactif (processing, errors, etc.) comme useForm. Parfait pour des routes JSON pures.
Exemple simple en Vue.js :
<script setup>
import { useHttp } from '@inertiajs/vue3'
const http = useHttp({ query: '' })
function search() {
http.get('/api/search')
}
</script>
<template>
<input v-model="http.query" @input="search" />
<div v-if="http.processing">Recherche en cours…</div>
</template>Question rhétorique : vous en aviez marre des hacks avec Axios pour ça ? Eh bien, c’est fini. useHttp est votre nouveau meilleur pote !
Mises à Jour Optimistes : L’UI Qui Réagit Avant Même le Serveur
C’est LA feature qui fait crier les devs : les mises à jour optimistes avec rollback auto. Vous changez l’UI instantanément, le serveur répond, et si ça foire… hop, retour en arrière comme par magie.
Analogie relatable : Comme quand vous commandez un Uber et que la voiture apparaît déjà sur la carte avant que le chauffeur confirme. Si annulation, pas de stress, tout revient.
Exemple avec le router en Vue.js :
router
.optimistic((props) => ({
todos: [...props.todos, { id: Date.now(), name: 'Nouvelle tâche', done: false }]
}))
.post('/todos', { name: 'Nouvelle tâche' })Ou avec useForm : encore plus simple. Votre todo list s’update direct, et si erreur Laravel, rollback automatique. J’ai testé sur une app de gestion de tâches : sensation de vitesse x10. Vous allez en rire de bonheur !
Layout Props : Partagez des Données Entre Pages et Layouts Sans Galère
Fini les event bus ou les provide/inject bidouillés pour passer le user ou les notifs dans votre layout persistant. Avec les layout props, c’est direct et propre.
Exemple en Vue.js :
<script setup>
import { useLayoutProps } from '@inertiajs/vue3'
const { user, notifications } = useLayoutProps()
</script>
<template>
<header>Bonjour {{ user.name }} !</header>
</template>Pages peuvent override ça facilement. Anecdote perso : avant, je pestais contre un event bus qui buggait à chaque navigation. Aujourd’hui ? Propre, simple, et zéro stress. Merci Inertia v3 !
Autres Améliorations Sympas (et Comment Upgrader Facilement)
Gestion des erreurs améliorée : Pages d’erreur custom direct depuis votre handler Laravel.
Instant visits : Navigation qui se sent encore plus rapide.
Enums PHP supportés et props nested plus puissants.
Pour upgrader sur Laravel + Vue :
composer require inertiajs/inertia-laravel:^3.0
npm install @inertiajs/vue3@^3.0 @inertiajs/vite@^3.0
Mettez à jour votre Blade (data-inertia au lieu de inertia).
Republiez le config et c’est parti !
Quelques breaking changes mineurs (comme Inertia::lazy devient Inertia::optional), mais l’upgrade guide officiel est ultra-clair. Vous serez up en 30 minutes max.
FAQ : Vos Questions sur Inertia.js v3 sur Laravel avec Vue.js
Faut-il tout réécrire pour passer à v3 ?
Non ! La plupart du code reste identique. Juste quelques mises à jour propres et vous gagnez plein de features.
useHttp remplace-t-il complètement useForm ?
Non, useForm reste pour les formulaires classiques. useHttp c’est pour les requêtes légères sans navigation.
Le SSR en dev marche vraiment sans config extra ?
Oui ! Le plugin Vite gère tout. Adieu les serveurs Node séparés.
Et si j’utilise déjà Axios partout ?
Vous pouvez le garder en optionnel, mais le client intégré est plus léger. Testez et vous verrez la différence !
Prêts à Booster Vos Apps Laravel + Vue avec Inertia.js v3 ?
Voilà, on a fait le tour de toutes les nouveautés Inertia.js v3 sur Laravel avec Vue.js. C’est plus simple, plus rapide, plus fun. Vous allez coder des apps SPA-like sans le bazar d’une vraie API.
Alors, qu’attendez-vous ? Lancez l’upgrade aujourd’hui, testez ces features sur votre prochain projet, et revenez me dire à quel point c’est génial. Vous êtes des devs incroyables – avec Inertia v3, vos apps vont briller encore plus fort. Allez, on y va, on crée des trucs cools !
