Matt Blewitt matthewblewitt

Find any file CMD+P Find function by keyword CMD+SHIFT+O Go to any location in dev tools CMD+SHIFT+P

Console tips

Clear console CMD+L.

Get event listeners by selector

A note on NodeLists and HTML Collections

An HTMLCollection is a list of nodes. An individual node may be accessed by either ordinal index or the node’s name or id attributes. Collections in the HTML DOM are assumed to be live meaning that they are automatically updated when the underlying document is changed.

A NodeList object is a collection of nodes. The NodeList interface provides the abstraction of an ordered collection of nodes, without defining or constraining how this collection is implemented. NodeList objects in the DOM are live or static based on the interface used to retrieve them

const $header = document.getElementById('#header');
const $headings = document.getElementsByTagName('h1');

Ternary

{{ 'true' if conditional else 'false'  }}

Dump

{{ variable | dump }}

// Shape - superclass
// x,y: location of shape's bounding rectangle
function Shape(x, y) {
  this.x = x;
  this.y = y;
}

// Superclass method

Git Cheatsheet

What changed in the last commit

git show --name-status

Log one line

	const pa11y = require('pa11y');
	const request = require('supertest');
	const mocha = require('mocha');
	const { expect } = require('chai');
	const server = require('./server');

	const url =
	process.env.NODE_ENV === 'testing'
	? 'http://localhost:3000'
	: 'http://example.com';

	.flex {
	display: flex;
	}

	// Direction
	.flex-row {
	flex-direction: row;
	}
	.flex-row-reverse {
	flex-direction: row-reverse;