frankfaustino

const fruits = {
  apple: 'better',
  banana: 'good',
  peach: 'ok',
  pear: 'good'
}

Object
  .entries(fruits)
  .reduce((goodFruit, [fruit, quality]) => {

frankfaustino

// 🔥 Node 7.6 has async/await! Here is a quick run down on how async/await works

const axios = require('axios'); // promised based requests - like fetch()

const getCoffee = () => new Promise(resolve => {
  setTimeout(() => resolve('☕'), 2000); // it takes 2 seconds to make coffee
});

async go = () => {
  try {

frankfaustino

const express = require('express')
const db = require('./data/helpers/tagDb')
const server = express()
server.use(express.json())

// Catches async/await errors/Promise rejections and passes it along to express middleware
const catchErrors = fn => (req, res, next) => fn(req, res, next).catch(next)

// Error Handler (displays full error details)
const handleErrors = (err, req, res, next) => {

frankfaustino

const state = []

// Actions => tells the reducer which action to perform and provides the values
const action = [
  { type: 'ADD_TODO', text: 'do laundry', completed: false, id: 0 },
  { type: 'ADD_TODO', text: 'walk the kids', completed: false, id: 1 },
  { type: 'ADD_TODO', text: 'take the dogs to school', completed: false, id: 2 },
  { type: 'ADD_TODO', text: 'kiss the plant', completed: false, id: 3 },
  { type: 'ADD_TODO', text: 'water the wifey', completed: false, id: 4 },
  { type: 'REMOVE_TODO', id: 0 },

frankfaustino

const MyComponent = ({ className, ...others }) => (
  <div className={className}>
    <MyOtherComponent {...others} />
  </div>
)

frankfaustino

// Good
const TableRowWrapper = ({ children }) => (
  <tr>
    {children}
  </tr>
)

// Bad
class TableRowWrapper extends Component {
  render() {

frankfaustino

// Container Pattern: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0
import Loading from './Loading'
import RenderUser from './RenderUser'

class User extends Component {
  state = { loading: true }

  render() {
    const { loading, user } = this.state
    return loading ? <Loading /> : <RenderUser user={user} />

frankfaustino

import React, { Component } from 'react'
import { withRouter } from 'react-router-dom'

class ContactForm extends Component {
  submitForm = (e) => {
    e.preventDefault()
    this.props.history.push('/thank-you')
  }

  render() {

frankfaustino

// === Arrays

var [a, b] = [1, 2];
console.log(a, b);
//=> 1 2


// Use from functions, only select from pattern
var foo = () => [1, 2, 3];

frankfaustino

Eric Elliott: Composing Software

• 0. An Introduction: Composing Software: An Introduction – JavaScript Scene – Medium
• 1. The Rise and Fall of Functional Programming: The Rise and Fall and Rise of Functional Programming (Composing Software)
• 2. Why Learn Functional Programming in JavaScript?: Why Learn Functional Programming in JavaScript? (Composing Software)
• 3. A Functional Programmer’s Introduction to JavScript: A Functional Programmer’s Introduction to JavaScript (Composing Software)
• 4. Higher Order Functions: [Higher Order Functions (Compos