Masonite Inertia
4.X
4.X
  • Introduction
  • Installation
  • Demo app
  • The basics
    • Routing
    • Responses
    • Redirects
    • Validation
    • Shared data
    • File uploads
  • Advanced
    • Configuration
    • Root view
    • Partial reloads
    • Authorization
    • CSRF protection
    • Error handling
    • Assets versioning
    • Server-side rendering
    • Testing
  • Development
    • Changelog
    • Contribute
    • Support
Powered by GitBook
On this page
  • Generating URLs
  • Generate server-side and send them as props
  • Generated as JSON and include in view

Was this helpful?

  1. The basics

Routing

With Inertia all routing is defined server-side.

Generating URLs

To avoid hard-coding URLs path into your application client-side it would be good if Masonite could send the routes information. There are different options you can use.

Generate server-side and send them as props

Here the url to create a user is generated in the controller and sent to client through the prop create_url.

from masonite.routes import Router

class UsersController(Controller):

    def index(self, view: InertiaResponse, router: Router):
        return view.render(
            "Users/Index",
            {
                "users": User.all().serialize(),
                "create_url": router.route("users.create"),
            },
        )

Generated as JSON and include in view

You can also generate all your routes (or a selection) as a JSON payload that you will include into your view.

app.html
<head>
    <!-- ... -->
    {{ routes() }}
<head>

It will actually generate this

var Routes = {
  namedRoutes: {
    home: { uri: "/", methods: ["GET", "HEAD"], domain: null },
    login: { uri: "login", methods: ["GET", "HEAD"], domain: null },
    users: { uri: "users", methods: ["GET", "HEAD"], domain: null },
    "users.create": { uri: "users", methods: ["POST", "HEAD"], domain: null },
  },
  baseUrl: "http://your-app.com/",
  baseProtocol: "http",
  baseDomain: "your-app.com",
  basePort: false,
};

export { Routes };

Then you're free to use this global variable into your client-side application to get route path from the name.

route("home"); // 'https://your-app.com/
route("users.create"); // 'https://your-app.com/users'
PreviousDemo appNextResponses

Last updated 3 years ago

Was this helpful?

To help you in the process you can use the small package . It provides a routes() helper that you can use in your view to include the routes client-side. After installing the package you just have to add this to your view.

Hopefully an existing package called can be installed to provide some javascript helpers that can parse this Routes variable.

masonite-js-routes
ziggy-js