Katana middleware to leverage redux dev tools

dev-tool, katana, react, redux
pod try KatanaMonitor


Katana Monitor

Katana middleware that can be used to communicate with redux-dev tools. It has been tested with http://remotedev.io/local/, but it should work with other monitors too.

The project is currently a work in progress and it has mainly created as a proof of concept.


Install the remotedev node server once:

npm install -g remotedev-server

Run the server (every time you want to use the monitor)

Project Integration

The monitor is shipped using Cocoapods.

Add the pod KatanaMonitor

pod 'KatanaMonitor', :configurations => ['Debug']

The middleware should be used in debug configurations only.

In your application, conditionally add the middleware. Here, for instance, we use the DEBUG macro to conditionally add the middleware in debug configurations only:

var middleware: [StoreMiddleware] = [
	// other middleware

middleware.append(MonitorMiddleware.create(using: .defaultConfiguration))


  • Open http://remotedev.io/local/ in your browser. Click settings and make sure that Use custom local server is selected and the configuration is the proper ones (by default localhost and 8000). This is the UI where actions will appear
  • Launch remotedev in your terminal
  • Launch your katana application

Current limitations and TODO

  • The current implementation only support actions and state diff logging. Time traveling, dispatch from the UI and other features are not implemented
  • The project contains a modified version of the iOS socket cluster client. We should send a PR to the project or write a nice swift client
  • Actions and state are currently encoded using Mirror API in swift. We should improve the encoding as well as add a new, less hackish, way to encode them