Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 26 additions & 13 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,30 +1,48 @@
# render-preset-react-redux
# React Redux Render

HTTP middleware for rendering React Redux apps on the server.

[![Build Status](https://travis-ci.org/nealgranger/react-redux-render.svg?branch=master)](https://travis-ci.org/nealgranger/react-redux-render)
[![Coverage Status](https://coveralls.io/repos/github/nealgranger/react-redux-render/badge.svg?branch=master)](https://coveralls.io/github/nealgranger/react-redux-render?branch=master)

### Installation

```
npm install --save react-redux-render
```

## Example

*`server.js`*

```js
...
import http from 'http';
import compose from 'lodash/function/compose';
import { connect } from 'http-middleware-metalab';
import base from 'http-middleware-metalab/base';
import webpack from 'http-middleware-metalab/webpack';
import send from 'http-middleware-metalab/middleware/send';
import empty from 'http-middleware-metalab/middleware/empty';

import renderReactRedux from 'render-preset-react-redux';
import renderReactRedux from 'react-redux-render';

import Root from './containers/root';
import createStore from './store';

const createApp = compose(

// Base & webpack HTTP middleware.
...
base(),
webpack({ assets: { stats: './build/client/stats.json' } }),

renderReactRedux({
rootComponent: Root,
createStore,
});
)
}),

send(),
empty
);

export default connect(createApp(), http.createServer());
```

## Config options
Expand All @@ -39,9 +57,4 @@ Optional
- **`renderRoot`**`: Function` - Use this instead of `options.rootComponent` if your app has a more complicated entry point. Receives the Redux store as a arguments and returns a string of markup.
- **`mapState`**`: Function` - Returns an object with the shape `{ status, title, path, locale }`.
- **`mapAssets`**`: Function` - Receives the Redux state and the request object as arguments returns an object with the shape `{ styles[], scripts[] }`.
- **`getHeaders`**`: Function` - Receives the Redux state and the request object as arguments and return an object with header key-value pairs.
- **`staticRender`**`: Boolean` - Use `reactDOM.renderToStaticMarkup` when rendering `options.rootComponent`. Has no effect if `options.renderRoot` is specified.

####Todo
- [ ] tests
- [ ] `Content-Security-Policy` header