Routing
alex-kinokon opened this issue · 9 comments
I am looking forward to using Monkberry in my next project. What router plays well with Monkberry?
If you end up with some nice approach, write you solution. It there interesting to see.
Express inspired micro router:
https://github.com/visionmedia/page.js
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.
@benjamminf Cool!
I'm going to write an article soon about routing too.
@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
I'm going to write an article soon about routing too.
Hey @Elfet how is that article coming along? :)
Hey @PierBover it's still in my backlog, but now do not have much time.