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.

---

whizark

HTML/CSS Class Naming Convention

A HTML/CSS Class Naming Convention for Scalable/Modular CSS.

ToC

• Basics
• Phrase and Compound Word
• Plural and Collection
• Variant

JaviLorbada

Videos

• Introduction to Functional Programming Johannes Weiß - https://vimeo.com/100786088
• ReactiveCocoa at MobiDevDay Andrew Sardone - https://vimeo.com/65637501
• The Future Of ReactiveCocoa Justin Spahr-Summers - https://www.youtube.com/watch?v=ICNjRS2X8WM
• Enemy of the State Justin Spahr-Summers - https://www.youtube.com/watch?v=7AqXBuJOJkY
• WWDC 2014 Session 229 - Advanced iOS Application Architecture and Patterns Andy Matuschak - https://developer.apple.com/videos/play/wwdc2014/229/
• Functioning as a Functionalist Andy Matuschak - https://www.youtube.com/watch?v=rJosPrqBqrA
• Controlling Complexity in Swift Andy Matuschak - https://realm.io/news/andy-matuschak-controlling-complexity/

ghinda

// takes a {} object and returns a FormData object
var objectToFormData = function(obj, form, namespace) {
    
  var fd = form || new FormData();
  var formKey;
  
  for(var property in obj) {
    if(obj.hasOwnProperty(property)) {
      
      if(namespace) {

paulirish

/* 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)); };

B-iggy

// set svg d path used as fallback (star)
$svg-d-path: 'm25,1l6,17l18,0l-14,11l5,17l-15,-10l-15,10l5,-17l-14,-11l18,0l6,-17z' !default;

// functions to urlencode the svg string
@function str-replace($string, $search, $replace: '') {
  $index: str-index($string, $search);
  @if $index {
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
  }
  @return $string;

paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

FUNExtreme

/* 
 * DESCRIPTION
 * This script will go through all the subscription buttons on the YouTube page you execute it on, and subscribes to the ones that
 * you're not subscribed to yet.
 * A random delay is added to each subscription request, this is due to the fact that YouTube starts blocking subscriptions after
 * a certain number of consecutive requests. Randomising the delays should trick the detection into thinking it's a valid user doing
 * the requests.
 * 
 * HOW TO USE
 * Navigate to the page containing the channels you would like to subscribe to. (The subscribe button should be visible!)

seblambla

/*
Author: ZetCoby
http://stackoverflow.com/a/30376660/3708754
*/

var tools = {
  /**
   *
   * Used to get the length of a rect
   *

coryhouse

{
  "name": "npm-scripts-example",
  "version": "1.0.0",
  "description": "npm scripts example",
  "scripts": {
    "prebuild": "echo I run before the build script",
    "build": "cross-env NODE_ENV=production webpack",
    "postbuild": "echo I run after the build script"
  }
}