TBMAGA

About

Uses the following technologies:

• Universal rendering
• React
• React Router
• Express
• Babel for ES6 and ES7 magic
• Webpack for bundling
• Webpack Dev Middleware
• Webpack Hot Middleware
• Redux's futuristic Flux implementation
• Redux Dev Tools for next generation DX (developer experience). Watch Dan Abramov's talk.
• React Router Redux Redux/React Router bindings.
• ESLint to maintain a consistent code style
• style-loader, sass-loader and less-loader to allow import of stylesheets in plain css, sass and less,
• react-helmet to manage title and meta tag information on both server and client
• webpack-isomorphic-tools to allow require() work for statics both on client and server
• mocha to allow writing unit tests for the project.

Installation

npm install

Running Dev Server

npm run dev

The first time it may take a little while to generate the first webpack-assets.json and complain with a few dozen [webpack-isomorphic-tools] (waiting for the first Webpack build to finish) printouts, but be patient. Give it 30 seconds.

Using Redux DevTools

Redux Devtools are enabled by default in development.

• CTRL+H Toggle DevTools Dock
• CTRL+Q Move DevTools Dock Position
• see redux-devtools-dock-monitor for more detailed information.

If you have the Redux DevTools chrome extension installed it will automatically be used on the client-side instead.

If you want to disable the dev tools during development, set __DEVTOOLS__ to false in /webpack/dev.config.js.
DevTools are not enabled during production.

Building and Running Production Server

npm run build
npm run start