gustavohenke

var svg = document.querySelector( "svg" );
var svgData = new XMLSerializer().serializeToString( svg );

var canvas = document.createElement( "canvas" );
var ctx = canvas.getContext( "2d" );

var img = document.createElement( "img" );
img.setAttribute( "src", "data:image/svg+xml;base64," + btoa( svgData ) );

img.onload = function() {

mikaelbr

// === Arrays

var [a, b] = [1, 2];
console.log(a, b);
//=> 1 2


// Use from functions, only select from pattern
var foo = () => [1, 2, 3];

JamesMGreene

Initialize

gitflow	git
git flow init	git init
	git commit --allow-empty -m "Initial commit"
	git checkout -b develop master

Connect to the remote repository

ryanflorence

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

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

J2TEAM

Here is a list of scopes to use in Sublime Text 2/3 snippets -

ActionScript: source.actionscript.2
AppleScript: source.applescript
ASP: source.asp
Batch FIle: source.dosbatch
C#: source.cs
C++: source.c++
Clojure: source.clojure

kentcdodds

#!/usr/bin/env bash
set -e

# allow being run from somewhere other than the git rootdir
gitroot=$(git rev-parse --show-cdup)

# default gitroot to . if we're already at the rootdir
gitroot=${gitroot:-.};

nm_bin=$gitroot/node_modules/.bin

mxstbr

Enable tab completion for JSX with Emmet in Atom

This guide assumes you have the emmet and language-babel packages already installed in Atom

1. Open the keymap.cson file by clicking on Atom -> Keymap… in the menu bar
2. Add these lines of code to your keymap:

'atom-text-editor[data-grammar~="jsx"]:not([mini])':

g0t4

From my Pluralsight course: https://app.pluralsight.com/library/courses/asynchronous-javascript-reasoning/table-of-contents

• Weather http://plnkr.co/edit/ZOAaSdtnfvR6WwiuVZ6s
• Avoid Blocking – Red Background http://plnkr.co/edit/z29VyH5BPvC4oc40EyOu
• setTimeout Pyramid Challenge http://plnkr.co/edit/DGiHFQOQfnipCcpex2RH
• Drag and Drop Red Box http://plnkr.co/edit/SmSpPS5ZgPvkgn8RE6y1
• Timer onReady http://plnkr.co/edit/gafgKCrxnDIJ6YaG9Jpx
• Timer measure http://plnkr.co/edit/kPOgzEuIvUmN4o6Jenem
• Progress Number Crunching - Web Worker https://plnkr.co/edit/Yy7BOZU9sIa8EyrxJwGH
• Event Listeners Are Synchronous http://plnkr.co/edit/mDvSHpF3HcTjtvltGmQn

smokinggoats

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      currentPage: 0,
      pageCount: 10,
    }
  }

  handlePageClick = (data) => {