ng-reduxify v0.1.0

ng-reduxify is an uncomplicated Angular 7+ library that solely depends on RxJS which is already included in your application. It is designed for small to medium applications with a need for a single state container. It provides an injectable global state container, support for actions and reducers, utilities to react on all or a subset of state changes both in code and templates.

ng-reduxify in Action

Getting started

ng-reduxify is available on NPM. Run the install command:

$ npm install --save ng-reduxify

Import the module ReduxModule in your application's root module (typically app.module.ts):

...
import { ReduxModule } from 'ng-reduxify';

@NgModule({
  ...
  imports: [ ReduxModule.forRoot() ],
  ...
})
export class AppModule { ... }

Inject the AppState into any component, service or pipe that needs to interact with the state container. For example:

...
import { AppState } from 'ng-reduxify';

@Component({ ... })
export class ExampleComponent {

  constructor(private appState: AppState) { }

  addTodo(text) {
    this.appState.digest<AddTodoAction>({
      type: ADD_TODO,
      text
    });
  }

}

Documentation

Go to https://mmglr.github.io/ng-reduxify to read the API docs with usage examples.

Demo Application

Go to https://mmglr.github.io/ng-reduxify/demo to see ng-reduxify in action.

Development

The library code base is in projects/ng-reduxify. The demo application which makes use of all features is in projects/demoapp.

To build the library run npm run build-lib. To build the demo application run npm run build-demo. To serve the demo application run npm run serve-demo. The demo application will be automatically rebuilt when the demo or library code changes.

Running unit tests

Run npm run test-lib to execute the unit tests via Karma and generate the code coverage report. Append the --watch flag to automatically rerun unit tests when library spec files change. The results of the spec tests and code coverage are written to testing/. All tests are located in projects/ng-reduxify/src/test. Typically there is a *.spec.ts file for each *.ts file in projects/ng-reduxify/src/lib where the names are the same.

Running end-to-end tests

Run npm run e2e to execute the end-to-end tests via Protractor on the demo application (located in projects/demoapp and projects/demoapp-e2e). The demo application makes use of all features of ng-reduxify. These tests primarily ensure the correct behavior of all the components in ng-reduxify when running in a real application. For example, the StateView and [when] directives are checked.

Contributing

For a pull request to be accepted it must:

1. Clearly define the problem and solution.
2. All linter errors fixed.
3. Pass all unit tests with >80% code coverage.
4. All end-to-end tests must pass on the demo app.