New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

backbone-named-routes

Package Overview
Dependencies
Maintainers
1
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

backbone-named-routes

Backbone router implementation with named routes (aliases) for easy client side links generation

  • 2.0.4
  • latest
  • Source
  • npm
  • Socket score

Version published
Maintainers
1
Created
Source

Backbone named routes

Build Status Coverage Status NPM Status

Backbone router extension with named routes for easy client side links generation. Keep your url logic in one place and never type urls by hand again. Weighs less than 2KB.

Visit documentation site.

Tired of hand coding those pesky href attributes on anchors and having to go through all templates when urls are changed? This named router extension allows you to generate urls from named routes or route aliases. Your url structure is already written and defined in your standard Backbone router - it is a good place to generate urls from.

Examples and api

Extend named router and define your routes as you usually do:

var Router = BackboneNamedRouter.extend({

    routes: {
        '': 'home',
        'help': 'help',
        'search/:query': 'search',
        'search/:query/p:page': 'searchOnPage',
        'file/*path': 'downloadFile',
        'docs/:section(/:subsection)': 'docs'
    },

    ...

Create router instance:

var router = new Router({
    baseUrl: 'http://mysite.loc',
    usesPushState: true,
    root: ''
});

Get urls where and when you need them.

// outputs: 'http://mysite.loc'
router.url('home');

// outputs: 'http://mysite.loc/help'
router.url('help');

// outputs: 'http://mysite.loc/search/my-query'
router.url('search', {query: 'my-query'});

// outputs: 'http://mysite.loc/search/my-query/p2'
router.url('searchOnPage', {query: 'my-query', page: 2});

// outputs: 'http://mysite.loc/file/myFile.pdf?campaign=email'
router.url('downloadFile', {path: 'myFile.pdf'}, {campaign: 'email'});

// outputs: 'http://mysite.loc/docs/backbone/router'
router.url('docs', {section: 'backbone', subsection: 'router'});

Start Backbone history

Backbone.history.start(router.getHistoryStartParams());

Convenient helpers

Navigating to named routes is easy as:

// http://mysite.loc/help
router.navigateToRoute('help')

// http://mysite.loc/search/backbone
router.navigateToRoute('search', {query: backbone});

Navigating to urls:

// help route handler is dispatched
router.navigateToUrl('http://mysite.loc/help');

// you can pass jquery anchor objects
$('a.appLink').on('click', function(e) {
    e.preventDefault();
    router.navigateToUrl($(e.currentTarget));
});

Installation

Backbone named routes is packaged as UMD library so you can use it in CommonJS and AMD environment or with browser globals.

npm install backbone-named-routes --save
// with bundlers
var BackboneNamedRouter = require('backbone-named-routes');

// with browser globals
var BackboneNamedRouter = window.BackboneNamedRouter;

Keywords

FAQs

Package last updated on 06 Apr 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc