AutoLib-Project

Tools

~~Isomorphic~~ Universal rendering
Both client and server make calls to load data from separate API server
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.
Redux Router Keep your router state in your Redux store
ESLint to maintain a consistent code style
redux-form to manage form state in Redux
lru-memoize to speed up form validation
multireducer to combine single reducers into one key-based reducer
style-loader, sass-loader and less-loader to allow import of stylesheets in plain css, sass and less,
bootstrap-sass-loader and font-awesome-webpack to customize Bootstrap and FontAwesome
react-document-meta 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.
Intl for multi-languages support
passport for connection through JWT and local auth
validate.js for validate
sequelize for ORM
Own wrap es6 library for multi-event async support

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

In development, Redux Devtools are enabled by default. You can toggle visibility and move the dock around using the following keyboard shortcuts:

Ctrl+H Toggle DevTools Dock
Ctrl+Q Move Dock Position
see redux-devtools-dock-monitor for more detail information.

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

Running API Server