laravel-inertia-react

Laravel + Inertia.js + React integration patterns. Use when building Inertia page components, handling forms with useForm, managing shared data, or implementing persistent layouts. Triggers on tasks involving Inertia.js, page props, form handling, or Laravel React integration.

By asyrafhussin · 1,572 installs

npx skills add asyrafhussin/agent-skills --skill laravel-inertia-react

Source repository · Upstream listing

Laravel + Inertia.js + React Comprehensive patterns for building modern monolithic applications with Laravel, Inertia.js, and React. Contains 30+ rules for seamless full stack development. When to Apply Reference these guidelines when: Creating Inertia page components Handling forms with useForm hook Managing shared data and authentication Implementing persistent layouts Navigating between pages Rule Categories by Priority Priority Category Impact Prefix 1 Page Components CRITICAL page 2 Forms & Validation CRITICAL form 3 Navigation & Links HIGH nav 4 Shared Data HIGH shared 5 Layouts MEDIUM layout 6 File Uploads MEDIUM upload 7 Advanced Patterns LOW advanced Quick Reference 1. Page Components (CRITICAL) page props typing Type page props from Laravel page component structure Standard page component pattern page head management Title and meta tags with Head page default layout Assign layouts to pages 2. Forms & Validation (CRITICAL) form useform basic Basic useForm usage form validation errors Display Laravel validation errors form processing state Handle form submission state form reset preserve Reset vs preserve form data form nested data Handle nested form data form transform Transform data before submit 3. Navigation & Links (HIGH) nav link component Use Link for navigation nav preserve state Preserve scroll and state nav partial reloads Reload only what changed nav replace history Replace vs push history 4. Shared Data (HIGH) shared auth user Access authenticated user shared flash messages Handle flash messages shared global props Access global props shared typescript Type shared data 5. Layouts (MEDIUM) layout persistent Persistent layouts pattern layout nested Nested layouts layout default Default layout assignment layout conditional Conditional layouts 6. File Uploads (MEDIUM) upload basic Basic file upload upload progress Upload progress tracking upload multiple Multiple file uploads 7. Advanced Patterns (LOW) advanced polling Real time polling advanced prefetch Prefetch pages advanced modal pages Modal as pages advanced infinite scroll Infinite scrolling Essential Patterns Page Component with TypeScript Form with useForm Persistent Layout Laravel Controller Shared Data (HandleInertiaRequests) Flash Messages Component How to Use Read individual rule files for detailed explanations and code examples: Project Structure References [Inertia.js Documentation](https://inertiajs.com/) Official Inertia.js docs [Laravel Documentation](https://laravel.com/docs) Laravel framework docs [React Documentation](https://react.dev/) Official React docs [Ziggy](https://github.com/tighten/ziggy) Laravel route helper for JavaScript License MIT License. This skill is provided as is for educational and development purposes. Metadata Version : 1.0.1 Last Updated : 2026 01 17 Maintainer : Asyraf Hussin Rule Count : 24 rules across 6 categories Tech Stack : Laravel 10+, Inertia.js 1.0+, React 18+, TypeScript 5+