Inertia.js

Inertia.js removes the classic SPA tax: no separate JSON API, no duplicated auth or routing logic — the frontend is a Vue or React app driven entirely by server responses. I use it to get the modern UX of a component SPA without splitting the codebase in two.

The model is elegant: the backend returns full page components plus props, and Inertia swaps only the view on navigation. Shared state (auth, flash, notifications) stays server-sourced, which keeps permissions in one honest place.

Where it shines for me is product teams on Laravel — a tightly integrated stack where one deploy ships both the UI and the logic, and the frontend never drifts ahead of the backend contracts.

The core idea collapses a production complexity: a single codebase, one deploy, one source of truth for security. Because the server renders a page component with its props, the authorisation that protects a route is the same logic that feeds the UI — no duplicated guards in a separate API.

Navigation is smooth because it is Swap, not reload. Inertia fetches the page JSON and replaces the view on the fly, so the app feels like an SPA while the routing and data stay genuinely server-side.

Shared state travels with the response. Auth user, flash messages, and common app data are attached server-side and handed to every page — which is how the frontend stays honest without recreating a session copy in the browser.

Forms and validation compose naturally. Server-side validation returns errors that map to fields, and Inertia's form helpers keep a progressive-enhancement story that works even before any JavaScript concern is fully loaded.

For the product team the payoff is a dramatically smaller attack-and-maintenance surface. There is no separate API to version, no CORS matrix, no duplicated auth — a coherent stack that a small team can operate end to end.

I reach for Inertia specifically when the backend should remain the owner of logic and permissions but the frontend wants the polish of components. It is the honest middle path between a classic server-rendered app and a disconnected SPA.

I let the server stay the owner of logic and auth. Routes, permissions, and the data live server-side, and the frontend is a Vue or React view of them — one source of truth, one deploy.

Shared state rides the response. Auth identity, flash messages, and common data are attached server-side and passed to every page, so the client never recreates a session copy.

Navigation is swap, not reload. Inertia fetches the page JSON and replaces the view, so the app feels like an SPA while staying honestly server-routed.

Forms and validation compose cleanly. Server validation errors map to fields, and the form helpers work even before full JS is ready.

I keep the client lean. Because the server decides the page, the frontend never drifts ahead of the backend contracts or duplicates routing.

The deployment surface shrinks. No separate API to version, no CORS matrix, no duplicated auth — a coherent stack a small team operates end to end.

TypeScript keeps the component contracts honest. Props typed on both the server payload and the component mean the contract is checked, not guessed.

Progress and loading are handled deliberately. Loading states, partial reloads, and shared flash make the UX feel smooth without a framework bolt-on.

Inertia is the honest middle path between a classic server-rendered app and a disconnected SPA — and I reach for it precisely when that trade-off fits the product.