Skip to content

Instantly share code, notes, and snippets.

View msociety's full-sized avatar

Miguel Molina msociety

  • Alicante
View GitHub Profile
import { cookData } from './helpers/someFunction';
onmessage = ({ data: [...args] }) => {
const cookedData = cookData(...args);
postMessage(cookedData);
};
// ---------- ComponentX.js ------------
import React, { useMemo } from 'react';
...
@msociety
msociety / useSites.js
Created February 27, 2020 17:44
react's useReducer, combineReducers and HORs
import { useEffect, useReducer, useMemo } from 'react';
import { not, equals } from 'ramda';
import usePrevious from '../../../hooks/usePrevious';
import { getSitesFromCache, getSitesFromNetwork } from './getSites';
const areDifferent = (arr1, arr2) => not(equals(arr1, arr2));
const getIds = items => (items ? items.map(({ id }) => id) : []);
const defalutStatus = {

How to GraphQL - Core Concepts

The Schema Definition Language (SDL)

Defining simple types

type Person {
    id: ID!
 name: String!
@msociety
msociety / rx.js
Last active August 28, 2022 21:01
André Staltz (@andrestaltz): You will learn RxJS at ng-europe 2016
/*
* André Staltz (@andrestaltz): You will learn RxJS at ng-europe 2016
* https://www.youtube.com/watch?v=uQ1zhJHclvs
*/
function map(transformFn) {
const inputObservable = this;
const outputObservable = createObservable(function subscribe(outputObserver) {
inputObservable.subscribe({
next: function(x) {
@msociety
msociety / FloatingAside.js
Last active January 27, 2017 17:53
React Component FloatingAside
import React, { Component } from 'react';
const styles = {
wrapper: {
width: '100%',
padding: 0,
marginTop: '2.5em'
},
fixed: {
marginTop: 0,
@msociety
msociety / IconStack.js
Last active January 27, 2017 17:27
React Component "IconStack" using Font Awesome
import React, { PropTypes } from 'react';
/* |Prop |Type |Default |Description |
* |-----------|--------|-----------|--------------------------------------------|
* |[children] |`node` |`undefined`|Required: Child elements |
* |[size] |`string`|`undefined`|Increase size: 'lg', '2x', '3x', '4x', '5x' |
* |[className]|`string`|`undefined`|Set a CSS class for extra styles | */
const IconStack = ({
className,
@msociety
msociety / icon.js
Created January 27, 2017 17:17
React Component "Icon" using Font Awesome
import React, { PropTypes } from 'react';
/* |Prop |Type |Default |Description |
* |------------|-----------|---------|-------------------------------------------|
* |name |string |undefined|Required: Name of the Font Awesome Icon |
* |[className] |string |undefined|Set a CSS class for extra styles |
* |[size] |string |undefined|Increase size: 'lg', '2x', '3x', '4x', '5x'|
* |[rotate] |string |undefined|Rotate by deg:'90', '180', '270' |
* |[flip] |string |undefined|Flips Icon: 'horizontal', 'vertical' |
* |[fixedWidth]|boolean |false |Set Icon to a fixed width |