xander

xander

Overview

Single Page App Framework for React.

Look at example for minimal setup.

Built on rootr, formula and fluxury

Usage

Installation

npm install --save xander rootr fluxury formula

Router

var { router } = require('xander')
var { loadRoutes } = require('xander')

loadRoutes({
  routes: [{
    path: '/',
    load: () => System.import('./HomePage')
  }, {
    path: '*',
    component: (props) => <div>404</div>
  }])

Container Component

A component to render the current route content.

import {Container} from 'xander'
render( <Container router={...} location={...} />, document.all.root )

Link Component

A link component to hyperlink your app without annoying page refreshes.

import {Link} from 'xander'
<Link to="/buckets" />
<Link type="button" to="/buckets" />

Open path programmically

Manage location with the easy to use API.

import {location} from 'xander'
location.open('/buckets/1')

Use redirect to change the URL without adding an entry to the history state.

location.redirect('/buckets')

Replace routes

Routes and related location information stored as routes.

loadRoutes([{
  path: '/',
  load: loadContent( System.import('./pages/home') )
}])

Manage state with stores

Create custom stores with reducer function.

createStore(name, reducerOrSpec)`