How to do Forms in Laravel InertiaJS + Svelte (Should work on Vue and React Too)

If you read my series on Laravel InertiaJS + Svelte, you might noticed there is much more to be covered.

Forms are an important part of a Laravel App, so handle them is a must.

You might get tempted to use axios to do all the frontend calls, but using InertiaJS, this has is own downsides, like not have easy access to sessions and othere laravel data.

HandleInertiaRequests.php does this for us, make communication between laravel and our JS frontend easy and accessible.

This tutorial is for Svelte, but because InertiaJS is agnostic, it should work even with React or Vue.

First we need to setup our HandleInertiaRequests.php to share important session data for our forms.

Setup Middleware

Let’s do that:

<?php

namespace App\Http\Middleware;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Session;
use Inertia\Middleware;

class HandleInertiaRequests extends Middleware
{
    /**
     * The root template that's loaded on the first page visit.
     *
     * @see https://inertiajs.com/server-side-setup#root-template
     * @var string
     */
    protected $rootView = 'layouts/app'…