bfillmer

  const cartsMachine = Machine({
    id: 'carts',
    initial: 'initial',
    context: {},
    states: {
      initial: {
        on: {
          'HYDRATE': {
            target: 'idle',

bfillmer

const glanceMachine = Machine(
  {
    id: 'glanceMachine',
    initial: 'idle',
    context: {
      expanded: 'open',
      criteria: {},
      stats: {},
    },
    states: {

bfillmer

const dashboardMachine = Machine({
  id: 'dashboardMachine',
  initial: 'idle',
  context: {},
  states: {
    idle: {
      on: {
        INIT: 'loadPreferences'
      }
    },

bfillmer

// Basic auth0 lock functionality written functionally rather than class based.

import auth0 from 'auth0-js'

const config = {
  domain: '',
  clientID: '',
  redirectUri: '',
  audience: '',

bfillmer

// Expected input -> output
// [[1,2,[3]],4] -> [1,2,3,4]
const input = [[1,2,[3]],4]

const flatten = (array, base = []) => array.reduce(
  (result, current) => ((Array.isArray(current)) ? flatten(current, result) : [...result, current])
, base)

// -> [1, 2, 3, 4]
console.log(flatten(input))

bfillmer

# Possible MySQL dockerfile
FROM mysql:latest

ENV MYSQL_ROOT_PASSWORD=<password>

EXPOSE 3306

# Possible WordPress dockerfile
FROM wordpress:latest

bfillmer

# ALIASES
# Atom
alias a='open -a "atom"'
# ls -la
alias la="ls -laFG"

# NORD COLORS (https://github.com/arcticicestudio/nord)
export RED="\033[1;31m"
export GREEN="\033[1;32m"

bfillmer

Standard JS in create-react-app

I've been using create-react-app lately as I find it very useful to kick things off while starting a project. I almost always follow JavaScript Standard Style and I found myself googling it so I figured out I should write it down.

Get Standard JS

I really like keeping dependencies as local as possible but if you prefer you can install it globally.

yarn add standard -D

or

bfillmer

import { createStore, applyMiddleware } from 'redux';
import { Observable, Subject } from 'rxjs';

const api = (url, fail) => {
  console.log(`Loading API ${url}`);
  return new Promise((res, rej) => setTimeout(() => fail ? rej(`data-${url}`) : res('SUCCESS'), 1000));
};

const customSaga = iterable =>
  iterable

bfillmer

I'd got rid of action types and I'd have only actions (action creators). No strings, the function (reference) is used later for comparisons.

export const addTodo = (id, title) => ({ id, title });
export const removeTodo = id => ({ id });
actions({ addTodo, removeTodo }); // Connect it to actions.addTodo & actions.removeTodo.

That's it. They define what your app can do.