YoruNoHikage / Redux Devtools Dispatch
Licence: mit
Dispatch your actions manually to test if your app reacts well.
Stars: ✭ 143
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Redux Devtools Dispatch
Check It Out
A command line interface for Git Checkout. See branches available for checkout.
Stars: ✭ 127 (-11.19%)
Mutual labels: devtools
Reactide
Reactide is the first dedicated IDE for React web application development.
Stars: ✭ 10,318 (+7115.38%)
Mutual labels: devtools
Estimo
Evaluates how long the browser will execute your javascript code.
Stars: ✭ 138 (-3.5%)
Mutual labels: devtools
Ndb
ndb is an improved debugging experience for Node.js, enabled by Chrome DevTools
Stars: ✭ 10,581 (+7299.3%)
Mutual labels: devtools
Laravel Tinker Tools
Use short class names in an Artisan tinker session
Stars: ✭ 134 (-6.29%)
Mutual labels: devtools
Marionette
Selenium alternative for Crystal. Browser manipulation without the Java overhead.
Stars: ✭ 119 (-16.78%)
Mutual labels: devtools
Service Worker Detector
This extension detects if a website registers a Service Worker.
Stars: ✭ 124 (-13.29%)
Mutual labels: devtools
Minimongoexplorer
Handy Google Chrome extension for reviewing MiniMongo.
Stars: ✭ 131 (-8.39%)
Mutual labels: devtools
Lastbackend
System for containerized apps management. From build to scaling.
Stars: ✭ 1,536 (+974.13%)
Mutual labels: devtools
Devtron
[LOOKING FOR MAINTAINERS] An Electron DevTools Extension
Stars: ✭ 1,726 (+1106.99%)
Mutual labels: devtools
Hashi Up
bootstrap HashiCorp Consul, Nomad, or Vault over SSH < 1 minute
Stars: ✭ 113 (-20.98%)
Mutual labels: devtools
Gores
👷 Redis-backed library for creating background jobs in Go. Placing jobs in multiple queues, and process them later asynchronously.
Stars: ✭ 137 (-4.2%)
Mutual labels: dispatch
Restore
A predictable & observable state container for React apps
Stars: ✭ 133 (-6.99%)
Mutual labels: devtools
Redux DevTools Dispatch
Dispatch your actions manually to test if your app reacts well.
Installation
npm install --save-dev redux-devtools-dispatch
Usage
You can declare your Dispatcher the same way you declare a Monitor in your Dev Tools.
import React from 'react';
import { createDevTools } from 'redux-devtools';
import Dispatcher from 'redux-devtools-dispatch';
export default createDevTools(
<Dispatcher />
);
You can inject action creators to ease the process of testing your app firing yourself actions.
import React from 'react';
import { createDevTools } from 'redux-devtools';
import Dispatcher from 'redux-devtools-dispatch';
const actionCreators = {
increment() {
return {type: 'INCREMENT_COUNTER'};
},
decrement() {
return {type: 'DECREMENT_COUNTER'};
},
nested: {
worksToo() {
return {type: 'NESTED_WORKS_TOO', cool: true};
},
},
};
export default createDevTools(
<Dispatcher actionCreators={actionCreators} />
);
You can also use <MultipleMonitors>
from redux-devtools-multiple-monitors
to use multiple monitors into the <DockMonitor>
:
import React from 'react';
import { createDevTools } from 'redux-devtools';
import LogMonitor from 'redux-devtools-log-monitor';
import DockMonitor from 'redux-devtools-dock-monitor';
import Dispatcher from 'redux-devtools-dispatch';
import MultipleMonitors from 'redux-devtools-multiple-monitors';
export default createDevTools(
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q" defaultIsVisible={false}>
<MultipleMonitors>
<LogMonitor />
<Dispatcher />
</MultipleMonitors>
</DockMonitor>
);
Then, just write an JSON action in the field, click on Dispatch, and that's all!
Props
Name | Description |
---|---|
theme |
Same as in LogMonitor's package Either a string referring to one of the themes provided by redux-devtools-themes (feel free to contribute!) or a custom object of the same format. Optional. By default, set to 'nicinabox' . |
initEmpty |
When true , the dispatcher is empty. By default, set to false , the dispatcher contains : { "type": "" } . |
actionCreators |
Either a array of action creators or an object containing action creators. When defined, a selector appears to choose the action creator you want to fire, you can fill up the arguments and dispatch the action. |
dispatchFn |
Function to be called for dispatching actions. By default it is using component's this.context.store.dispatch . |
Contributing
As this package is my first, any comment, pull request, issue is welcome so I can learn more from everyone.
License
MIT
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].