Giter Club home page Giter Club logo

reroute's Introduction

reroute

a fast, declarative microrouter for reason-react

Getting started

Installation

Open a Terminal in your project's folder and run,

$ yarn add reason-reroute

After installation, you will need to add this library to your bsconfig.json dependencies

"bs-dependencies": [
  "reason-react",
  "reason-reroute"
],

Usage

module RouterConfig = {
  type route =
    | Admin
    | Home;
  let routeFromUrl = (url: ReasonReact.Router.url) =>
    switch url.path {
    | ["admin"] => Admin
    | [] => Home
    };
  let routeToUrl = (route: route) =>
    switch route {
    | Admin => "/admin"
    | Home => "/"
    };
};

module Router = ReRoute.CreateRouter(RouterConfig);

let component = ReasonReact.statelessComponent("App");

let make = _children => {
  ...component,
  render: _self =>
    <Router.Container>
      ...(
           (~currentRoute) =>
             switch currentRoute {
             | RouterConfig.Admin => <Admin />
             | RouterConfig.Home => <Home />
             }
         )
    </Router.Container>
};

API

Sections below are under construction.

Link

Container

Rationale

ReasonReact comes with a router (ReasonReact.Router) by default. It offers minimal yet powerful API that is suitable for applications at any scale. However, being just an API, it leaves the routing logic up to the developer. This library builds on top of it to provide an elegant interface for working with routes that is ready to use, predictable and consistent across apps you create.

Credits

The concept of reroute has been highly influenced by @thangngoc89 and his reference implementation. Thank you for pushing this forward!

License

MIT (c) 2018 Callstack

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.