❤
npm
Sign UpSign In

hapi-redux-router

1.2.1 • Public • Published

Update

Deprecated in favour of https://github.com/prashaantt/hapi-react-ssr.

hapi-redux-router

Currently only supports manifest-style route declarations.

Dependency Status devDependency Status

Installation

$ npm install hapi-redux-router --save

Usage

Define your routes as a manifest:

const App = require('./App');
const Homepage = require('./Homepage');
 
 
const routes = [
    {
        path: '/',
        component: App,
        indexRoute: { component: Homepage },
        childRoutes: [...]
    }
];
 
 
module.exports = routes;

Require and register normally as a hapi plugin (vision is a dependency for rendering the template):

const HapiReduxRouter = require('hapi-redux-router');
const Vision = require('vision');
 
 
server.register([
    {
        register: Vision
    },
    {
        register: HapiReduxRouter,
        options: {...}
    }
]); 

Options

The plugin accepts the following options:

  • store (Object - optional): The redux store, generally created using Redux.createStore(), but stores created with redux middleware work just fine too.
  • routes (Array - required): The routes to React components declared as a manifest.
  • bootstrapAction (Function - optional): The redux action to dispatch to load the initial data.
  • template (String - required): The template file /path/name to use for rendering the view. Internally uses reply.view provided by vision. The templating engine to use is up to you. See vision docs.
  • params (Object - optional): Additional params to pass to the template context object. componentRenderedToString and initialState are reserved for internal use (see below).

Notes

  • This plugin uses componentRenderedToString prop to store the server-side rendered root React component, and initialState to store the computed initial state from the Redux store. Include them appropriately in your template.
{{! handlebars example }}
 
<html>
<body>
    <div id="react-root">{{{ componentRenderedToString }}}</div>
    <script type="application/javascript">
        {{#if initialState}}
        window.__INITIAL_STATE__ = {{{ initialState }}};
        {{/if}}
    </script>
</body>
</html>
  • If you're using ES6-style module exports for routes and action files, ensure to pass their appropriate exports to this plugin.
const reducer = require('./my-reducer').default;
const bootstrapAction = require('../my-actions').defaultAction;
  • This plugin uses a catch-all hapi route to pass all incoming requests to the react-router. You will generally need to override this behaviour with other more specific routes in your app — to serve static files, for example.

Example

Look at hapi-react-transform-boilerplate to see this plugin in action.

License

MIT

Readme

Keywords

none

Package Sidebar

Install

npm i hapi-redux-router

Repository

github.com/prashaantt/hapi-redux-router

Homepage

github.com/prashaantt/hapi-redux-router

Weekly Downloads

1

Version

1.2.1

License

MIT

Last publish

Collaborators

  • prashaantt
Try on RunKit
Report malware