Minimal example of universal route & render

[ericelliott]

I spent a couple solid days getting universal route & render working with redux-simple-router. For the legions of other people working on universal apps, I think it would be great to supply a minimal working example in the examples folder. =)

See also #231

I got this working in universal-react-boilerplate, but it needs a little tidying up if it's going to be used for a documentation example.

If you're looking at this for reference, please pay attention to the version, because in the future we'll strip this stuff out and replace it with react-easy-universal, which basically wrangles all these other libs together and automates this process.

[timdorr]

Do you want to submit a PR? That would be most helpful 😄

[ericelliott]

I would love to, but I'm afraid I already spent too much time on it, but I'll see if I can recruit somebody. =)

Updated the description to be helpful to anybody who would like to take this on.

[siawyoung]

Hey @ericelliott, I'd love to help out. Where's this description you're referring to?

[timdorr]

@siawyoung He means in the initial message of this issue. The basic gist is to create a very simple example of a universally rendered application.

[ericelliott]

👍

[gaearon]

I’m happy to accept a PR adding react-router-redux to the universal example in Redux repo.
It’s fine if it has only one or two routes.

The only thing additional to server rendering I want to show there is preparing the store with async action by grabbing static fetchData or similar on the component. That’s a very common technique we should describe.

[robbestad]

I got some time to spare to work up a minimal example, so I'd be happy to do it. What data source is preferrable to use?

[ericelliott]

@svenanders Maybe a route already available in existing examples in one of these repos?

[justin808]

@ericelliott I've got an example with server rendering:

shakacode/react-webpack-rails-tutorial. react-router-redux including Server Rendering using React on Rails, live at www.reactrails.com.

[xulien]

I just created a PR on redux repo
reduxjs/redux#1403

it's just a proposal awaiting remarks

[ivan-hilckov]

@xulien Great work! tnx

[abhijeetNmishra]

@ericelliott @gaearon i am using

const reduxRouterMiddleware = syncHistory(browserHistory);

above middle works for client side rendering. But if try to use same store on server it doesnt work.

Any help !!

[mjrussell]

@abhijeetNmishra Not sure if your comment is related to the original issue, but you are running into the fact that browserHistory doesn't exist on the server and will be undefined. Use memory history if running on the server instead.

[abhijeetNmishra]

@mjrussell

if (!client) {
    reduxRouterMiddleware = syncHistory(memoryHistory);
  } else {
    reduxRouterMiddleware = syncHistory(browserHistory);
  }

above is also not working when i am trying to create redux store.

[timdorr]

I just realized this landed in master too: https://github.com/reactjs/react-router-redux/tree/master/examples/server

I think this satisfies the original issue.

@abhijeetNmishra Check out the 4.0.0 branch. It should work for SSR just fine.

[abhijeetNmishra]

@timdorr i am gettin error:

(0 , _reactRouterRedux.routerMiddleware) is not a function

also i don't find routerMiddleware to be exported from react-router-redux file.

am i missing something for this implementation.

[timdorr]

npm install --save react-router-redux@next