littlepsylo

Distilling the Essence of Reducers

Redux has brought the notion of reducer back into the awareness of many developers for whom they are a novel concept. In fact they are quite simple, and used all the time in such things as SUM aggregations in databases, where they compute a single value from many.

It's great that Redux has made reducers known to a broader audience, though they are relatively ancient concepts in programming, in fact. But the particular way Redux illustrates a reducer in its documentaion is, in my opinion, with a coding style that is harder to extend and read than it should be. Let's distill reducers down to their essensce, and build up Redux reducers in a way that lowers complexity, and helps separate Redux idioms from your business logic.

The simplest reducer

A reducer is a pure function that accepts more arguments than it returns. That is to say - one whose "arity" is greater than 1. It 'reduces' the two things you pass it down to a single value. Here are two reducers, in a map

How to Elm

This is a basic guide on how to learn Elm rather than actually teach you. I'm going to mostly link to resources that I feel are valuable and try to "teach you how to fish".

The main purpose is to accelerate your learning and save you a lot of googling and weeding through bad explinations.

Essential links

Main website http://elm-lang.org
Elm packages search and docs

	public class MainActivity extends ReactActivity {

	/**
	* Returns the name of the main component registered from JavaScript.
	* This is used to schedule rendering of the component.
	*/
	@Override
	protected String getMainComponentName() {
	return "MyApp";
	}

	function monitorEvents(element) {
	var log = function(e) { console.log(e);};
	var events = [];

	for(var i in element) {
	if(i.startsWith("on")) events.push(i.substr(2));
	}
	events.forEach(function(eventName) {
	element.addEventListener(eventName, log);
	});

	function waitForElement(selector) {
	return new Promise(function(resolve, reject) {
	var element = document.querySelector(selector);

	if(element) {
	resolve(element);
	return;
	}

	var observer = new MutationObserver(function(mutations) {