skills.rest
coleYab
coleYabCOMMUNITY
Explore all skills by this author →
𝕏@coleYabuGitHub

wayfinder-development

Generates typed TypeScript functions for Laravel routes and controller actions.

Updated Aug 31, 2026
Search Tags:#typescript#full-stack#laravel#type-safe#inertia#wayfinder#route generation
One-click install
npx skills add https://github.com/coleYab/usacr --skill wayfinder-development-coleyab
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/coleYab/usacr/tree/main/.grok/skills/wayfinder-development
Command: npx skills add https://github.com/coleYab/usacr --skill wayfinder-development-coleyab

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 uses Laravel Wayfinder to auto-generate typed route functions so frontend code always stays in sync with backend routes. ## Core Features & Use Cases - Typed Route Generation: Run php artisan wayfinder:generate to produce tree-shakeable TypeScript functions for every controller action and named route. - Flexible Call Patterns: Use .url(), .get(), .post(), .form(), and query parameter options to build URLs, HTTP method calls, and HTML form attributes. - Inertia Integration: Pass store.form() directly into Inertia's <Form> component for end-to-end typed form submissions. - Use Case: When building a lottery ticket purchase page in an Inertia React app, import the generated store action from the controller and wire it to a form instead of hardcoding /tickets endpoints. ## Quick Start Ask the AI to wire up a frontend form to a Laravel controller using Wayfinder typed 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 generate typed route functions for Laravel controllers?▼

Run php artisan wayfinder:generate --no-interaction to generate typed TypeScript functions for all controllers and routes. Add the --with-form flag if you need form helper attributes for HTML or Inertia forms.

How do I use Wayfinder with Inertia React forms?▼

Import the generated action and spread its form attributes into Inertia's Form component, for example <Form {...store.form()}>. This provides the correct action URL and HTTP method without hardcoding endpoints.

Does Wayfinder support query parameters and route model binding?▼

Yes, pass a query object as the second argument, such as show(1, { query: { page: 1 } }), to append query strings. Route model binding works through type-safe parameter objects matching your Laravel route signatures.

Why are my Wayfinder TypeScript imports failing?▼

Imports fail when routes have changed but the generated files are stale, or when default imports are used instead of named imports. Regenerate with php artisan wayfinder:generate and use named imports to preserve tree-shaking.

When should I not use Wayfinder?▼

Wayfinder is not needed for backend-only Laravel tasks with no frontend route consumption. It is designed specifically for connecting JavaScript frontends to Laravel routes and controller actions.

Related Skills

Explore More Software Engineering Skills→
trypostittrypostit
483

wayfinder-development

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

Official
Advanced
muddassarsaleemiqbalmuddassarsaleemiqbal

wayfinder-development

Generate type-safe Laravel route helpers for frontend frameworks.

Community
Advanced
angelgarciasolorzanoangelgarciasolorzano

wayfinder-development

Generate typed functions for Laravel controllers and routes.

Community
Intermediate
dspangenbergdspangenberg
2

wayfinder-development

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

Community
Intermediate