Redux without the sanity checks in a single file. Don't use this, use normal Redux. :-)

100%

Redux without the sanity checks in a single file. Don't use this, use normal Redux. :-)

✓ Published0🌍 Public

Last edited Sep 22, 2015

Created on Mar 9, 2019

This example demonstrates a minimal, single-file implementation of Redux’s core API, including `createStore`, `combineReducers`, `bindActionCreators`, and `applyMiddleware`. It shows how these functions work together to manage state and dispatch actions, with `subscribe` for listener registration and `replaceReducer` for hot-swapping. The code defines the store’s logic directly, using plain JavaScript functions like `mapValues` and `compose` to replicate the original library’s behavior without its validation checks. The listing is a gist by Stroked, intended as a concise educational reference for Redux’s internals.

AI-generated description

Similar vizzes

Loading thumbnail…

Redux without the sanity checks in a single file. Don't use this, use normal Redux. :-)

This example presents a single-file implementation of Redux, stripped of its typical validation and sanity checks. It defines core Redux APIs, including `createStore`, `combineReducers`, `bindActionCreators`, `compose`, and `applyMiddleware`, using helper functions like `mapValues` and `pick`. The code demonstrates a minimal store with `dispatch`, `subscribe`, `getState`, and `replaceReducer` methods, initializing state with an `@@redux/INIT` action. It shows a functional, albeit simplified, version of Redux’s state management pattern, intended for educational purposes rather than production use.

RRestuta

95% match

Loading thumbnail…

Redux + localStorage

This example shows how to persist a Redux store in the browser’s localStorage by syncing state changes through a custom module. The code defines a reducer that handles `SET` and `REMOVE` actions, calling `serialize` to write the updated Immutable.js collection to localStorage after each mutation. On initialization, `deserialize` reads the stored JSON and hydrates the state via `Immutable.Map`. Access to stored values uses memoized `reselect` selectors, while action creators `set` and `remove` trigger updates. The implementation relies on Redux’s reducer/action pattern and the browser’s `localStorage` API.

RRestuta

71% match

Loading thumbnail…

redux-scc-v1-blog-example-store

This example demonstrates a Redux store chunk that manages both string and numeric-array state through generated reducers and selectors. It uses the `buildStoreChunk` helper to define a `stringReducer` and `arrayReducer` via `Types.reducer`, with `Types.string()` and `Types.arrayOf(Types.number())` schemas. The store is assembled with `createStore` and `combineReducers` from Redux, while `actions`, `reducers`, and `selectors` are destructured from the chunk configuration. The code shows a programmatic approach to structuring Redux state management without explicit action creators or reducer bodies.

TTheComfyChair

70% match

Loading thumbnail…

redux-scc-v1-blog-double-dispatch

This example demonstrates the Redux state-management pattern for managing and visualizing multiple data updates in a JavaScript application. The code shows two consecutive `store.dispatch()` calls that trigger separate state changes: one replacing a string value and another pushing a number into an array. It highlights how Redux handles action dispatching and state transitions, using the Redux store API alongside action creators defined in the `actions` object. The visualization would typically reflect the updated state after each dispatch, showing the sequential effect of double actions on the rendered data.

TTheComfyChair

70% match

Loading thumbnail…

exploring redux form

This example demonstrates a basic React form built with `redux-form`, showing how form state is managed through Redux. The code defines a `SimpleForm` component that uses the `Field` component to bind text inputs for name and email, while the `reduxForm` HOC wraps the component with form configuration. A container component handles the submitted JSON data via a callback. The example highlights the `formReducer` integration in the root reducer, illustrating the library’s core pattern of connecting form fields to Redux state and submitting values as structured JSON.

CCKschneid

67% match

Loading thumbnail…

Redux + D3 in the browser

A Redux store manages a counter and iteration count, displayed as a text label in an SVG. The D3 v4 code renders the SVG and two buttons, while Redux dispatches `INCREMENT`, `DECREMENT`, `ZERO`, and `RESET` actions. A `d3.interval` timer randomly dispatches increment or decrement actions every 100 milliseconds. The store’s `subscribe` method updates the text element in response to state changes, demonstrating a pure Redux pattern for UI synchronization without a view-binding library.

PPhilippe Rivière

66% match

Loading thumbnail…

multiple array reducer update (Redux SCC blog v1)

This example demonstrates a single action that sequentially applies three array reducer updates to mutate a shared state. It shows how a combined action named “Multi action update!” chains an array replacement, an index-based removal, and a second index-based replacement to transform an initial array `[5,4,3]` into `[5, 42]`. The code uses a custom `createCombinedAction` helper and the `actions.arrayReducer` API to compose atomic reducers, highlighting a pattern for batching multiple state mutations in a Redux-style store. The source is a JavaScript gist by TheComfyChair.

TTheComfyChair

66% match

Loading thumbnail…

redux-scc-v1-blog-combined-action

This example demonstrates a Redux add-on that batches multiple state updates into a single combined action, visible in the action history as one entry. The code defines a combined action via `createCombinedAction`, which wraps two separate reducer dispatches—`actions.stringReducer.replace` and `actions.arrayReducer.push`—inside a single dispatch call. The visualization highlights how Redux DevTools would log only the combined action, not the individual sub-updates, simplifying debugging of complex state changes. It uses the Redux library and the custom `createCombinedAction` API to bundle the operations.

TTheComfyChair

65% match