Cofree React Router
bower i --save purescript-cofree-react-router npm i --save warning react react-dom
Routing library for
React in the spirit of
The router has type
type Router props args = (RoutePropsClass props) => Cofree List (Tuple (Route props args) (Maybe (IndexRoute props args)))
thus it is a cofree comonad for the
You can define router using
:+ (adds routes without index) and
standard combinator for unfolding a cofree comonad) combinators:
router :: Router RouteProps Unit router = Route "main" (unit <$ lit "") mainClass :+ (Route "home" (unit <$ lit "home") homeClass :+ Nil) : (Tuple (Route "user" (unit <$ (lit "user" *> int)) userClass) (Just $ IndexRoute "user-index" userIndexClass) :< (Route "book" (unit <$ (lit "books" *> int)) bookClass :+ (Route "pages" (unit <$ lit "pages") pagesClass :+ (Route "page" (unit <$ int) pageClass :+ Nil) : Nil) : Nil) : Nil) : (Route "user-settings" (unit <$ (lit "user" *> int *> lit "settings")) settingsClass :+ Nil) : Nil
Urls are parsed using the applicative parser from routing package. There are some assumptions:
- if you need to use query args, the router is taking care of them and the
parsed dictionary is made available in
RouteParamsfor all the routes. The cofree router will go through the parsed url and sum all query maps and use that. You can still match
paramsin parts of the url, but then they will be available only for that route.
- The router will match end of url with
end <|> lit "" *> end <|> params *> endto check if all the route parts where exhousted. This matches end, trailing "/" or trailing search params.
For now, only browser history is supported, but it's not to difficult to change the browserRouter spec to use hash history.
Server side rendering
For server side rendering use
matchRouter. Checkout the isomorphic react
example how to
set-up server side rendering together with hyper.
Checkout the included example. To build and run type
npm run example
http://localhost:8080 in your prefered browser.