Skip to content

Instantly share code, notes, and snippets.

View theseyi's full-sized avatar
💭
making the world's data actionable

Seyi Adebajo theseyi

💭
making the world's data actionable
  • Metaphor Data
View GitHub Profile
@VictorTaelin
VictorTaelin / promise_monad.md
Last active April 28, 2024 13:28
async/await is just the do-notation of the Promise monad

async/await is just the do-notation of the Promise monad

CertSimple just wrote a blog post arguing ES2017's async/await was the best thing to happen with JavaScript. I wholeheartedly agree.

In short, one of the (few?) good things about JavaScript used to be how well it handled asynchronous requests. This was mostly thanks to its Scheme-inherited implementation of functions and closures. That, though, was also one of its worst faults, because it led to the "callback hell", an seemingly unavoidable pattern that made highly asynchronous JS code almost unreadable. Many solutions attempted to solve that, but most failed. Promises almost did it, but failed too. Finally, async/await is here and, combined with Promises, it solves the problem for good. On this post, I'll explain why that is the case and trace a link between promises, async/await, the do-notation and monads.

First, let's illustrate the 3 styles by implementing

This document has moved!

It's now here, in The Programmer's Compendium. The content is the same as before, but being part of the compendium means that it's actively maintained.

@toranb
toranb / alternate-route.js
Created April 4, 2016 00:13
classic ember route with the redux service to dispatch with
import Ember from 'ember';
import ajax from 'example/utilities/ajax';
var UsersRoute = Ember.Route.extend({
redux: Ember.inject.service(),
model() {
var redux = this.get('redux');
return ajax('/api/users', 'GET').then(response => redux.dispatch({type: 'DESERIALIZE_USERS', response: response}));
}
});
@idibidiart
idibidiart / GraphQL-Architecture.md
Last active September 16, 2023 18:36
Building an Agile, Maintainable Architecture with GraphQL

Building a Maintainable, Agile Architecture for Realtime, Transactional Apps

A maintainable application architecture requires that the UI only contain the rendering logic and execute queries and mutations against the underlying data model on the server. A maintainable architecture must not contain any logic for composing "app state" on the client as that would necessarily embed business logic in the client. App state should be persisted to the database and the client projection of it should be composed in the mid tier, and refreshed as mutations occur on the server (and after network interruption) for a highly interactive, realtime UX.

With GraphQL we are able to define an easy-to-change application-level data schema on the server that captures the types and relationships in our data, and wiring it to data sources via resolvers that leverage our db's own query language (or data-oriented, uniform service APIs) to resolve client-specified "queries" and "mutations" against the schema.

We use GraphQL to dyn

@Avaq
Avaq / combinators.js
Last active May 1, 2024 09:38
Common combinators in JavaScript
const I = x => x
const K = x => y => x
const A = f => x => f (x)
const T = x => f => f (x)
const W = f => x => f (x) (x)
const C = f => y => x => f (x) (y)
const B = f => g => x => f (g (x))
const S = f => g => x => f (x) (g (x))
const S_ = f => g => x => f (g (x)) (x)
const S2 = f => g => h => x => f (g (x)) (h (x))
@jamesarosen
jamesarosen / ember-xss.md
Created October 28, 2015 16:50
Ember and XSS Safety

TL;DR

In Ember, always use {{...}}, not {{{...}}}. Use Ember.String.htmlSafe as necessary in JavaScript (usually in a component) to mark markup as HTML-safe. Never pass user-entered content directly to Ember.String.htmlSafe.

Details

Ember has great XSS protection built in. The HTMLBars templating library will automatically run any interpolations through htmlEscape for you. So

@Muzietto
Muzietto / slice_country.js
Created September 29, 2015 12:35
google/i18n/libphonenumber - node.js script to prepare single-country metadata files
/*
SCLEXE - single-country libphonenumber executable
Author: Marco Faustinelli (contacts@faustinelli.net)
Web: http://faustinelli.net/
http://faustinelli.wordpress.com/
Version: 1.0
The MIT License - Copyright (c) 2015 SCLEXE Project
*/
var fs = require('fs');
@paulirish
paulirish / what-forces-layout.md
Last active April 30, 2024 17:56
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
@chantastic
chantastic / on-jsx.markdown
Last active March 20, 2024 01:03
JSX, a year in

Hi Nicholas,

I saw you tweet about JSX yesterday. It seemed like the discussion devolved pretty quickly but I wanted to share our experience over the last year. I understand your concerns. I've made similar remarks about JSX. When we started using it Planning Center, I led the charge to write React without it. I don't imagine I'd have much to say that you haven't considered but, if it's helpful, here's a pattern that changed my opinion:

The idea that "React is the V in MVC" is disingenuous. It's a good pitch but, for many of us, it feels like in invitation to repeat our history of coupled views. In practice, React is the V and the C. Dan Abramov describes the division as Smart and Dumb Components. At our office, we call them stateless and container components (view-controllers if we're Flux). The idea is pretty simple: components can't

@tmcw
tmcw / comprehensive_documentation.md
Created March 25, 2015 14:46
Comprehensive Documentation

Software is layered.

Documentation is not. If your documentation states

Run npm install foo to install this module

It is really saying