Skip to content

Instantly share code, notes, and snippets.

Working on personal projects

Joseph Rex josephrexme

Working on personal projects
Block or report user

Report or block josephrexme

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View Redux_explanation.js
// The reducer function looks at each action that comes in
// and based on the type generates a new state based on the
// previous state and any additional data the action carried
const reducer = (state, action) => {
switch (action.type) {
return {
count: state.count + 1

‪“‬In what way is JS any more maintainable than CSS? How does writing CSS in JS make it any more maintainable?”

‪Happy to chat about this. There’s an obvious disclaimer that there’s a cost to css-in-js solutions, but that cost is paid specifically for the benefits it brings; as such it’s useful for some usecases, and not meant as a replacement for all workflows. ‬

‪(These conversations always get heated on twitter, so please believe that I’m here to converse, not to convince. In return, I promise to listen to you too and change my opinions; I’ve had mad respect for you for years and would consider your feedback a gift. Also, some of the stuff I’m writing might seem obvious to you; I’m not trying to tell you if all people of some of the details, but it might be useful to someone else who bumps into this who doesn’t have context)‬

So the big deal about css-in-js (cij) is selectors.

tomhodgins / cibc2csv.js
Last active Nov 30, 2017
Paste this function into your JS console on CIBC's online banking website to scrape your account ledger into a CSV formatted file the browser can save that can be imported into Excel
View cibc2csv.js
function cibc2csv() {
var table = document.querySelector('')
var csv = ''
var head = []
var row = []
// read header cells
table.querySelectorAll('thead th').forEach(th => {
zkat / index.js
Last active Nov 10, 2019
npx is cool
View index.js
#!/usr/bin/env node
console.log('yay gist')
View zip-vs-array-from.js
// Lazy (=on-demand) zip()
for (const [i, x] of zip(naturalNumbers(), naturalNumbers())) {
console.log(i, x);
if (i >= 2) break;
// Output:
// 0 0
// 1 1
// 2 2
cecilemuller /
Last active Jun 26, 2019
Using Three.js "examples" (e.g. OrbitControls) with Webpack 2

Javascript files from the examples folder (such as OrbitControls) are not CommonJS or ES Modules, but they can still be used in Webpack bundles:

In package.json:

"dependencies": {
	"three": "0.84.0",
	"webpack": "2.4.1"

This is a collection of responsive techniques made possible by EQCSS that apply styles in situations CSS can't quite reach today without a little help from JavaScript.

EQCSS extends CSS syntax with the following ideas:

1) What if CSS could set a scope for a selector like a @media query for an element

2) What if CSS could add a block of CSS styles to the page when that selector is true

3) What if CSS could add responsive conditions to that selector

csswizardry /
Last active Oct 25, 2019
Vim without NERD tree or CtrlP

Vim without NERD tree or CtrlP

I used to use NERD tree for quite a while, then switched to CtrlP for something a little more lightweight. My setup now includes zero file browser or tree view, and instead uses native Vim fuzzy search and auto-directory switching.

Fuzzy Search

There is a super sweet feature in Vim whereby you can fuzzy find your files using **/*, e.g.:

:vs **/*<partial file name><Tab>
View es6-feature-detection.js
var str = 'class ಠ_ಠ extends Array {constructor(j = "a", ...c) {const q = (({u: e}) => {return { [`s${c}`]: Symbol(j) };})({});super(j, q, ...c);}}' +
'new Promise((f) => {const a = function* (){return "\u{20BB7}".match(/./u)[0].length === 2 || true;};for (let vre of a()) {' +
'const [uw, as, he, re] = [new Set(), new WeakSet(), new Map(), new WeakMap()];break;}f(new Proxy({}, {get: (han, h) => h in han ? han[h] ' +
': "42".repeat(0o10)}));}).then(bi => new ಠ_ಠ(bi.rd));';
try {
} catch(e) {
alert('Your browser does not support ES6!')
You can’t perform that action at this time.