Skip to content

Instantly share code, notes, and snippets.

Joe Critchley joecritch

View GitHub Profile
@joecritch
joecritch / object-assign-to-spread.js
Created Jul 14, 2016
Converts all Object.assign calls to { ... obj } spread.
View object-assign-to-spread.js
// Highly based on an example from https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb
module.exports = function(file, api) {
var j = api.jscodeshift;
var root = j(file.source);
const update = path =>
j(path).replaceWith(j.objectExpression(
flatten(path.value.arguments.map(p =>
p.type === 'ObjectExpression'
@joecritch
joecritch / html_for_international_calling coes.htm
Last active Mar 26, 2019 — forked from andyj/html_for_international_calling coes.htm
HTML <select> international calling codes for each country... with emojis
View html_for_international_calling coes.htm
<!-- country codes (ISO 3166) and Dial codes. -->
<select name="country_code">
<option value="44" selected>🇬🇧 United Kingdom (+44)</option>
<option value="1">🇺🇸 United States (+1)</option>
<optgroup label="Other countries">
<option value="213">🇩🇿 Algeria (+213)</option>
<option value="376">🇦🇩 Andorra (+376)</option>
<option value="244">🇦🇴 Angola (+244)</option>
<option value="1264">🇦🇮 Anguilla (+1264)</option>
<option value="1268">🇦🇬 Antigua &amp; Barbuda (+1268)</option>
@joecritch
joecritch / gist:1476393
Created Dec 14, 2011
Basic auth middleware for Node.js Express
View gist:1476393
function basic_auth (req, res, next) {
if (req.headers.authorization && req.headers.authorization.search('Basic ') === 0) {
// fetch login and password
if (new Buffer(req.headers.authorization.split(' ')[1], 'base64').toString() == 'usernamehere123:passwordhere123') {
next();
return;
}
}
console.log('Unable to authenticate user');
console.log(req.headers.authorization);
@joecritch
joecritch / MyComponent.js
Last active Jun 15, 2018
Passing specific props in React / JSX
View MyComponent.js
class MyComponent extends React.Component {
render() {
const {location, todos, users} = this.props;
//
// ... do things with your variables!
//
return (
<MyChild {...{location, todos, user}} />
// equivalent to:
// <MyChild location={location} todos={todos} user={user} />
@joecritch
joecritch / README.md
Last active Apr 6, 2018
PHP sanity check
View README.md

PHP Sanity Check

This is a rudimentary script that checks for runtime errors, such as undefined variables in template partials.

@joecritch
joecritch / updatein.js
Last active Oct 10, 2017
Immutable tree "updateIn"
View updatein.js
function updateIn(tree, indexPath, replacement, childrenKey = 'children', depth = 0) {
function insert(ins) {
return tree
.slice(0, indexPath[depth])
.concat([ins])
.concat(tree.slice(indexPath[depth] + 1));
}
const lastDepth = indexPath.length - 1;
View README.md
  • Context: I'm trying to load a jQuery plugin asynchronously, with Webpack code splitting. (I definitely don't want this as part of my main bundle, haha!)
  • I didn't use singlechunk.js because I want jQuery to be cached as its own dependency (in case I need to lazy load a different plugin somewhere else)
  • I'm currently using multichunks-but-blocking.js, but the waterfall shows that it waits for jQuery to finish downloading before attempting intl-tel-input.
  • Is there a way to download both jquery and intl-tel-input chunks in parallel, then execute once they're both downloaded? I'm guessing I might be able to use Promise.all, but struggling to get my head around what's meant to be static, etc.

(p.s. I can't use import() because I'm using Bublé)

View StylesheetLoader.js
import Barba from 'barba.js';
import createBehavior from '../helpers/createBehavior';
const StylesheetLoader = createBehavior('StylesheetLoader', {
getStylesheetHrefs(container) {
const hrefs = container.getAttribute('data-StylesheetLoader-hrefs');
if (hrefs) {
return JSON.parse(hrefs);
}
return [];
@joecritch
joecritch / _redbox.php
Last active Jun 22, 2017
PHP redbox for errors
View _redbox.php
<?php
$errors = array();
function redbox($no, $str, $file, $line) {
global $errors;
$errors[] = array(
'no' => $no,
'str' => $str,
'file' => $file,
'line' => $line,
@joecritch
joecritch / gist:4e79fab2b084921e40fb71c60e159b9d
Last active Apr 20, 2017
A Day of React: ES features to know
View gist:4e79fab2b084921e40fb71c60e159b9d
# ECMAScript features to know for "A Day of React"
- **You'll need to know ES5, then some features from ES2015.**
Learn the following from the ES2015 specification (See "Learn ES2015": https://babeljs.io/learn-es2015/)
- Arrows and lexical 'this'
- Template Strings
- Destructuring
- Default + Rest + Spread
You can’t perform that action at this time.