One of the big ideas in the ClojureScript community right now is devcards. Devcards are a way to work on the components in your application without having to work in the application itself. Instead of finding your way through the application and manually exercising a component’s possibly many states, you have a page of devcards showing those states.
Devcards are especially useful for component states that aren’t easy to test, such as those seen only by particular kinds of users or at certain times of day. Bruce Hauman has called “increasing the bandwidth of feedback.”
Devcards are great, but you don’t have to use ClojureScript to develop components outside your application. Since the beginning of the year, a couple of teams at Atomic have been doing something similar in Ember and Angular. We call it a living style guide, but in practice it’s a simple form of devcards.
To create a living style guide in your own framework of choice, create a separate page in your application where the contents are just a list of components with different states. It won’t be as fancy as Bruce Hauman’s devcards (with their docstrings, history replay, and pretty-printed state), but it will show you the states your components can be in and give you a chance to interact with them.
Besides increasing the bandwidth of feedback, devcards and living style guides are a great way for new developers to ramp in to a project’s UI code. In fact, it was frustration with a large, complex codebase that originally led me to create a living style guide. It’s one-stop shopping for how to code and configure all the pieces and parts in the application’s interface: buttons, text fields, navigation, menus, headers, and everything else.