Routing

You can use any (or no) client side router with Presto - it is not tied to any particular implementation. It provides some general utilities to assist with routing (both client or server side).

  • UrlPattern provides a standard way to define URL patterns with functions to resolve any arguments or append query string parameters.
  • NamedUrlPatterns lets you specify a name for a UrlPattern and use that throughout your site rather than hardcoding a URL.
  • useUrlQueryState makes dealing with state stored in URL query parameters as convenient as the useState hook.

Installation

yarn add @prestojs/routing

Usage

Often times it's desirable to have a single location where all URLs can be referred to by name. This allows for the specific routes to change without having to update all usages of it.

For example in a file namedUrls.js:

import { NamedUrlPatterns, UrlPattern } from '@prestojs/routing';

export default new NamedUrlPatterns({
    'user-list': new UrlPattern('/users/'),
    'user-detail': new UrlPattern('/users/:id/'),
});

Then elsewhere you can resolve URLs by name:

// ... elsewhere
import namedUrls from '../urls';

namedUrls.resolve('user-list');
// /users/
namedUrls.resolve('user-detail', { id: 5 }, { query: { showAddresses: true } });
// /users/5/?showAddresses=true

// Or to get the pattern directly without resolving URL
namedUrls.get('user-list');
// UrlPattern('/users/')