Adam Argyle argyleink

Install

Either copy the aliases from the .gitconfig or run the commands in add-pr-alias.sh

Usage

Easily checkout local copies of pull requests from remotes:

git pr 4 - creates local branch pr/4 from the github upstream(if it exists) or origin remote and checks it out
git pr 4 someremote - creates local branch pr/4 from someremote remote and checks it out

Frontend Development

Attention: the list was moved to

https://github.com/dypsilon/frontend-dev-bookmarks

This page is not maintained anymore, please update your bookmarks.

This is a small collection of scripts showing how to use require.js. It's only one of several ways of setting up a require.js project, but it's enough to get started.

At its core, require.js is about three things:

Dependency management
Modularity
Dynamic script loading

The following files show how these are achieved.

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.

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

The State of Container Queries

tl;dr Developers would like the idea to style components based on a parent's width rather than depend solely on the viewport media query. This would allow modular components to style themselves while being agnostic to the viewport.

There is currently a lot of developer interest in getting a feature like Container Queries (née "Element Queryies") shipped in a browser.

2-min Catchup

Here are official'ish documents to outline the developer community's desires.

RxJS 5 Operators By Example

⚠️ UPDATE: I have moved the contents of this gist plus more to http://www.learnrxjs.io and https://github.com/btroncone/learn-rxjs. For expanded examples, explanations, and resources, please check out this new location!

A complete list of RxJS 5 operators with easy to understand explanations and runnable examples.

	/** User-agent pattern matching */
	var browser = 'unknown'
	, version = 'unknown'
	, patterns = {
	android: /android\s([0-9.]*)/i
	chrome: /chrome\/([0-9.]*)/i,
	firefox: /firefox\/([0-9.]*)/i,
	ie: /msie\s([0-9.]*)/i,
	ipad: /ipad.version\/([0-9.]*).safari/i,
	iphone_4: /iphone\sos\s4.version.mobile\/([0-9.]*).safari/i,

	# OSX for Hackers (Mavericks/Yosemite)
	#
	# Source: https://gist.github.com/brandonb927/3195465

	#!/bin/sh

	# Some things taken from here
	# https://github.com/mathiasbynens/dotfiles/blob/master/.osx

	# Ask for the administrator password upfront

	/* bling.js */
	window.$ = document.querySelector.bind(document);
	window.$$ = document.querySelectorAll.bind(document);
	Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); };
	NodeList.prototype.__proto__ = Array.prototype;
	NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); };