vmitchell85 / momentum-preflight

Momentum Preflight

Momentum Preflight is a Laravel package that lets you implement realtime backend-driven request validation for Inertia apps.

Validate form requests using Inertia form helper just like you already do, without running controllers' code.

• Advanced Inertia
• Installation
  • Laravel
  • Vue 3
• Usage
• Momentum

Advanced Inertia

Make Inertia-powered frontend a breeze to build and maintain with my upcoming book Advanced Inertia. Join the waitlist and get 20% off when the book is out.

Installation

Laravel

Install the package into your Laravel app.

composer require based/momentum-preflight

Register the PreflightMiddleware middleware.

<?php

Route::post('register', RegisterController::class)
  ->middleware(PreflightMiddleware::class);

Vue 3

The frontend package is only for Vue 3 now due to its wide adoption within the Laravel community.

Install the frontend package.

npm i momentum-preflight
# or
yarn add momentum-preflight

Usage

Preflight works well with both FormRequests and Laravel Data. Due to the simplicity of the approach, it doesn't support the inline $request->validate(...) method.

<?php

class RegisterController
{
    public function __invoke(RegisterRequest $request)
    {
        ...
    }
}

import { useForm } from "inertia/inertia-vue3";
import { useValidate } from "momentum-preflight";

const form = useForm({ name: "" });

const validate = useValidate(form, "/register", { debounce: 500 });

watch(
  () => form.data(),
  () => validate()
);

The package performs validation for all defined rules. However, you can specify exact fields so that all errors don't appear together once you start typing.

<script setup>
import { useForm } from "inertia/inertia-vue3";
import { useValidate } from "momentum-preflight";

const form = useForm({ name: "" });

const validate = useValidate(form, "/register");
</script>

<template>
  <div>
    <input v-model="form.name" @blur="validate('name')" />

    <span v-if="form.errors.name">{{ form.errors.name }}</span>
  </div>
</template>

Momentum

Momentum is a set of packages designed to bring back the feeling of working on a single codebase to Inertia-powered apps.

• Modal — Build dynamic modal dialogs for Inertia apps
• Preflight — Realtime backend-driven validation for Inertia apps
• Paginator — Headless wrapper around Laravel Pagination
• State — Laravel package to manage the frontend state of Inertia apps (coming soon)
• Router — Frontend plugin to use Laravel routes with Inertia (coming soon)
• Permissions — Frontend plugin to use your Laravel permission with Inertia (coming soon)
• Locale — Use your Laravel translation files with Inertia (coming soon)

Credits

• Boris Lepikhin
• All Contributors

License

The MIT License (MIT). Please see License File for more information.