dijs

JSX can get messy fast.

I was recently introduced to writing smart and dumb components when using react. As an extension to keeping the presentation code strictly within dumb components, I try to write one line JSX.

Original JSX (NOT ONE LINE JSX):

class SomeListComponent {
  render() {
 let names = this.props.names.map(({first, last}) => {

dijs

Here is my simple example:

class Speaker {
  constructor(name) {
   this.name = name 
  }  
  say(msg) {
    console.log(`${this.name}: ${msg}`)
 }

dijs

import 'babel-polyfill'
import Wiki from './dist/wiki'
import Knwl from 'knwl.js'

let knwlInstance = new Knwl('english')
knwlInstance.register('dates', require('./node_modules/knwl.js/default_plugins/places'));

let wiki = new Wiki({
  uri: 'http://jamesbond.wikia.com/api.php'
})

dijs

Continuous Improvement: Development with ES(6-7) / React / Redux

ES(6-7)

• Adopt on the technology radar from Thoughtworks
• More functional, easier to follow techniques (async/await)
• No more waiting for new code features with Babel.io
• New techniques promote better predictability and reusable code
• Demo
• All features https://ponyfoo.com/articles/es6

dijs

link-grammar-5.3.1  build configuration settings

	prefix:                         /usr/local
	C compiler:                     gcc  -DUSE_SAT_SOLVER=1 -DHAVE_SQLITE=1 -g -O2 -O3 -std=c99 -D_BSD_SOURCE -D_SVID_SOURCE -D_GNU_SOURCE -D_DEFAULT_SOURCE -arch x86_64
	C++ compiler:                   g++  -DUSE_SAT_SOLVER=1 -DHAVE_SQLITE=1 -g -O2 -O3 -Wall -std=c++03
	autopackage relocatable binary: no
	Posix threads:                  no
	Editline command-line history:  no
	UTF8 editline support:          no
	Java libraries:                 no

dijs

Undefined symbols for architecture x86_64:
  "std::__1::__vector_base_common<true>::__throw_length_error() const", referenced from:
      std::__1::vector<int, std::__1::allocator<int> >::__append(unsigned long) in libsat-solver.a(sat-encoder.o)
      void std::__1::vector<PositionConnector*, std::__1::allocator<PositionConnector*> >::__push_back_slow_path<PositionConnector* const>(PositionConnector* const&) in libsat-solver.a(sat-encoder.o)
      void std::__1::vector<std::__1::pair<PositionConnector const*, PositionConnector const*>, std::__1::allocator<std::__1::pair<PositionConnector const*, PositionConnector const*> > >::__push_back_slow_path<std::__1::pair<PositionConnector const*, PositionConnector const*> const>(std::__1::pair<PositionConnector const*, PositionConnector const*> const&) in libsat-solver.a(sat-encoder.o)
      void std::__1::vector<WordTag, std::__1::allocator<WordTag> >::__push_back_slow_path<WordTag const>(WordTag const&) in libsat-solver.a(sat-encoder.o)
      WordTag::WordTag(WordTa

dijs

Redux is done a bit differently...

Containers

• Fetch data
• Manage data
• Show fetching errors, loading, and UI
• Compose these

Components (Dumb)

• Only use props for data

dijs

ES7's async/await is awesome!

But, in order to use it well, you need to think in promises.

First thought:

async function something() => {
  let state = []
 await [1, 2, 3].forEach(async(n) => {

dijs

Conditional Chains

This Gist was automatically created by Carbide, a free online programming environme

dijs

function get(obj, path, def) {
  const parts = path.split('.');
  const [first,] = parts;
  const value = obj[first];
  if (parts.length === 1) {
    return value || def;
  }
  return get(value, parts.slice(1).join('.'), def);
}