spee.ch/react/client.js

48 lines
1.4 KiB
JavaScript
Raw Normal View History

2018-01-29 20:47:12 +01:00
import React from 'react';
2018-02-21 22:42:41 +01:00
import { hydrate } from 'react-dom';
import { Provider } from 'react-redux';
2018-02-07 04:00:52 +01:00
import { createStore, applyMiddleware, compose } from 'redux';
import { BrowserRouter } from 'react-router-dom';
2018-01-29 20:47:12 +01:00
import Reducer from 'reducers';
2018-02-07 04:00:52 +01:00
import createSagaMiddleware from 'redux-saga';
import rootSaga from 'sagas';
import GAListener from 'components/GAListener';
import App from './app';
2018-01-29 20:47:12 +01:00
// get the state from a global variable injected into the server-generated HTML
const preloadedState = window.__PRELOADED_STATE__ || null;
// Allow the passed state to be garbage-collected
delete window.__PRELOADED_STATE__;
// create and apply middleware
2018-02-07 04:00:52 +01:00
const sagaMiddleware = createSagaMiddleware();
const middleware = applyMiddleware(sagaMiddleware);
const reduxMiddleware = window.__REDUX_DEVTOOLS_EXTENSION__ ? compose(middleware, window.__REDUX_DEVTOOLS_EXTENSION__()) : middleware;
2018-02-07 04:00:52 +01:00
// create teh store
2018-02-21 19:53:36 +01:00
let store;
if (preloadedState) {
2018-02-21 21:24:23 +01:00
console.log('initial load: preloaded state found');
2018-02-21 19:53:36 +01:00
store = createStore(Reducer, preloadedState, reduxMiddleware);
} else {
2018-02-21 21:24:23 +01:00
console.log('initial load: no preloaded state found');
2018-02-21 19:53:36 +01:00
store = createStore(Reducer, reduxMiddleware);
}
2018-01-29 20:47:12 +01:00
// run the saga middlweare
2018-02-07 04:00:52 +01:00
sagaMiddleware.run(rootSaga);
// render the app
2018-02-21 22:42:41 +01:00
hydrate(
<Provider store={store}>
<BrowserRouter>
<GAListener>
<App />
</GAListener>
</BrowserRouter>
</Provider>,
2018-01-29 20:47:12 +01:00
document.getElementById('react-app')
2018-01-29 21:49:01 +01:00
);