Skip to content

Instantly share code, notes, and snippets.

@caridy
caridy / export-syntax.js
Last active January 15, 2022 14:22
ES6 Module Syntax Table
// default exports
export default 42;
export default {};
export default [];
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {}

Git Cheat Sheet

Commands

Getting Started

git init

or

@nolanlawson
nolanlawson / protips.js
Last active November 19, 2024 02:40
Promise protips - stuff I wish I had known when I started with Promises
// Promise.all is good for executing many promises at once
Promise.all([
promise1,
promise2
]);
// Promise.resolve is good for wrapping synchronous code
Promise.resolve().then(function () {
if (somethingIsNotRight()) {
throw new Error("I will be rejected asynchronously!");
@paulirish
paulirish / what-forces-layout.md
Last active September 21, 2025 01:36
What forces layout/reflow. The comprehensive list.

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
@0bie
0bie / functionalSnippets.js
Last active September 21, 2022 10:56
functional js snippets
const overlay = (element) => {
const newElement = document.createElement(element);
newElement.style.height = '100vh';
return newElement;
};
const onEvent = (inputType, DOMElement, callback) => {
if (DOMElement.addEventListener){
DOMElement.addEventListener(inputType, callback);
}
@acdlite
acdlite / app.js
Last active July 22, 2025 08:36
Quick and dirty code splitting with React Router v4
// getComponent is a function that returns a promise for a component
// It will not be called until the first mount
function asyncComponent(getComponent) {
return class AsyncComponent extends React.Component {
static Component = null;
state = { Component: AsyncComponent.Component };
componentWillMount() {
if (!this.state.Component) {
getComponent().then(Component => {
@nrollr
nrollr / MySQL_macOS_Sierra.md
Last active July 24, 2025 13:35
Install MySQL on Sierra using Homebrew

Install MySQL on macOS Sierra

This procedure explains how to install MySQL using Homebrew on macOS Sierra 10.12

Install Homebrew

  • Installing Homebrew is effortless, open Terminal and enter :
    $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • Note: Homebrew will download and install Command Line Tools for Xcode 8.0 as part of the installation process.

Install MySQL

At this time of writing, Homebrew has MySQL version 5.7.15 as default formulae in its main repository :

@ljharb
ljharb / array_iteration_thoughts.md
Last active April 15, 2025 03:33
Array iteration methods summarized

Array Iteration

https://gist.github.com/ljharb/58faf1cfcb4e6808f74aae4ef7944cff

While attempting to explain JavaScript's reduce method on arrays, conceptually, I came up with the following - hopefully it's helpful; happy to tweak it if anyone has suggestions.

Intro

JavaScript Arrays have lots of built in methods on their prototype. Some of them mutate - ie, they change the underlying array in-place. Luckily, most of them do not - they instead return an entirely distinct array. Since arrays are conceptually a contiguous list of items, it helps code clarity and maintainability a lot to be able to operate on them in a "functional" way. (I'll also insist on referring to an array as a "list" - although in some languages, List is a native data type, in JS and this post, I'm referring to the concept. Everywhere I use the word "list" you can assume I'm talking about a JS Array) This means, to perform a single operation on the list as a whole ("atomically"), and to return a new list - thus making it mu

@datchley
datchley / react-redux-style-guide.md
Last active March 22, 2025 20:06
React + Redux Style Guide
@heygrady
heygrady / mapDispatchToProps.md
Last active April 5, 2025 08:11
Redux containers: mapDispatchToProps

Redux containers: mapDispatchToProps

This document details some tips and tricks for creating redux containers. Specifically, this document is looking at the mapDispatchToProps argument of the connect function from [react-redux][react-redux]. There are many ways to write the same thing in redux. This gist covers the various forms that mapDispatchToProps can take.