Skip to main content

​
Ziggy

Use your Laravel named routes in JavaScript with a seamless route() helper function.

​
Why Ziggy?

Ziggy creates a JavaScript route() helper function that works like Laravel’s route() helper, allowing you to use your Laravel named routes in JavaScript just as easily as you do in PHP. 
// In your Laravel routes
Route::get('posts/{post}', [PostController::class, 'show'])->name('posts.show');

// In your JavaScript
route('posts.show', 1); // 'https://ziggy.test/posts/1'

Installation

Install Ziggy via Composer and get started in minutes

Quickstart

Learn the basics and start using Ziggy in your app

TypeScript Support

Auto-generate types for route names and parameters

Framework Integration

Use with Vue, React, or any JavaScript framework

​
Key Features

Route Helper

JavaScript route() function that mirrors Laravel’s PHP helper

Route Model Binding

Full support for Laravel’s route-model binding with custom keys

TypeScript Ready

Generate type definitions for route autocompletion

Vue Plugin

Built-in Vue plugin for seamless integration

React Hook

useRoute() hook for React applications

Route Filtering

Control which routes are exposed to JavaScript

​
Quick Example

// Basic usage
route('posts.index'); // 'https://ziggy.test/posts'

// With parameters
route('posts.show', 1); // 'https://ziggy.test/posts/1'

// With query parameters
route('posts.index', { page: 2, sort: 'date' }); 
// 'https://ziggy.test/posts?page=2&sort=date'

// Check current route
route().current('posts.index'); // true/false

// Get current route name
route().current(); // 'posts.index'

​
Getting Started

1

Install Ziggy

Add Ziggy to your Laravel application via Composer
composer require tightenco/ziggy
2

Add the Blade directive

Include the @routes directive in your main layout before your JavaScript
@routes
<script src="/js/app.js"></script>
3

Use the route() helper

Start using the route() function in your JavaScript
route('posts.show', { post: 1 });

​
Community

Ziggy is built and maintained by Tighten, a team dedicated to making Laravel development better. Join thousands of developers using Ziggy in production.

GitHub

View source code, report issues, and contribute

npm Package

Available as ziggy-js on npm

Build docs developers (and LLMs) love

Get started for freeTalk to us