Isomorphic apps, built using Express, ReactJS and Redux. This allows to server side rendering and server requests.
Bundling is great, but as your app grows, your bundle will grow too. Especially if you are including large third-party libraries. You need to keep an eye on the code you are including in your bundle so that you don’t accidentally make it so large that your app takes a long time to load.
To avoid winding up with a large bundle, it’s good to get ahead of the problem and start “splitting” your bundle. Code-Splitting is a feature supported by bundlers like Webpack and Browserify (via factor-bundle) which can create multiple bundles that can be dynamically loaded at runtime.
- Spliting code with loadable-components smooth-code, recomended by react
Isomporphic applications can run both on clients such as web browsers and on servers. Written on top of Node.js, that focuses on real-time web applications. More https://www.sitepoint.com/isomorphic-javascript-applications/
When the user opens a web page, [ReactRouter](https://github.com/ReactTraining/react-router) starts to match `req.url` to available routes. [ReactJS](reactjs.org) will render and request data on server along with rendering of [ExpressJS](reactjs.org).
After first load, user most likely will move to other page with link that exist. In this event [ReactRouter](https://github.com/ReactTraining/react-router) will handle it, and [ReactJS](reactjs.org) will request data via ajax using [Superagent](https://visionmedia.github.io/superagent/)
- NodeJS
- NPM (should be bundled with NodeJS)
- Yarn (recommended to replace NPM,optional), all yarn commands below can be changed using npm
Clone this repository to your local machine.
git clone ssh://git@internalgit.ojodowo.com:19090/sebangsaweb/web-boilerplate.git
Install dependencies using yarn
yarn install
Run the server
yarn start
Run client build
yarn webpack
Visit http://localhost:3001, or whichever port specified in your configuration file (.env).