<aside> 🚧 Since the library is still in the development stage, it is not recommended to use it on production.

</aside>

Introduction

The library allows you to set up isomorphic routing for the server-side rendered React application. It aims to provide a strongly typed and declarative way of defining the router related logic.

Advantages

• It has strict, through and explicit type definitions built upon generic types. TypeScript will check and report any issues regarding the pathname, route parameters and queries.
  • That's possible because the routing configuration is defined explicitly in the code. This way, you and the TypeScript compiler will be able to easily follow how routes are defined. That isn't possible with the ambiguous file system routing.
• It helps to avoid redundant re-renders when some location or parameter changes. The updates in the routing context does not cause the whole app to re-render. Only the components that explicitly use the updated values will re-render.
• It supports React’s lazy loaded components.
• It supports server-side application’s routing in the same easy way as SPA’s routing .

Getting started

In your project’s directory, run:

npm i @ssr-tools/router

Then you can import createRouter function:

import { createRouter } from "@ssr-tools/router/createRouter";

createRouter()

It’s the primary function of this library. It creates everything you may need for your router. Provide it with a configuration for the application's routes. It returns the functions to render routes on the client and the server. The returned functions derive the types from the given configuration, which allows TypeScript to identify possible routing errors.

Usage

Creating router

To create a router, you need to import and call the createRouter function. As the first and only argument, you provide the configuration.