jsteenkamp

// Reducers are prue functions that implement the update logic of the applications
// Reducers define how to calculate the next State from the current State and the dispatched Action
// Reducer function returns the current State if not Action is performed.
// Redux passes the new State to each component and React re-renders them.
// Reducers are typically called by Container components. Container components do not emit DOM (so they
// do not have any associated CSS)

const todo = (state, action) => {
  switch (action.type) {
    case 'ADD_TODO':

jsteenkamp

/*
  Using one-way data bindings may offer an easy way to make sure such reassignments don't happen by accident. 
  If the component indeed does reassign the value on purpose, an explicit output binding should be used instead 
  of piggybacking on the two-way input.
  
  - Replace a two-way '=' binding on the directive configuration with an expression binding '&'.
  - Change all accesses to the binding inside the component to function calls.
  
  http://teropa.info/blog/2015/10/18/refactoring-angular-apps-to-components.html
  

jsteenkamp

'use strict';

// Solution using ES6 block scope

var list = document.createElement('UL');

for (var i = 1; i <= 5; i++) {

  var item = document.createElement('LI');
  item.appendChild(document.createTextNode('Item ' + i));

jsteenkamp

/**
* This module is a variant which supports document.write. If you need document.write use this instead
* Author: Deepak Subramanian @subudeepak(https://github.com/subudeepak)
* Distributed under MIT License
*/
/*global angular */
(function (ng) {
  'use strict';
    app.directive('script', function() {
    return {

jsteenkamp

'use strict';

import _ from 'lodash';

// generate some list items

let items = _.times(10).map((n) => {
  return {
    title: `This is log item ${n + 1}`,
    description: `This is item description ${n + 1}`

jsteenkamp

// create an element to attach to document
var d = document.createElement('div');

// take heap snapshot and filter on 'detached' will show the above node
// now attach element to document
document.body.appendChild(d);

// take heap snapshot and the detached node is no longer listed
// you can look at diff between two snapshots and see it has been added to HTMLBodyElement

jsteenkamp

*** see http://www.quora.com/What-are-some-advanced-JavaScript-techniques-that-you-dont-see-often-but-should ***


*** Don't do this ***

function MyClass() {} 
    MyClass.prototype.method1 = function () { ... };
    MyClass.prototype.method2 = function () { ... };
    // ...  
    MyClass.prototype.methodN = function ()  { ... };

jsteenkamp

'use strict';

// vendor modules
import angular from 'angular';
import 'angular-touch';
import 'angular-animate';
import 'angular-aria';
import 'angular-ui-router';

// app modules

jsteenkamp

$ nano ~/.bash_rc

function dsclean() {
  if [ -f $1 ]
  then
    echo "Delete __MACOSX folder from $1"
    zip -d "$1" __MACOSX*
    echo "Delete all .DS_Store folders from $1"
    zip -d "$1" \*.DS_Store
  fi

jsteenkamp

{
  pen: {
    "defaultAJAXTimeout": 10000,
    "failedRequestMsg": "Unable to reach CodePen.io. Please contact support@codepen.io",
    "auto_run": true,
    "checksum": 1415964482,
    "created_at": "2015-01-26T19:05:43Z",
    "css": "",
    "css_external": "",
    "css_pre_processor": "none",