F
F
fullj02016-12-16 08:44:09
Node.js
fullj0, 2016-12-16 08:44:09

How to do server-side rendering of React/Redux apps with Sails.js backend?

For Sails, there is a sails-hook-react-router module. It allows you to organize server-side rendering of applications on React without any problems, for this it is enough to call clientRoutera method from the entry point.
You can see an example at the link (unfortunately for "bare" React-a - without Redux-a) - https://github.com/teamfa/sails-hook-react-router
But in case of using redux at the entry point, we must wrap component Routerto component Provider:

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { Router, browserHistory } from 'react-router';

import configureStore from './store/configureStore';
import getRoutes from './routes';
...
const AppContainer = (
  <Provider store={store}>
    <div>
      <Router
        history={browserHistory}
        children={getRoutes()}
        createElement={appComponent}
      />
    </div>
  </Provider>
);

ReactDOM.render(AppContainer, document.getElementById('app'));

And I do not quite understand how to combine these two entry point requirements for server-side rendering to work in a Sails / React and Redux application. Maybe you have had such an experience, or do you know where you can see the code of an application organized in this way?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
D
Dmitry Kalyuk, 2016-12-16
@kalyukdo

You don't need sailsjs for rendering,
look here https://github.com/kalyuk/webpack-react-template
you just need this file
https://github.com/kalyuk/webpack-react-template/b...
this is certainly not the latest build, but it should lead to thoughts

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question