iAmNathanJ

debounced-promise.ts

Provides a debounced function that returns a handle to a Promise which can be awaited by contextually separate callers and resolves only after the last non-debounced async operation is settled.

By default, if a given call gets debounced, subsequent call(s) will ignore the previous arguments that were provided. This can be overridden by providing a mergeArguments function that allows for the finally exectuted function to batch arguments from all invocations.

Usage in React

https://stackblitz.com/edit/debounce-promise?file=src%2FApp.tsx

iAmNathanJ

#!/bin/bash

# Usage examples:
#   ./update-all-repos.sh
#   ./update-all-repos.sh ~/Sites ~/Projects

HIGHLIGHT="\e[01;34m"
NORMAL='\e[00m'

function update {

iAmNathanJ

Publish Subscribe

• Some similarities to Observer and Observable pattern(s)
• Could you use an Oberserver implementation as the middle of a pub/sub implementation? ie Publisher -> Observer -> Subscribers

Problems

• Order of subscribes and publish makes for bootstrapping/bootup order requirements. Inexplicit coupling that's hard to debug
• Data is the coupling - how to version?

iAmNathanJ

function doSomethingWithTextFile(filePath, doThing) {
  var text = readFile(filePath);
  doThing(text);
}

doSomethingWithTextFile(‘my-file.txt’, console.log);

iAmNathanJ

function addMathTo(obj) {
  Object.getOwnPropertyNames(Math).forEach((prop) => {
    let constName = String(prop).toUpperCase();
    Object.defineProperty(obj, constName, {
      value: Math[prop],
      writable: false,
      configurable: false
    });
  });
}

iAmNathanJ

Valentine

A Pen by iAmNathanJ on CodePen.

License.

iAmNathanJ

Hamburger Heaven

Just another good old burger button.

A Pen by Nathan Jacobs on CodePen.

License.

iAmNathanJ

main.col
  .row.row-top
    h1.animated HELLO
  .row.row-bottom
    .row.toolbar
      .row.select-bar
        select.animation-selector
          option zoomInFlip
          option springOutEntrance
          option springInExit          

iAmNathanJ

<!-- HTML -->

<div class="background">
    
    <div class="canvas back">
	<canvas id="canvas-back"></canvas>
    </div>
    
    <div class="canvas mid">
	<canvas id="canvas-mid"></canvas>

iAmNathanJ

// JavaScript

(function(){
	
    $(document).ready(function(){
		
        var $background      = $('div.background'),
            backgroundWidth  = $background.width(),
            backgroundHeight = $background.height(),
            canvasBack       = document.getElementById('canvas-back'),