Instantly share code, notes, and snippets.

View QueueMutationLink.js

Redux containers: mapDispatchToProps

This document details some tips and tricks for creating redux containers. Specifically, this document is looking at the mapDispatchToProps argument of the connect function from [react-redux][react-redux]. There are many ways to write the same thing in redux. This gist covers the various forms that mapDispatchToProps can take.

View index.ts
import { GraphQLServer, Options } from 'graphql-yoga'
import { mergeSchemas } from 'graphql-tools';
import { getRemoteSchema } from "./remoteSchema";
import { SubscriptionClient } from 'subscriptions-transport-ws';
import * as ws from 'ws';
if (process.env.NODE_ENV !== 'production') {
View index.html
<div id="root" class="container"></div>
View 1.js
function logger(strings,...values) {
var str = "";
for (let i = 0; i < strings.length; i++) {
if (i > 0) {
if (values[i-1] && typeof values[i-1] == "object") {
if (values[i-1] instanceof Error) {
if (values[i-1].stack) {
str += values[i-1].stack;

React DOM automatically supports profiling in development mode for v16.5+, but since profiling adds some small additional overhead it is opt-in for production mode. This gist explains how to opt-in.

Create React App

At the moment, the only way to enable production profiling in CRA apps is to eject and modify the production Webpack configuration file (config/ as shown below:

react-dom@^16.5.0 / schedule@^0.4.0

module.exports = {
  output: {
View Emotion.go
package main
import (
View redux-thunk-examples.js
// The classic AJAX call - dispatch before the request, and after it comes back
function myThunkActionCreator(someValue) {
return (dispatch, getState) => {
dispatch({type : "REQUEST_STARTED"});"/someEndpoint", {data : someValue})
response => dispatch({type : "REQUEST_SUCCEEDED", payload : response}),
error => dispatch({type : "REQUEST_FAILED", error : error})

We will first discussed how destructing and rest parameters can be used in ES6 - in arrays and objects. Then we will look at a few examples and also discuss some quiz.


var array = [1, 2, 3, 4];
var nestedArray = [1, 2, 3, 4, [7, 8, 9]];

var [a, b, c, d] = array;
console.log(a, b, c, d)
View SubscriptionContainer.js
import React from 'react';
import { Subscribe } from 'unstated';
import isEqual from 'react-fast-compare';
import { Subscription } from 'react-apollo'
class Event extends React.Component {
constructor(props) {
componentDidMount() {