jcreamer898

const whatHasUpdated = (instance, props, state) => {
  const changed = (obj, comparedTo) => Object.keys(obj).reduce((memo, key) => {
    if (comparedTo[key] !== obj[key]) {
      memo.push({
        key,
        old: comparedTo[key],
        new: obj[key],
      });
    }

jcreamer898

import stringify from "json-stringify-safe";
import clone from "lodash/clone";
import each from "lodash/each";
import find from "lodash/find";
import camelCase from "lodash/camelCase";

const _ = {
  clone, each, find, camelCase,
};

jcreamer898

// event bus as dispatcher
// actions.js
module.exports = {
  addItem: (item) => {
    Bus.trigger("item.added", {
      item: item
    });
  },
  removeItem: (item) => {
    Bus.trigger("item.removed", {

jcreamer898

{
  "clusters": {
    "destinations": {
      "version": "0.90.10",
      "config": {
        "cluster": {
          "name": "destinations_development"
        },
        "path": {
          "data": "tmp/elasticsearch",

jcreamer898

<div class="parent">
 <div class="child"></div>
 <div class="child"></div>
 <div class="child"></div>
 <div class="child"></div>
 <div class="child"></div>
</div>

jcreamer898

// app.js
React.render(App({
	initialData: window.initialData
}));

// app.jsx
var App = React.createClass({

jcreamer898

Trigger

Instead of n number of arguments, use the "envelope" pattern to pass an object instead.

define(function(require)
  var LPE = require("LPE")
  
  LPE.on("card.render", function(data) {
 // use data

jcreamer898

JavaScript Architecture for the 23rd Century

Centuries ago when JavaScript was a browser toy to flash things around on the page, the need for architecture in JavaScript was non existent. You could simply throw some jQuery into a file, or even just in an embeded script tag on the page and you'd have what you need.

Centuries later in the 23rd century, Stardate 1312.4, the need for architecture is critical in creating long term JavaScript Applications that will survive a 5 year mission into deep space.

First we will step back in time to talk about the constructor pattern, and move forward through time into other useful patterns such as modules, and namespacing. Then move into talking about organizational strategies as well as AMD and Browserify.

Finally we'll talk more about JavaScript in the 24th century with ES6 classes and how we can utilize them today with Traceur. Cadets who attend this session will learn:

jcreamer898

var hljs=new function(){function m(p){return p.replace(/&/gm,"&amp;").replace(/</gm,"&lt;")}function c(r){for(var p=0;p<r.childNodes.length;p++){var q=r.childNodes[p];if(q.nodeName=="CODE"){return q}if(!(q.nodeType==3&&q.nodeValue.match(/\s+/))){break}}}var b=(typeof navigator!=="undefined"&&/MSIE [678]/.test(navigator.userAgent));function i(t,s){var p="";for(var r=0;r<t.childNodes.length;r++){if(t.childNodes[r].nodeType==3){var q=t.childNodes[r].nodeValue;if(s){q=q.replace(/\n/g,"")}p+=q}else{if(t.childNodes[r].nodeName=="BR"){p+="\n"}else{p+=i(t.childNodes[r])}}}if(b){p=p.replace(/\r/g,"\n")}return p}function a(s){var r=s.className.split(/\s+/);r=r.concat(s.parentNode.className.split(/\s+/));for(var q=0;q<r.length;q++){var p=r[q].replace(/^language-/,"");if(f[p]||p=="no-highlight"){return p}}}function d(r){var p=[];(function q(t,u){for(var s=0;s<t.childNodes.length;s++){if(t.childNodes[s].nodeType==3){u+=t.childNodes[s].nodeValue.length}else{if(t.childNodes[s].nodeName=="BR"){u+=1}else{if(t.childNodes[s].no

jcreamer898

(function(module) {
   
// Define a controller constructor
// This looks like a plain JavaScript function
function HomeCtrl(service, $location) {
    this.service = service;
    this.$location = $location;
    
    this.initialize();
}