skills.rest
rizalord
rizalordCOMMUNITY
Explore all skills by this author →
Website𝕏@rizalord_GitHub

wayfinder-development

Generates typed TypeScript functions for Laravel routes and controller actions.

Updated Aug 5, 2026
Search Tags:#typescript#frontend#code generation#laravel#routes#inertia#wayfinder
One-click install
npx skills add https://github.com/rizalord/livecode-ptbeon --skill wayfinder-development-rizalord
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/rizalord/livecode-ptbeon/tree/main/src/backend/.grok/skills/wayfinder-development
Command: npx skills add https://github.com/rizalord/livecode-ptbeon --skill wayfinder-development-rizalord

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Connecting a React, Vue, Svelte, or Inertia frontend to a Laravel backend often means hardcoding URLs and manually tracking route changes, which leads to broken links and TypeScript errors. This Skill generates type-safe route functions so frontend code always matches backend routes. ## Core Features & Use Cases - Typed Route Generation: Run php artisan wayfinder:generate to produce importable TypeScript functions for every Laravel controller action and route. - Flexible Helpers: Use .url(), .get(), .post(), .form(), and query parameter support to build URLs, HTTP calls, and HTML form attributes. - Tree-Shakable Imports: Import named functions from @/actions or @/routes so unused routes are excluded from the bundle. - Use Case: When wiring a React form to a Laravel PostController@store endpoint, import store from @/actions/App/Http/Controllers/PostController and spread store.form() onto an Inertia <Form> component instead of hardcoding /posts. ## Quick Start Ask the AI to connect your React form to the Laravel post creation endpoint using Wayfinder route functions instead of hardcoded URLs.

Frequently Asked Questions about wayfinder-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I connect a React frontend to Laravel routes with Wayfinder?▼

Run php artisan wayfinder:generate to create typed functions, then import named actions like store or show from @/actions/App/Http/Controllers. Call store.post() or spread store.form() onto a form instead of hardcoding URLs.

How do I regenerate Wayfinder routes after changing Laravel routes?▼

Run php artisan wayfinder:generate --no-interaction after any route change if the Vite plugin is not installed. Add the --with-form flag when you need form helper attributes for HTML or Inertia forms.

Does Wayfinder work with Inertia forms in React?▼

Yes, Wayfinder integrates with the Inertia Form component. Spread the result of store.form() onto the Form component to get the correct action URL and HTTP method automatically.

Why do my Wayfinder imports break tree-shaking?▼

Tree-shaking breaks when you use default imports instead of named imports. Always import specific functions like import { show, store } from the controller module so unused route code is excluded from the bundle.

When should I not use Wayfinder?▼

Wayfinder is not suited for backend-only tasks since it exists to bridge frontend code with Laravel routes. If your project has no JavaScript frontend consuming Laravel endpoints, typed route generation provides no benefit.

Related Skills

Explore More Software Engineering Skills→
Mantis-TechnologyMantis-Technology

wayfinder-development

Generates typed TypeScript functions for Laravel routes and controller actions.

Official
Basic
cmayorgahilariocmayorgahilario

wayfinder-development

Generate typed route helpers for Laravel frontends with Wayfinder.

Community
Advanced
trypostittrypostit
483

wayfinder-development

Generate typed Laravel route helpers for React, Vue, Svelte, or Inertia frontends.

Official
Advanced
dspangenbergdspangenberg
2

wayfinder-development

Generate type-safe Laravel route and controller helpers for React, Vue, Svelte, and Inertia.

Community
Intermediate