Mike McBride mikemcbride

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

Launch quicktime player
do Screen recording

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

Tested against the WebKit git repo by entering the repo with 1 file dirty.

git diff --quiet --ignore-submodules HEAD # Will tell if there are any uncomitted changes, staged or not.
0.6 sec

git diff-index --quiet HEAD # Only tracked
2 sec

	/* Implementation of lodash.get function */
	function getProp( object, keys, defaultVal ){
	keys = Array.isArray( keys )? keys : keys.split('.');
	object = object[keys[0]];
	if( object && keys.length>1 ){
	return getProp( object, keys.slice(1) );
	}
	return object === undefined? defaultVal : object;
	}

	#!/bin/bash
	cd "$(git rev-parse --show-toplevel)"
	ESLINT="node_modules/.bin/eslint"
	pwd

	if [[ ! -x "$ESLINT" ]]; then
	printf "\t\033[41mPlease install ESlint\033[0m (npm install eslint)\n"
	exit 1
	fi

	# Your init script
	#
	# Atom will evaluate this file each time a new window is opened. It is run
	# after packages are loaded/activated and after the previous editor state
	# has been restored.
	#
	# An example hack to log to the console when each text editor is saved.
	#
	# atom.workspace.observeTextEditors (editor) ->
	# editor.onDidSave ->

	/* bling.js */

	window.$ = document.querySelectorAll.bind(document);

	Node.prototype.on = window.on = function (name, fn) {
	this.addEventListener(name, fn);
	};

	NodeList.prototype.__proto__ = Array.prototype;

	{
	"name": "my-app",
	"version": "1.0.0",
	"description": "My test app",
	"main": "src/js/index.js",
	"scripts": {
	"jshint:dist": "jshint src/js/*.js",
	"jshint": "npm run jshint:dist",
	"jscs": "jscs src/*.js",
	"browserify": "browserify -s Validating -o ./dist/js/build.js ./lib/index.js",

	cd ~/Library/Application\ Support/Google/Chrome/Default/User\ StyleSheets
	echo 'html { -webkit-animation: adjustHue 20s infinite !important; } @-webkit-keyframes adjustHue { 50% { -webkit-filter: hue-rotate(360deg); }}' >> Custom.css

	.flex() {
	display: -webkit-box;
	display: -moz-box;
	display:-webkit-flex;
	display: -ms-flexbox;
	display:flex;
	}

	.flex-justify(@justifyStyle) {