https://github.com/schorfes/routz

Define your SPA routes in a single source of truth - use them everywhere.
https://github.com/schorfes/routz

definitions helper lightweight path paths react route router routes routing single-page-applications typescript url

Last synced: 11 days ago
JSON representation

Define your SPA routes in a single source of truth - use them everywhere.

• Host: GitHub
• URL: https://github.com/schorfes/routz
• Owner: schorfES
• License: mit
• Created: 2021-08-09T15:41:36.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2024-09-01T18:14:10.000Z (2 months ago)
• Last Synced: 2024-10-17T21:28:38.135Z (21 days ago)
• Topics: definitions, helper, lightweight, path, paths, react, route, router, routes, routing, single-page-applications, typescript, url
• Language: TypeScript
• Homepage:
• Size: 2.55 MB
• Stars: 5
• Watchers: 2
• Forks: 0
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Routz /ɹuːts/

[![CI Status](https://github.com/schorfES/routz/actions/workflows/ci.yml/badge.svg)](https://github.com/schorfES/routz/actions)

[![Coverage Status on Codecov](https://codecov.io/gh/schorfES/routz/branch/main/graph/badge.svg)](https://codecov.io/gh/schorfES/routz)

[![Known Vulnerabilities](https://snyk.io/test/github/schorfES/routz/badge.svg)](https://snyk.io/test/github/schorfES/routz)

[![Minified gzipped size](https://badgen.net/bundlephobia/minzip/routz)](https://bundlephobia.com/result?p=routz)

![Types included](https://badgen.net/npm/types/tslib)

[![License MIT](https://badgen.net/npm/license/routz)](https://github.com/schorfES/routz/blob/main/LICENSE)

Define your SPA routes in a single source of truth - use them everywhere.

## Installation

Routz is available on [NPM](https://www.npmjs.com/package/routz):

```bash

npm install routz --save

```

or

```bash

yarn add routz

```

## Usage

The _routz_ package exposes a single `define` function that defines the application routes by the given parameter and returns helper functions to access these routes. A definition of application routes is an object with key/value pairs. Each key is the name of a route. It's meant to be used in your application later on. The value describes the path definition. Each path can contain params. Params are dynamic parts of a single path, that are defined in the format: `[param]`. Optional params are defined by a question mark at the end like: `[optionalParam?]`.

```javascript

// urls.js

import { define } from 'routz';

const { receive, resolve } = define({

  'index': '/[locale?]',

  'blog:list': '/[locale?]/blog',

  'blog:article': '/[locale?]/blog/[slug]',

});

export { receive, resolve };

```

In this example the `locale` param is optional. The `slug` param in the route `blog:article` is required.

The exposed functions can be used inside the application. For example in a react component (using Next.js):

```javascript

// list.jsx

import Link from 'next/link';

import React from 'react';

import { resolve } from 'app/urls';

export const List = ({ articles }) => (

  


    {articles.map(({ slug, title }) => (

      


        

          {title}

        

      

    ))}

  

);

```


## API

### `define(routes)`

Defines the routes and returns scoped `resolve` and `receive` functions that access the given routes.

### `resolve(name, params)`

This builds a path for a route by name and params. Params are dynamic parts of a single path, that are defined in the format: `[param]`. Optional params are defined by a question mark at the end like: `[optionalParam?]`. The params need to be passed as a key/value object. Optional params are not required to be defined in this object, but missing params will throw an error.

### `receive(name)`

Returns the route defintion by a given name.

## License

[LICENSE (MIT)](./LICENSE)