State of React #2 – From Inception to Redux

Welcome back to the second instalment of State of React! In case you missed it, the first instalment demonstrated a small app without component state. And it received a bunch of interesting responses, like this one from @metapgmr:

using props as state and claiming that components are … stateless! The React Emperor has no clothes

Yes, the app was basically wearing its birthday suit. And yes, the app did contain state. But no, the state wasn’t in the props – and it wasn’t component state either.

So what was it?

Continue reading

Simple Routing with Redux and React

TL;DR? Clone the Starter Kit instead.

Have you ever wished that libraries for React apps could be simpler?

Sure, you know that there are cases when all the bells and whistles are an advantage — but for you, features aren’t as important as clarity. Instead of giving up control to fast-moving libraries written by big names, you want to understand what is going on under the hood. And instead of sifting through documentation on twenty different tools before getting started, you want to get stuck into it right now.

And you’re not alone! In fact, most of my work has involved small projects which don’t make use of many of the features provided by popular routing libraries. So instead, I’ve rolled my own routing using Redux and React. And it is so simple that everything you need to know fits into this short guide.

Continue reading

Join The Dark Side Of The Flux: Responding to Actions with Actors

Have you ever wanted to respond to a change in your Redux store’s state by dispatching another action?

Now you know that this is frowned on. You know that if you have enough information to dispatch an action after the reducer does its thing, then it is a mathematical certainty that you can do what you want without dispatching another action.

But for some reason, you just don’t care. Maybe your store is structured in such a way that it is easier to send requests after an action is processed. Maybe you don’t want your actions or components to be in charge of fetching remote data for each new route. Or maybe you’re just a dark side kind of person. Whatever the reason, actors will allow you to dispatch with impunity.

Continue reading

Can I dispatch multiple actions from Redux action creators?

When using Redux, you may have come across a scenario where you’d like one action creator to dispatch multiple actions.

There are a few reasons you’d want to do this, but let’s consider the problem of handling a submit event from a form. In response, you’ll want to do multiple things. For example: RESET your form’s view model, POST your form’s data to the server, and also NAVIGATE to another route.

So should you dispatch separate actions for each of these behaviours, or instead dispatch a single action which is handled by each of the applicable reducers?

Continue reading