staltz

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.

---

bendc

function fastSelect(selector) {
  if (selector == "body") {
    return document.body
  }
  else if (selector == "head") {
    return document.head
  }
  else if (/^[\#.]?[\w-]+$/.test(selector)) {
    switch (selector[0]) {
      case "#":

bendc

const createNode = html =>
  new Range().createContextualFragment(html).firstElementChild;

ericelliott

Essential JavaScript Links

I no longer mantain this list. There are lots of other very comprehensive JavaScript link lists out there. Please see those, instead (Google "awesome JavaScript" for a start).

bendc

// array utils
// =================================================================================================

const combine = (...arrays) => [].concat(...arrays);

const compact = arr => arr.filter(Boolean);

const contains = (() => Array.prototype.includes
  ? (arr, value) => arr.includes(value)
  : (arr, value) => arr.some(el => el === value)

ericelliott

let animal = {
  animalType: 'animal',
 
  describe () {
    return `An ${this.animalType} with ${this.furColor} fur, 
      ${this.legs} legs, and a ${this.tail} tail.`;
  }
};
 
let mouseFactory = function mouseFactory () {

mbostock

license: gpl-3.0

bendc

const arr = [["foo", "bar"], ["hello", "world"]];

// Create object from array of tuples
const obj = {}; arr.forEach(el => obj[el[0]] = el[1]);
const map = new Map(arr);

// Get object size
const objSize = Object.keys(obj).length;
const mapSize = map.size;

spyesx

.sidebar_newsletter_sign_up,
.sidebar_subscribe,
.sign-up-form-single,
.signup-form--header,
.signup-with-checkboxes,
.skinny-sign-up,
.slidedown-newsletter,
.small-newsletter,
.social-link-mail,
.social_newsletter_box,

threepointone

// inifinite scrolling of content without extra wrappers 
const { render, findDOMNode  } = ReactDOMFiber

class App extends React.Component {
  render() {
  // wrap the root element with an Intersection Observer, exposing .observe for children
    return <Intersection>
      <div style={{ height: 200, overflow: 'auto' }}>
        <Page offset={0} count={10} />
      </div>