Wrote an intro tutorial for beginners.

README.md

@@ -8,116 +8,32 @@ For Angular 1 see [ng-redux](https://github.com/wbuchwalter/ng-redux)
 [![CircleCI](https://img.shields.io/circleci/project/github/angular-redux/store.svg)](https://github.com/angular-redux/store)
 [![npm version](https://img.shields.io/npm/v/@angular-redux/store.svg)](https://www.npmjs.com/package/@angular-redux/store)
 
-`@angular-redux/store` lets you easily connect your Angular components with Redux, while still respecting the Angular idiom.
-
-Features include:
-* The ability to access slices of store state as `Observables`
-* Compatibility with existing Redux middleware and enhancers
-* Compatibility with the existing Redux devtools Chrome extension
-* A rich, declarative selection syntax using the `@select` decorator
-
-In addition, we are committed to providing insight on clean strategies for integrating with Angular's change detection and other framework features.
-
-## Table of Contents
-
-- [Installation](#installation)
-- [Quick Start](#quick-start)
-- [Examples](#examples)
-- [Resources](#resources)
-- [In Depth Usage](#in-depth-usage)
-- [API](docs/api.md)
-
-## Installation
-
-`@angular-redux/store` has a peer dependency on redux, so we need to install it as well.
-
-```sh
-npm install --save redux @angular-redux/store
-```
-
-## Quick Start
-
-```typescript
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { AppModule } from './containers/app.module';
-
-platformBrowserDynamic().bootstrapModule(AppModule);
-```
-Import the `NgReduxModule` class and add it to your application module as an
-`import`. Once you've done this, you'll be able to inject `NgRedux` into your
-Angular components. In your top-level app module, you
-can configure your Redux store with reducers, initial state,
-and optionally middlewares and enhancers as you would in Redux directly.
-
-```typescript
-import { NgReduxModule, NgRedux } from '@angular-redux/store';
-import reduxLogger from 'redux-logger';
-import { rootReducer } from './reducers';
-
-interface IAppState { /* ... */ };
-
-@NgModule({
-  /* ... */
-  imports: [ /* ... */, NgReduxModule ]
-})
-export class AppModule {
-  constructor(ngRedux: NgRedux<IAppState>) {
-    ngRedux.configureStore(rootReducer, {}, [ createLogger() ]);
-  }
-}
-```
-
-Or if you prefer to create the Redux store yourself you can do that and use the
-`provideStore()` function instead:
-
-```typescript
-import {
-  applyMiddleware,
-  Store,
-  combineReducers,
-  compose,
-  createStore
-} from 'redux';
-import { NgReduxModule, NgRedux } from '@angular-redux/store';
-import reduxLogger from 'redux-logger';
-import { rootReducer } from './reducers';
-
-interface IAppState { /* ... */ };
-
-export const store: Store<IAppState> = createStore(
-  rootReducer,
-  compose(applyMiddleware(reduxLogger)));
-
-@NgModule({
-  /* ... */
-  imports: [ /* ... */, NgReduxModule ]
-})
-class AppModule {
-  constructor(ngRedux: NgRedux<IAppState>) {
-    ngRedux.provideStore(store);
-  }
-}
-```
-
-Now your Angular app has been reduxified! Use the `@select` decorator to
-access your store state, and `.dispatch()` to dispatch actions:
-
-```typescript
-import { select } from '@angular-redux/store';
-
-@Component({
-  template: '<button (click)="onClick()">Clicked {{ count | async }} times</button>'
-})
-class App {
-  @select() count$: Observable<number>;
-
-  constructor(private ngRedux: NgRedux<IAppState>) {}
-
-  onClick() {
-    this.ngRedux.dispatch({ type: INCREMENT });
-  }
-}
-```
+## What is Redux?
+
+Redux is a popular approach to managing state in applications. It emphasises:
+
+* A single, immutable data store.
+* One-way data flow.
+* An approach to change based on pure functions and a stream of actions.
+
+You can find lots of excellent documentation here: [Redux](http://redux.js.org/).
+
+## What is @angular-redux?
+
+We provide a set of npm packages that help you integrate your redux store
+into your Angular 2+ applications. Our approach helps you by bridging the gap
+with some of Angular's advanced features, including:
+
+* Change processing with RxJS observables.
+* Compile time optimizations with `NgModule` and Ahead-of-Time compilation.
+* Integration with the Angular change detector.
+
+## Getting Started
+
+* I already know what Redux and RxJS are. [Give me the TL;DR](docs/quickstart.md).
+* I'm just learning about Redux. [Break it down for me](docs/intro-tutorial.md)!
+* Talk is cheap. [Show me a complete code example](https://github.com/angular-redux/example-app).
+* Take me to the [API docs](docs/api.md).
 
 ## Examples