Giuseppe giuseppeg

The introduction to Reactive Programming you've been missing

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.

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

console.log wrap resolving for your wrapped console logs

I've heard this before:

What I really get frustrated by is that I cannot wrap console.* and preserve line numbers

We enabled this in Chrome DevTools via blackboxing a bit ago.

If you blackbox the script file the contains the console log wrapper, the script location shown in the console will be corrected to the original source file and line number. Click, and the full source is looking longingly into your eyes.

Babel Types

Hopefully will be documentation of unclear methods available for Babel Types

is
isType
shallowEqual
appendToMemberExpression
prependToMemberExpression
ensureBlock

Option 1: Command-line download extension as zip and extract

extension_id=jifpbeccnghkjeaalbbjmodiffmgedin   # change this ID
curl -L -o "$extension_id.zip" "https://clients2.google.com/service/update2/crx?response=redirect&os=mac&arch=x86-64&nacl_arch=x86-64&prod=chromecrx&prodchannel=stable&prodversion=44.0.2403.130&x=id%3D$extension_id%26uc" 
unzip -d "$extension_id-source" "$extension_id.zip"

Thx to crxviewer for the magic download URL.

	// Flight Proposal: Groups

	// Its useful to be able to structure components together
	// so that we can manage their lifecycles. We currently
	// group components together using simple initialization
	// functions which give us a rough structure but don't
	// allow us to manage lifecycles easily which has given
	// rise to nested components. However, it's not desirable
	// to couple one component to another in this way and
	// departs from the self contained nature of Flight

	if (!this.matchMedia) {
	(function (WINDOW, LISTENER) {
	function evalQuery(window, query) {
	var
	screen = window.screen,
	screenHeight = screen.height,
	screenWidth = screen.width,
	documentElement = window.document.documentElement,
	height = window.innerHeight \|\| documentElement.clientHeight,
	width = window.innerWidth \|\| documentElement.clientWidth,

	# Hello, and welcome to makefile basics.
	#
	# You will learn why `make` is so great, and why, despite its "weird" syntax,
	# it is actually a highly expressive, efficient, and powerful way to build
	# programs.
	#
	# Once you're done here, go to
	# http://www.gnu.org/software/make/manual/make.html
	# to learn SOOOO much more.

	//
	// Tests if regular expression matches all valid ES6 import syntaxes.
	//
	// ES6 Language Specification Reference:
	// https://people.mozilla.org/~jorendorff/es6-draft.html#sec-imports
	//

	const ES6_IMPORT_REGEX = /\bimport\s+(?:.+\s+from\s+)?[\'"]([^"\']+)["\']/g;

	const VALID_ES6_IMPORT_SYNTAXES = [

	var RecursiveChildComponent = React.createClass({
	render() {
	return <div>
	{this.recursiveCloneChildren(this.props.children)}
	</div>
	},
	recursiveCloneChildren(children) {
	return React.Children.map(children, child => {
	if(!_.isObject(child)) return child;
	var childProps = {someNew: "propToAdd"};