Skip to content
Redux middleware for React Native for Flipper
TypeScript JavaScript
Branch: master
Clone or download

Latest commit

jk-gan Merge pull request #18 from ferrannp/patch-1
docs: more extensible way to add the middleware
Latest commit 0e61974 May 20, 2020

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src feat: enhance connection May 16, 2020
.eslintrc.js init: initialize repo Apr 16, 2020
.gitignore init: initialize repo Apr 16, 2020
.prettierrc init: initialize repo Apr 16, 2020
README.md docs: more extensible way to add the middleware May 20, 2020
package.json release: bump version -> 1.1.0 May 16, 2020
tsconfig.json init: initialize repo Apr 16, 2020
yarn.lock feat: pass time into flipper plugin Apr 18, 2020

README.md

Redux Flipper

screenshot of the plugin

Redux middleware for Flipper. It can log redux actions and show inside Flipper using flipper-plugin-redux-debugger.

Support

  • React Native
    • For react-native >= 0.62, flippler support is enabled by default
    • For react-native < 0.62, follow these steps to setup your app
  • Redux or Redux-Toolkit

Get Started

  1. Install redux-flipper middleware and react-native-flipper in your React Native app:
yarn add redux-flipper react-native-flipper
# for iOS
cd ios && pod install
  1. Add the middleware into your redux store:
import { createStore, applyMiddleware } from 'redux';

const middlewares = [/* other middlewares */];

if (__DEV__) {
  const createDebugger = require('redux-flipper').default;
  middlewares.push(createDebugger());
}

const store = createStore(RootReducer, applyMiddleware(...middlewares));
  1. Install flipper-plugin-redux-debugger in Flipper desktop client:
Manage Plugins > Install Plugins > search "redux-debugger" > Install
  1. Start your app, then you should be able to see Redux Debugger on your Flipper app
You can’t perform that action at this time.