Redux and the State ADT

At a high level Redux is just a dispatching system, sitting atop a finite state machine, driving our application state. It just so happens that the State ADT is good at modeling a finite state machine. It allows us to represent our stateful transactions in discrete, easily composed transactions. We can create complicated stateful transitions by composing many simple transitions into one state transaction. By using the State ADT, we should be able to model all of our application state transitions and provide a single reducer function to Redux that integrates with our state machine model.
We’ll put this theory to the test by building a Memory type game called “Anger The Bunny”. We start of by defining our state transitions using the State ADT, starting with simple, discrete transactions and using them to create the complex transitions typical of any game. Then once we have a majority of our game logic implemented, we will integrate those with Redux.

• Introduction to using the State ADT with Redux
• Define Discrete State Transitions using the State ADT
• Combine State Dependent Transactions with the State ADT
• Transition a Stateful ADT with Outside Input
• Compose Simple State ADT Transitions into One Complex Transaction
• Read and Transform Values from a State ADT’s State
• Transition State based on Existing State using the State ADT
• Combine Multiple State ADT Instances with the Same Input
• Generate Randomness Using the State ADT
• Use a Pure RNG with the State ADT to Select an Element from State
• Multiply Two Arrays over a Function in JavaScript
• Draw Items from One JavaScript Array to Another using a Pair ADT
• Randomly Pull an Item from an Array with the State ADT
• Pull Many Random Numbers in a Single State ADT Transaction
• Adapt Redux Actions/Reducers for Use with the State ADT
• Create State ADT Based Reducers
• Combine Multiple State ADT Based Redux Reducers
• Initialize Redux Application State Using The State ADT
• Debug a Functional JavaScript composeK Flow
• Create a Redux Store for Use with a State ADT Based Reducer
• Connect State ADT Based Redux Actions to a React Application
• Create Redux Middleware to Dispatch Multiple Actions
• Create Redux Middleware to Dispatch Actions with the Async ADT
• Dispatch Multiple Asynchronous Redux Actions with Arguments
• Extend State ADT Based Transitions after React/Redux Integration
• Dispatch a Single State ADT Based Redux Action