Hybridly

Routing ​

Learn how to render hybrid views and how to generate URLs on the front-end.

Overview ​

Hybridly, as opposed to single-page application, does not require redefining routes on the front-end. You only need to register routes and their controller actions as you would do in a normal Laravel application.

The only catch is to return a hybrid view instead of a Blade view. This is done by using the Hybridly\view function:

php
use App\Data\UserData;
use App\Models\User;

use function Hybridly\view; 

final readonly class ShowUserController
{
    public function __invoke(User $user)
    {
        return view('users.show', [ 
            'user' => UserData::from($user)
        ]);
    }
}

Learn more about sending responses in their documentation.

Generating URLs ​

Since views are written in single-file components, global Laravel or PHP functions like route are not available.

Instead, you may use Hybridly's route util. This function is typed, which means you get TypeScript autocompletion and static analysis.

php
Route::get('/', ShowIndexController::class)
  ->name('index')

Route::get('/users/{user}', [UsersController::class, 'show'])
  ->name('users.show')
vue
<script setup lang="ts">
import { route } from 'hybridly/vue'
</script>

<template>
	<a :href="route('users.show', { user: 1 })">
		Show the first user
	</a>
</template>
ts
import { route } from 'hybridly/vue'

route('index')
route('users.show', { user: 1 })

Reactivity

The route function is not reactive. It returns a string, not a Ref<string>.

Excluding or including routes ​

By default, vendor routes are not made available to the front-end and will not appear when using the route util.

This can be configured by updating the router.allowed_vendors key in config/hybridly.php.

php
return [
      'router' => [
        'allowed_vendors' => [ 
            'laravel/fortify',
        ],
        'exclude' => [],
    ],
];

Additionally, you may exclude specific routes by adding patterns to the router.exclude key. These filters are matched against the final URI, and support wildcards.

php
return [
      'router' => [
        'allowed_vendors' => [],
        'exclude' => [ 
            'admin*'
        ],
    ],
];