paypal / react-engine

a composite render engine for universal (isomorphic) express apps to render both plain react views and react-router views
Apache License 2.0
1.45k stars 130 forks source link

ES6 support for redux store init method #183

Closed perumalcsbe closed 7 years ago

perumalcsbe commented 7 years ago

This changes enable to write router.jsx and redux store in ES6.

an example of router.jsx

export default (
    <Route path="/">
        <Route name=".." path="example/" component={..}> 
   </Route>
);

an example of redux store method

import { createStore, applyMiddleware, compose } from 'redux';
import thunkMiddleware from 'redux-thunk';

import rootReducer from '../reducer';

let createStoreWithMiddleware;

function isDevToolsInstalled() {
    return Boolean(typeof window !== 'undefined' && window.devToolsExtension);
}

const applyMiddlewareResponse = applyMiddleware(
    thunkMiddleware
);

if (process.env.NODE_ENV !== 'production') {
    createStoreWithMiddleware = compose(
        applyMiddlewareResponse,
        isDevToolsInstalled() ? window.devToolsExtension() : f => f
    )(createStore);
} else {
    createStoreWithMiddleware = applyMiddlewareResponse(createStore);
}

export default function configureStore(initialState) {
    return createStoreWithMiddleware(rootReducer, initialState);
};

Kraken config for view engine

"view engines": {
    "jsx": {
      "module": "react-engine/lib/server",
      "renderer": {
        "method": "create",
        "arguments": [{
          "routesFilePath": "path:./.build/templates/routes.jsx",
          "routes": "path:./.build/templates/routes.jsx",
          "reduxStoreInitiator": "path:./.build/templates/store/configureStore.js"
        }]
      }
    }
  },

client side bootstrap configuration


function runApp() {

    var Client = require('react-engine/lib/client');
    // boot options
    var options = {
        routes: require('../templates/routes.jsx'),
        reduxStoreInitiator: require('../templates/store/configureStore'),
        viewResolver: function(viewName) {
            return require('../templates/' + viewName);
        }
    };

    document.addEventListener('DOMContentLoaded', function onLoad() {
        Client.boot(options);
    });
}

runApp();
samsel commented 7 years ago

👍