@riogz/router5
TypeScript icon, indicating that this package has built-in type declarations

9.0.1 • Public • Published

Router5

npm version License: MIT Build Status Join the chat at https://gitter.im/router5/router5 styled with prettier

Updated and bug fixed

Official website: router5.js.org

router5 is a framework and view library agnostic router.

  • view / state separation: router5 processes routing instructions and outputs state updates.
  • universal: works client-side and server-side
  • simple: define your routes, start to listen to route changes
  • flexible: you have control over transitions and what happens on transitions
import createRouter from 'router5'
import browserPlugin from 'router5-plugin-browser'

const routes = [
    { name: 'home', path: '/' },
    { name: 'profile', path: '/profile' }
]

const router = createRouter(routes)

router.usePlugin(browserPlugin())

router.start()

With React (hooks)

import React from 'react'
import ReactDOM from 'react-dom'
import { RouterProvider, useRoute } from 'react-router5'

function App() {
    const { route } = useRoute()

    if (!route) {
        return null
    }

    if (route.name === 'home') {
        return <h1>Home</h1>
    }

    if (route.name === 'profile') {
        return <h1>Profile</h1>
    }
}

ReactDOM.render(
    <RouterProvider router={router}>
        <App/>
    </RouterProvider>,
    document.getElementById('root')
)

With observables

Your router instance is compatible with most observable libraries.

import { from } from 'rxjs/observable/from'

from(router).map(({ route }) => {
    /* happy routing */
})

Examples

Docs

Package Sidebar

Install

npm i @riogz/router5

Weekly Downloads

3

Version

9.0.1

License

MIT

Unpacked Size

90.3 kB

Total Files

23

Last publish

Collaborators

  • riogod