React Habitat Redux
Looking for the older v1.0 docs?
This library brings Redux capabilities to React-Habitat
Installing
This library requires react-habitat. v0.5.0 or greater
Install with Node Package Manager (NPM)
npm install react-habitat-redux --save
This assumes that you’re using a package manager with a module bundler like Webpack or Rollup.
If you don’t yet use npm or a modern module bundler, and would rather prefer a single-file UMD build that makes ReactHabitatRedux
available as a global object, you can grab a pre-built version from the dist folder.
Usage
You should first familirise yourself with React Habitat and its docs
When configuring the React Habitat ContainerBuilder
, you'll want to set the factory
for a ReduxDomFactory instead of the default one and pass in your store like so:
const store = configureStore();
const containerBuilder = new ReactHabitat.ContainerBuilder();
containerBuilder.factory = new ReduxDomFactory(store);
It's important that you pass in the store object if you want redux 'connect' to work automatically.
Here is a full Bootstrapper class example:
import ReactHabitat from 'react-habitat';
import { ReduxDomFactory } from 'react-habitat-redux';
import { createStore } from 'redux';
import configureStore from './store/configureStore'
import SomeReactComponent from './SomeReactComponent';
import AnotherReactComponent from './AnotherReactComponent';
class MyApp extends ReactHabitat.Bootstrapper {
constructor(){
super();
const store = configureStore();
const containerBuilder = new ReactHabitat.ContainerBuilder();
containerBuilder.factory = new ReduxDomFactory(store);
containerBuilder.register(SomeReactComponent).as('SomeReactComponent');
containerBuilder.register(AnotherReactComponent).as('AnotherReactComponent');
this.setContainer(containerBuilder.build());
}
}
export default new MyApp();
Who is Deloitte Digital?
Part Business. Part Creative. Part Technology. One hundred per cent digital.
Pioneered in Australia, Deloitte Digital is committed to helping clients unlock the business value of emerging technologies. We provide clients with a full suite of digital services, covering digital strategy, user experience, content, creative, engineering and implementation across mobile, web and social media channels.
http://www.deloittedigital.com/au
LICENSE (BSD-3-Clause)
Copyright (C) 2015, Deloitte Digital. All rights reserved.
React Habitat Redux can be downloaded from: https://github.com/DeloitteDigitalAPAC/react-habitat-redux
Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:
-
Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.
-
Redistributions in binary form must reproduce the above copyright notice,
this list of conditions and the following disclaimer in the documentation
and/or other materials provided with the distribution.
-
Neither the name of the copyright holder nor the names of its contributors
may be used to endorse or promote products derived from this software without
specific prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.