Awesome

generator-redux-observable

An opinionated tool (Yeoman generator) for scaffolding an app using react, redux and webpack

Coming Soon: Angular2 support (see Zoo Animals )

Image available on DockerHub

note: the DockerHub image is meant to be used from an existing project. See Sample Docker Workflow

Installation

First, install Yeoman and generator-redux-observable using npm. If you don't already have node.js/npm installed, we recommend using nvm (windows users may want to consult the wiki).

npm install -g yo
npm install -g generator-redux-observable

Then generate your new project:

# create an application directory
$mkdir my-app

# change directory to your app
$ cd my-app

yo redux-observable [project-name]

You then have access to the following sub generators:

• yo redux-observable:action (Creates a action)
• yo redux-observable:epic (Creates a epic)
• yo redux-observable:component (Creates a component)

note: components are currently react only with ng2 on the roadmap

Resulting in a complete, yet simple, starter for React using redux and Webpack.

You may prefer to use npm to run your sub-generators. For a complete list of available commands and to add tab auto-completion, run the following commands in a terminal:

$ npm completion >> ~/.bashrc
$ source ~/.bashrc
$ npm run <tab><tab>

which will produce the following output

This workflow serves as a starting point for building component based applications using Webpack.

• Heavily commented webpack configuration with reasonable defaults.
• ES6, and ES7 support with babel.
• Source maps included in all builds.
• Development server with live reload.
• Production builds with cache busting.
• Testing environment using mocha as the framework.
• Code coverage as an option when tests are run.
• No gulp and no grunt, just npm scripts.

Warning: Make sure you're using the latest version of Node.js and NPM

Quick start

# change directory to your app
$ cd my-app

# start the server
$ npm start

go to http://localhost:2368 in your browser.

Table of Contents

• Getting Started
  • File Structure
  • Dependencies
  • Installing
  • Running the app
  • Developing
  • Testing
  • Roadmap
  • FAQ
• License

Getting Started

File Structure

Dependencies

What you need to run this app:

• node and npm (Use NVM)
• Ensure you're running Node (v4.1.x+) and NPM (2.14.x+) or greater

Installing

# create an application directory
$mkdir my-app

# change directory to your app
$ cd my-app

yo redux-observable [project-name]

That's it!

Running the app

After you have installed all dependencies you can now run the app with:

npm start

It will start a local server using webpack-dev-server which will watch, build (in-memory), and reload for you. The port will be displayed to you as http://localhost:2368.

Developing

Build files and prepare deployment package

• single run: npm run build

Testing

1. Unit Tests

• single run: npm test

Mocking with JSON Server

Roadmap

• Docker integration

Frequently asked questions

License