Skip to content

Instantly share code, notes, and snippets.

François Bonnefont happypoulp

  • Jobteaser
  • Paris, France
View GitHub Profile
@fernandoaleman
fernandoaleman / mysql2-mojave.md
Last active Jun 25, 2020
Install mysql2 on MacOS Mojave
View mysql2-mojave.md

For MacOS Catalina, visit Install mysql2 on MacOS Catalina

Problem

Installing mysql2 gem errors on MacOS Mojave.

Solution

Make sure openssl is installed on Mac via Homebrew.

@Rich-Harris
Rich-Harris / service-workers.md
Last active Jul 8, 2020
Stuff I wish I'd known sooner about service workers
View service-workers.md

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.

@yang-wei
yang-wei / destructuring.md
Last active Jun 8, 2020
Elm Destructuring (or Pattern Matching) cheatsheet
View destructuring.md

Should be work with 0.18

Destructuring(or pattern matching) is a way used to extract data from a data structure(tuple, list, record) that mirros the construction. Compare to other languages, Elm support much less destructuring but let's see what it got !

Tuple

myTuple = ("A", "B", "C")
myNestedTuple = ("A", "B", "C", ("X", "Y", "Z"))
@mauvm
mauvm / Jasmine-and-Babel6.md
Created Nov 12, 2015
Jasmine ES6 run script for use with Babel 6
View Jasmine-and-Babel6.md
$ npm install --save babel-cli babel-preset-es2015
$ npm install --save-dev jasmine

.babelrc:

{
  "presets": ["es2015"]
@gaearon
gaearon / slim-redux.js
Last active Jul 7, 2020
Redux without the sanity checks in a single file. Don't use this, use normal Redux. :-)
View slim-redux.js
function mapValues(obj, fn) {
return Object.keys(obj).reduce((result, key) => {
result[key] = fn(obj[key], key);
return result;
}, {});
}
function pick(obj, fn) {
return Object.keys(obj).reduce((result, key) => {
if (fn(obj[key])) {
@paulirish
paulirish / what-forces-layout.md
Last active Jul 9, 2020
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

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
@gaearon
gaearon / combining.js
Created Jun 3, 2015
Combining Stateless Stores
View combining.js
// ------------
// counterStore.js
// ------------
import {
INCREMENT_COUNTER,
DECREMENT_COUNTER
} from '../constants/ActionTypes';
const initialState = { counter: 0 };
View gist:598fa75e22bdfa44cf47

2015-01-29 Unofficial Relay FAQ

Compilation of questions and answers about Relay from React.js Conf.

Disclaimer: I work on Relay at Facebook. Relay is a complex system on which we're iterating aggressively. I'll do my best here to provide accurate, useful answers, but the details are subject to change. I may also be wrong. Feedback and additional questions are welcome.

What is Relay?

Relay is a new framework from Facebook that provides data-fetching functionality for React applications. It was announced at React.js Conf (January 2015).

@ericelliott
ericelliott / fp-lingo.md
Last active Jul 3, 2020
A Guide to Functional Programming Lingo for JavaScripters
View fp-lingo.md

A Guide to Functional Programming Lingo for JavaScripters

Functional programming gets a bad wrap about being too hard for mere mortals to comprehend. This is nonsense. The concepts are actually quite simple to grasp.

The jargon is the hardest part. A lot of that vocabulary comes from a specialized field of mathematical study called category theory (with a liberal sprinkling of type theory and abstract algebra). This sounds a lot scarier than it is. You can do this!

All examples using ES6 syntax. wrap (foo) => bar means:

function wrap (foo) {
@staltz
staltz / introrx.md
Last active Jul 9, 2020
The introduction to Reactive Programming you've been missing
View introrx.md
You can’t perform that action at this time.