wayfinder-development

Generate type-safe Laravel route objects and URL builders for frontend TypeScript code.

Updated Jun 8, 2025
One-click install
npx skills add https://github.com/noartem/kawa --skill wayfinder-development-noartem
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/noartem/kawa/tree/main/ui/.opencode/skills/wayfinder-development
Command: npx skills add https://github.com/noartem/kawa --skill wayfinder-development-noartem

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Activates when frontend components reference backend routes, enabling consistent route generation, import patterns, and navigation through Wayfinder utilities.

Core Features & Use Cases

  • Route generation: Generate and resolve route objects and URLs from frontend code.
  • Import patterns: Import route helpers and actions from the Wayfinder module to enable type-safe usage.
  • Navigation & linkage: Create links and navigations to backend endpoints with consistent typing and URL generation.

Quick Start

Refresh the frontend route helpers after updating backend routes.

Frequently Asked Questions about wayfinder-development

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

FAQPage Schema
How do I generate type-safe Laravel routes in a TypeScript frontend?

Generate type-safe Laravel routes in TypeScript by using Wayfinder utilities to create route objects and URL builders. This bridges frontend components to backend endpoints, ensuring consistent route generation and import patterns from @/actions or @/routes.

Why do my frontend route helpers mismatch my Laravel backend endpoints?

Frontend route helpers mismatch Laravel endpoints when backend routes are updated without refreshing the frontend route generation. Refresh the frontend route helpers after updating backend routes to resolve import patterns and maintain type-safe URL construction.

Can I call Laravel routes from TypeScript without losing type safety?

Yes, you can call Laravel routes from TypeScript without losing type safety by importing route helpers and actions from the Wayfinder module. This provides type-safe route objects, URL construction, and helper methods for backend navigation.

What is the best way to link frontend navigation to Laravel backend routes?

The best way to link frontend navigation to Laravel backend routes is using Wayfinder to generate type-safe URLs and route objects. This creates consistent navigation and linkage to backend endpoints with clear guidance for verification.

Do I need to manually update URLs when Laravel routes change?

You do not need to manually update URLs when Laravel routes change if you use Wayfinder for route generation. Refresh the frontend route helpers after backend updates to automatically resolve new route objects and maintain type-safe URL builders.

What limitations exist when bridging frontend components to Laravel backend routes?

Limitations arise when frontend components reference backend routes without a bridge like Wayfinder. Without type-safe route generation and URL builders, importing from @/actions or @/routes lacks consistent typing and verification for Laravel endpoint navigation.