One of my favorite things about working in client-services is the interval with which we start new work. As a React shop, this means we build a lot of new apps from the ground up.

Along the way, we've distilled what we've learned and baked it into a tool that I, finally, want to talk about.

Microcosm is our general purpose tool for keeping React apps organized. We use it to work with application state, split large projects into manageable chunks, and as the guiding star for our application architecture.

In this post, I'll provide a high level overview of Microcosm and some of the features I find particularly valuable. Don't forget to check out the project on Github!

At a glance

Microcosm was born out of the Flux mindset. From there it draws similar pieces:

Actions

Actions are a general abstraction for performing a job. In Microcosm, actions move through a standard lifecycle: ( open , update , resolve , reject , cancel ).

Actions can process a variety of data types out of the box. For example, a basic networking request might look like: