wayfinder-development

Generate Laravel backend route definitions for TypeScript and JavaScript frontends.

Updated Jun 19, 2023
One-click install
npx skills add https://github.com/JeroenJochems/modelwise --skill wayfinder-development-jeroenjochems
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/JeroenJochems/modelwise/tree/main/.claude/skills/wayfinder-development
Command: npx skills add https://github.com/JeroenJochems/modelwise --skill wayfinder-development-jeroenjochems

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines frontend development by providing a robust way to reference backend Laravel routes, ensuring type safety and reducing manual URL management.

Core Features & Use Cases

  • Type-Safe Route Referencing: Import and use backend routes directly in your TypeScript/JavaScript frontend code.
  • Automated Route Generation: Generates route definitions that can be consumed by frontend frameworks.
  • Use Case: When building a new feature that requires creating a new post, you can use the store route function imported from @/actions to generate the correct URL and HTTP method for your form submission.

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 generate Laravel routes for frontend TypeScript consumption?

To generate Laravel routes for frontend TypeScript consumption, run the `php artisan wayfinder:generate` command. This produces type-safe route definitions you can import directly into JavaScript and TypeScript components.

What is type-safe route referencing in a Laravel frontend application?

Type-safe route referencing in a Laravel frontend means importing backend route definitions directly into TypeScript code, which reduces manual URL management and ensures the frontend uses correct paths and HTTP methods.

Can I use named Laravel routes and controller action imports in JavaScript?

Yes, you can use named Laravel routes and controller action imports in JavaScript. The generated definitions support importing specific controller actions and named routes for dynamic URL generation within your components.

How do I get form attributes and HTTP methods from Laravel routes in TypeScript?

You can get form attributes and HTTP methods from Laravel routes in TypeScript by using the provided methods on the imported route functions. These methods expose the necessary HTTP verbs and form attributes for frontend submissions.

Do I need a Vite plugin to automate Laravel route generation for frontend code?

You do not need a Vite plugin to automate Laravel route generation for frontend code. If the Vite plugin is not installed, you can manually regenerate the route definitions by running the `php artisan wayfinder:generate` command.