Routing

[alex-kinokon]

I am looking forward to using Monkberry in my next project. What router plays well with Monkberry?

[antonmedv]

Hi,

You can use any routing library you want.

For an example you can use director.

[antonmedv]

If you end up with some nice approach, write you solution. It there interesting to see.

[alonronin]

Express inspired micro router: https://github.com/visionmedia/page.js

[benjamminf]

I've come up with a pretty tiny implementation that I'm happy to share. I'm not exactly using a routing library, but I've set it up in a way that a routing library could trivially be tacked on top.

First, I created a routes.js file that holds a list of Monkberry templates:

export default {
    home: HomeTemplate,
    settings: SettingsTemplate,
    ...
}

Next, I created a custom directive that will act sort of like a dynamic component.

import Monkberry from 'monkberry'
import routes from './routes'

export default class
{
    constructor()
    {
        this._rendered = {}
    }

    bind(node)
    {
        this.node = node
    }

    unbind(node)
    {
        this.node.innerHTML = ''
        this.node = null
    }

    update(name)
    {
        this.node.innerHTML = ''

        // Keep previously rendered templates alive
        if(this._rendered[name])
        {
            this._rendered[name].appendTo(this.node)
        }
        else
        {
            const Template = routes[name]
            this._rendered[name] = Monkberry.render(Template, this.node)
        }
    }
}

My main App.monk component uses the routes directive like this:

<div class="app">
    <div class="app_page" :route={{ page || 'home' }}></div>
</div>

This is the absolute basics of what I ended up doing. In reality I'm using Redux to maintain state, which complicates this a little more but at it's core this is how it works. Adding in a routing library like director would be simple, as routes are just bound to callbacks, which you would just use to update() your App's page property.

[antonmedv]

@benjamminf Cool!

I'm going to write an article soon about routing too.

[godDLL]

@elfet where will I be able to read the aforementioned article?

[antonmedv]

@godDLL now have not much time, need to work. Next chapter i'm going to write will be about performance. After that try to write about routing.

But there a lot of routers for js what you can use right now. Like director: https://github.com/flatiron/director

[PierBover]

I'm going to write an article soon about routing too.

Hey @elfet how is that article coming along? :)

[antonmedv]

Hey @PierBover it's still in my backlog, but now do not have much time.