Skip to content

Instantly share code, notes, and snippets.

Chris Basham basham

Block or report user

Report or block basham

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile

Why I use web components

This is some sort of answer to recent posts regarding Web Components, where more than a few misconceptions were delivered as fact.

Let's start by defining what we are talking about.

The Web Components Umbrella

As you can read in the dedicated GitHub page, Web Components is a group of features, where each feature works already by itself, and it doesn't need other features of the group to be already usable, or useful.

WebReflection /
Last active Jan 30, 2020
Handy Custom Elements' Patterns

Handy Custom Elements' Patterns

Ricardo Gomez Angel Photo by Ricardo Gomez Angel on Unsplash

This gist is a collection of common patterns I've personally used here and there with Custom Elements.

These patterns are all basic suggestions that could be improved, enriched, readapted, accordingly with your needs.

dylanmckay / facebook-contact-info-summary.rb
Last active Jan 21, 2020
A Ruby script for collecting phone record statistics from a Facebook user data dump
View facebook-contact-info-summary.rb
#! /usr/bin/env ruby
# NOTE: Requires Ruby 2.1 or greater.
# This script can be used to parse and dump the information from
# the 'html/contact_info.htm' file in a Facebook user data ZIP download.
# It prints all cell phone call + SMS message + MMS records, plus a summary of each.
# It also dumps all of the records into CSV files inside a 'CSV' folder, that is created
nicolashery / rxjs-react.js
Last active Feb 1, 2020
Fetching data asynchronously with RxJS and React
View rxjs-react.js
import React from 'react';
import _ from 'lodash';
import Rx from 'rx';
import superagent from 'superagent';
let api = {
host: 'http//localhost:3001',
getData(query, cb) {
felixgirault / noUiSliderA11y.js
Last active May 18, 2018
Accessible noUiSlider
View noUiSliderA11y.js
* Adds an accessibility layer to the default noUiSlider.
* @see $.fn.noUiSlider()
$.fn.noUiSliderA11y = function(options, rebuild) {
var slider = this;
if (!('noUiSlider' in slider)) {
throw new Error('noUiSlider is not loaded.');
Willmo36 / Rx.Observable.fromSuperagent.es6
Last active Jul 21, 2016
RxJS stream from SuperAgent request
View Rx.Observable.fromSuperagent.es6
let Rx = require("rx");
Rx.Observable.fromSuperagent = request => () => Rx.Observable.create(observer => {
request.end((err, res) => {
if (err) {
} else {
gpbl /
Last active Nov 3, 2015
Using Reflux stores and actions for a Master/Detail app with React

Reflux stores and actions in a Master/Detail app

Example and reasonings when using Reflux stores and actions for a Master/Detail app with React – with an eye to server-side rendering. Some concepts apply to reflux#166 and reflux#180.


Must work with a router

This hypotetical app would use a router to display a list of items (e.g. at the url, the master view) and a single item (e.g., the detail view).

mathisonian /
Last active Feb 15, 2020
requiring npm modules in the browser console

demo gif

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details:


dandean /
Last active Aug 29, 2015
Link a module to itself to get around relative require hell.
staltz /
Last active Feb 17, 2020
The introduction to Reactive Programming you've been missing
You can’t perform that action at this time.