Skip to content

Instantly share code, notes, and snippets.

View dariocravero's full-sized avatar

Darío Javier Cravero dariocravero

View GitHub Profile
@voodooattack
voodooattack / gql-directives.js
Last active January 5, 2020 09:57
GraphQL-Sequelize auto-model functionality. Directly translates the schema language into database models via directives.
const { parse, visit, print, Kind, BREAK } = require('graphql/language');
const { buildASTSchema } = require('graphql/utilities');
const { addResolveFunctionsToSchema } = require('graphql-tools');
const Sequelize = require('sequelize');
const { graphql } = require('graphql');
const jexl = require('jexl');
const deepAssign = require('deep-assign');
const { resolver: sequelizeResolver } = require('graphql-sequelize');
const { inspect } = require('util');
@iammerrick
iammerrick / PinchZoomPan.js
Last active April 22, 2024 02:54
React Pinch + Zoom + Pan
import React from 'react';
const MIN_SCALE = 1;
const MAX_SCALE = 4;
const SETTLE_RANGE = 0.001;
const ADDITIONAL_LIMIT = 0.2;
const DOUBLE_TAP_THRESHOLD = 300;
const ANIMATION_SPEED = 0.04;
const RESET_ANIMATION_SPEED = 0.08;
const INITIAL_X = 0;
@dariocravero
dariocravero / panels-and-pagesfaq.md
Created May 24, 2016 20:51
An FAQ on Panels and Pages

Panels and Pages FAQ

1) What is Pages?

It's a collaborative tool to allow teams of developers and designers to move extremely fast from concept to real applications that work on the web and on Android and iOS.

It takes a JSON and outputs React code.

Designers and developers work together on the JSON code.

@gaearon
gaearon / index.js
Last active January 5, 2022 18:45
Breaking out of Redux paradigm to isolate apps
import React, { Component } from 'react'
import Subapp from './subapp/Root'
class BigApp extends Component {
render() {
return (
<div>
<Subapp />
<Subapp />
<Subapp />
@Avaq
Avaq / combinators.js
Last active June 7, 2024 20:31
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))
@t-mart
t-mart / netrw quick reference.md
Last active May 19, 2024 06:18
A quick reference for Vim's built-in netrw file selector.
Map Action
<F1> Causes Netrw to issue help
<cr> Netrw will enter the directory or read the file
<del> Netrw will attempt to remove the file/directory
- Makes Netrw go up one directory
a Toggles between normal display, hiding (suppress display of files matching g:netrw_list_hide) showing (display only files which match g:netrw_list_hide)
c Make browsing directory the current directory
C Setting the editing window
d Make a directory
@paulirish
paulirish / what-forces-layout.md
Last active June 8, 2024 13:18
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
@nolanlawson
nolanlawson / protips.js
Last active February 4, 2024 18:06
Promise protips - stuff I wish I had known when I started with Promises
// Promise.all is good for executing many promises at once
Promise.all([
promise1,
promise2
]);
// Promise.resolve is good for wrapping synchronous code
Promise.resolve().then(function () {
if (somethingIsNotRight()) {
throw new Error("I will be rejected asynchronously!");
@paulirish
paulirish / bling.js
Last active May 1, 2024 19:56
bling dot js
/* bling.js */
window.$ = document.querySelectorAll.bind(document);
Node.prototype.on = window.on = function (name, fn) {
this.addEventListener(name, fn);
}
NodeList.prototype.__proto__ = Array.prototype;
@mattmccray
mattmccray / component-with-mixins.js
Created February 17, 2015 19:42
ES6 Classes w/Mixins -- Idea -- React 0.13
export function ComponentWithMixins( ...mixins) {
class MixedComponent extends React.Component { }
for( let mixin of mixins) {
// TODO: Would need to handle mixin collisions...
for( let name of Object.keys( mixin)) {
MixedComponent.prototype[ name]= mixin[ name]
}
}