Soylent: What Happened When I Went 30 Days Without Food

Soylent exists for efficiency. I can appreciate that. Like I said, it’s been useful. But for me, maybe for most, the implementation of Soylent most likely hints at a lifestyle of overwhelming work… whether we realize it or not. The process of eating solid food creates space, breathing, and slowness. It creates perspective.

Component Block Module
Element Element ?
Layout ? Layout
Variant Modifier Theme & State

Codestyle additions

Favor map() over forEach() when you can. Avoid side-effects.

Favor Array.from(...) instead of [] to create array from array-like object

Defaults in ES6 destructuring assignment

const { msg = 'Hi' } = this.props`

Node v4.0.0 (Stable) | Node.js

V8 v4.5
44 collaborators, 15 from Technical Steering Committee (TSC)

  • block scoping (let, const)
  • classes
  • typed arrays
  • generators
  • promises
  • symbols
  • template strings
  • collections (Map, Set, etc.)
  • arrow functions

regular release cycle

Javascript variables as keys for objects

Called Object Literal Computed Property Keys

let foo = "b"
let obj = {
  a: "A",
  [foo]: "B"
} // => { a: "A" b: "B" }

CLI globs eslint lib/**/*.js

!!! Autofixing --fix

New rules:

  • jsx-quotes
  • require-jsdoc
  • global-require
  • no-restricted-syntax
  • space-before-keywords
npm i eslint@1.4.x
./node_modules/.bin/eslint app/scripts/**/*.jsx --fix

I experienced errors like TypeError: Cannot read property 'text' of null. To find a culprit:

for f in app/scripts/**
  if [ ${f: -4} == ".jsx" ]
    print "=== $f ==="
    ./node_modules/.bin/eslint $f --fix

Found out that there is ES6 Called Object Literal Computed Property Keys in one file. Needed to install and use babel-eslint

npm i -S babel-eslint

Add to .eslintrc

    "parser": "babel-eslint",


Why filename webpack.config.babel.js?
Enable Babel compilation when running webpack from CLI


  "stage": 0,
  "optional": ["runtime"]

.eslintrc can be in YAML

There is dev-server.js

Interesting dependencies:

  • axios - HTTP client with promises, like Angular $http
  • json-server - API mock
  • key-mirror - simplify creating constants
  • react-mixin - mixins in react with es6 style classes
  • react-redux
  • husky - Prevents bad commit or push


<script>var __INITIAL_STATE__ = <%= initialState %>;</script>

Dynamic Pricing Tool for Airbnb

something you don’t offer is a terrible idea, until you offer it yourself, at which point you explain why your solution is the first to get it right.

Inline preview of links to social media