Skip to content

Instantly share code, notes, and snippets.

View loklaan's full-sized avatar
🐛
"You find the weirdest bugs 🎖" – Other Engineers

Lochlan Bunn loklaan

🐛
"You find the weirdest bugs 🎖" – Other Engineers
View GitHub Profile
@aldendaniels
aldendaniels / alternative-to-higher-order-components.md
Last active October 6, 2018 09:50
Alternative to Higher-order Components

React now supports the use of ES6 classes as an alternative to React.createClass().

React's concept of Mixins, however, doesn't have a corollary when using ES6 classes. This left the community without an established pattern for code that both handles cross-cutting concerns and requires access to Component Life Cycle Methods.

In this gist, @sebmarkbage proposed an alternative pattern to React mixins: decorate components with a wrapping "higher order" component that handles whatever lifecycle methods it needs to and then invokes the wrapped component in its render() method, passing through props.

While a viable solution, this has a few drawbacks:

  1. There's no way for the child component to override functionality defined on the higher order component.
@sebmarkbage
sebmarkbage / Enhance.js
Last active January 31, 2024 18:33
Higher-order Components
import { Component } from "React";
export var Enhance = ComposedComponent => class extends Component {
constructor() {
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

  1. Launch quicktime player
  2. do Screen recording

screen shot 2014-10-22 at 11 16 23 am

@staltz
staltz / introrx.md
Last active May 14, 2024 18:07
The introduction to Reactive Programming you've been missing
@branneman
branneman / better-nodejs-require-paths.md
Last active April 27, 2024 04:16
Better local require() paths for Node.js

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

@gnarf
gnarf / ..git-pr.md
Last active April 12, 2024 22:00
git pr - Global .gitconfig aliases for Pull Request Managment

Install

Either copy the aliases from the .gitconfig or run the commands in add-pr-alias.sh

Usage

Easily checkout local copies of pull requests from remotes:

  • git pr 4 - creates local branch pr/4 from the github upstream(if it exists) or origin remote and checks it out
  • git pr 4 someremote - creates local branch pr/4 from someremote remote and checks it out
@afeld
afeld / gist:4952991
Last active February 8, 2022 03:13
good APIs for mashups

This list has been superseded by Public APIs. Check there for APIs with Auth: No, HTTPS and CORS Yes.


List of data APIs that require no server-side auth or private credentials, and are thus good for small browser-only JS projects.

@ndarville
ndarville / business-models.md
Last active January 13, 2024 17:27
Business models based on the compiled list at http://news.ycombinator.com/item?id=4924647. I find the link very hard to browse, so I made a simple version in Markdown instead.

Business Models

Advertising

Models Examples
Display ads Yahoo!
Search ads Google