Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

@nicolasparada/router

0.5.0 • Public • Published

JavaScript Router

  • Lightweight (989 bytes).
  • Framework agnostic.

Shipped like an ES module. Load it with <script type=module>.

Example

import Router from 'https://unpkg.com/@nicolasparada/router'
 
const main = document.querySelector('main')
const router = new Router()
 
router.handle('/', homePage)
router.handle(/^\/users\/([^\/]+)$/, userPage)
router.handle(/^\//, notFound)
router.install(render)
 
function homePage() {
    return 'Home Page'
}
 
function userPage(username) {
    return `${username}'s Profile Page`
}
 
function notFoundPage() {
    return '404 Not Found'
}
 
function render(result) {
    main.innerHTML = result
}

Check for a more real-ish example at the /example dir.

Handle

router.handle('/', (...params) => {
    // ...
})

handle takes a pattern and a handler function. The pattern can be a string for exact match or a regular expression for dynamic URLs. params are the captured parts if a regular expression was used. Be careful with the order in which you add the routes.

Install

router.install(result => {
    // ...
})

This callback is fired initially and for every link click, pop and pushstate event. result is what the route handler returns.

Navigate

Router.navigate('/')

This static method allows you to navigate imperatively. Under the hood, it uses a custom event "pushstate".

Keywords

install

npm i @nicolasparada/router

Downloadsweekly downloads

32

version

0.5.0

license

ISC

repository

githubgithub

last publish

collaborators

  • avatar