Agent-Skills.md

Agent Skills: Inertia

How to work effectively with Inertia, always use when developing frontend features

UncategorizedID: markhamsquareventures/essentials/inertia

Repository

markhamsquareventures/essentials
markhamsquareventures

Skill Files

Browse the full folder contents for inertia.

Download Skill

Loading file tree…

skills/inertia/SKILL.md

Skill Metadata

Name
inertia
Description
How to work effectively with Inertia, always use when developing frontend features

Inertia

Instructions

Inertia + React

  • Use router.visit() or <Link> for navigation instead of traditional links.
<code-snippet name="Inertia Client Navigation" lang="react">

import { Link } from '@inertiajs/react'

<Link href="/">Home</Link> </code-snippet>

Inertia + React Forms

<code-snippet name="`<Form>` Component Example" lang="react">

import { Form } from '@inertiajs/react'

export default () => (

<Form action="/users" method="post"> {({ errors, hasErrors, processing, wasSuccessful, recentlySuccessful, clearErrors, resetAndClearErrors, defaults }) => ( <> <input type="text" name="name" /> 
    {errors.name && <div>{errors.name}</div>}

    <button type="submit" disabled={processing}>
        {processing ? 'Creating...' : 'Create User'}
    </button>

    {wasSuccessful && <div>User created successfully!</div>}
    </>
)}
</Form>

)

</code-snippet>