Frontend routing

In Sulu’s backend UI it is not like you click on a link and get redirected to a whole another page. Basically there are only two main pages which you can redirect to in that sense that they load everything from start, namely the admin- and the login-page.

For your own bundle you have to tell the frontend framework which route corresponds to which view. If a user then navigates to the route you have configured, the frontend framework grabs your view-component and renders it in the content-column. For defining routes we use backbone.js.

The whole registering process is done in your bundle-extension file.

Lets say we are a spaceship manufacturer and have written view-component in Resources/public/js/components/list/main.js which renders a list of all spaceships contained in our system. To make our view appear when a user navigates to admin/#vehicles/spaceships we’d write the following into the bundle-extension:

// list all spaceships
sandbox.mvc.routes.push({
    route: 'vehicles/spaceships',
    callback: function() {
        return '<div data-aura-component="list@suluvehicles"/>';
    }
});