skills.rest
bjorkgard
bjorkgardCOMMUNITY
Explore all skills by this author →
GitHub

wayfinder-development

Generate type-safe Laravel route imports for TypeScript frontend components.

Updated Mar 5, 2026
Search Tags:#typescript#development#frontend#routing#backend#laravel
One-click install
npx skills add https://github.com/bjorkgard/convention-hosts --skill wayfinder-development-bjorkgard
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/bjorkgard/convention-hosts/tree/main/.agents/skills/wayfinder-development
Command: npx skills add https://github.com/bjorkgard/convention-hosts --skill wayfinder-development-bjorkgard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the process of referencing backend routes within frontend components, ensuring type safety and reducing errors in web application development.

Core Features & Use Cases

  • Type-Safe Routing: Provides a robust way to import and use backend routes in TypeScript/JavaScript.
  • Route Generation: Facilitates the regeneration of route files after changes.
  • Use Case: When developing a new feature that requires linking to a specific backend endpoint, this Skill ensures the frontend code correctly references the route, preventing 404 errors and improving maintainability.

Quick Start

Run php artisan wayfinder:generate to regenerate routes if the Vite plugin is not installed.

Frequently Asked Questions about wayfinder-development

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

FAQPage Schema
How do I call Laravel routes from TypeScript safely?▼

You can call Laravel routes from TypeScript by importing generated route definitions into frontend components, ensuring type-safe parameter handling to prevent 404 errors and improve maintainability.

What is type-safe backend route referencing in frontend development?▼

Type-safe backend route referencing is the mechanism of importing generated route definitions into TypeScript components, ensuring strict parameter validation and route generation to prevent mismatched URLs during web application development.

How do I regenerate Laravel route files for a frontend Vite workflow?▼

You regenerate Laravel route files for frontend workflows by running the command `php artisan wayfinder:generate`, which updates the route definitions if the Vite plugin is not installed or active.

Can I use this route generation approach without the Vite plugin installed?▼

Yes, you can use this route generation approach without the Vite plugin installed. You simply run `php artisan wayfinder:generate` to manually regenerate the route files after making backend route changes.

Why does my frontend component throw a 404 when linking to a backend endpoint?▼

Your frontend component throws a 404 error because the backend route referencing is mismatched. By importing routes with type-safe parameter handling, you ensure the frontend code correctly references the specific backend endpoint.

Related Skills

Explore More Software Engineering Skills→
o2b3ko2b3k

wayfinder-development

Generate type-safe TypeScript helpers for Laravel routes and controller actions.

Community
Intermediate
snyksnyk
2.9k

web-artifacts-builder

Bundle React and TypeScript frontend artifacts into single HTML files.

Official
Intermediate
osmanmoharramosmanmoharram

wayfinder-development

Resolve Laravel backend route references in frontend TypeScript code.

Community
Intermediate
noartemnoartem

wayfinder-development

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

Community
Intermediate