Navigo NPM | npm.io

Navigo

A simple dependency-free minimalistic JavaScript router

size

v.8+ documentation
v.7 documentation
Examples
Changelog
Using React? Checkout navigo-react package.
🎮 Online playground here codesandbox.io/s/navigo-example-jrui8;

Navigo

Selling points

Dependency free
~10KB minified, ~4KB gzipped
Based on History API so it does update the URL of the page
Supports hash based routing too
Simple mapping of route to a function call
Parameterized routes
Navigating between routes
Hooks (before, after, leave, already)
Not-found and default handler
Easy integration with HTML links via data-navigo HTML attribute

Installation

Drop the following into your page:

<script src="//unpkg.com/navigo"></script>

or via npm/yarn:

> npm install navigo --save
> yarn add navigo -S

Quick start

const router = new Navigo('/');

The constructor of the library accepts a single argument - the root path of your app. If you host your project at https://site.com/my/awesome/app, your root path is /my/awesome/app. Then you have to define your routes.

router.on('/products/list', function () {
  // do something
});

At the end you have to trigger the resolving logic:

router.resolve();

After that when you need a page change call the navigate method. This one changes the URL and (by default) triggers resolve.

router.navigate('/about');

Add data-navigo attribute to your page links and they'll be transformed into navigate callers.

<a href="/about/contacts" data-navigo>Contacts</a>

Checkout the online playground to see it in action.

Development

> yarn dev

Building

> yarn build

Tests

> yarn test
> yarn test-watch

MISC

A modern JavaScript router in 100 lines

router vanilla history

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

7 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

9 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago

10 years ago