React / Redux Boilerplate

Demo

Core libraries:

• React 🚀
• Redux ⚗
• React-Router 🛰
• React-Router-Redux 🚀 🛰 ⚗
• Redux DevTools 📊
• ImmutableJS 💎
• Webpack 🕸
• Babel6 🔑
• ESlint 🚨
• Styles 🖌
  • Radium
  • PostCSS
  • cssnext

middleware

• promiseMiddleware (example of custom middleware)
• redux-logger
• redux-thunk
• redux-saga

Installation

You'll need to have [Node.js] (https://nodejs.org/) to get started.

$ npm install # Install dependencies

• If your having issues try updating to the latest version of node.

Getting Started

Dev

$ npm run dev

ESLint

$ npm run lint

Tests

$ npm run test
$ npm run test:watch

Build

$ npm run clean
$ npm run build
$ http-server -p 8080 .

Open http://localhost:8080 in your browser.

Containers (smart) vs Components (dumb)

• Containers are smart because they provide functions and data to the components. We also connect to redux at this level, grabbing reducer actions and state to also pass down to our components.

• Components are dumb because they don't know anything about anything. They get data and functions passed in via props, and we try and avoid having any component state (including lifecycle events and refs). Your notice all the components in this boilerplate are using React's stateless component syntax.