sranso

for .. in

• mdn
• doesn't execute in order

when order matters, use...

• _.each
• a generic for loop
• [].forEach as long as it's polyfilled

sranso

/**
 * @jsx React.DOM
 */

var Body = React.createClass({
  handleClick: function() {
    return 'we\'re plotting, baby!';
  },

  renderSitting: function() {

sranso

• proxy server is a computer that intercepts messages and passes them to the appropriate server / port read more
• A proxy server, also known as a "proxy" or "application-level gateway", is a computer that acts as a gateway between a local network (e.g., all the computers at one company or in one building) and a larger-scale network such as the Internet. Proxy servers provide increased performance and security.

sranso

#react talk for brooklynjs

##what is react

• javascript library for building user interfaces
• (should i talk about mvc here?)
• uses a virtual dom diff implementation -- essentially, when you React.createClass this class (say, Hero) will return some html -- very DOM-like. then when this component is rendered, React uses its virtual DOM (is it stores virtual DOM) to figure out where it needs to insert this new html in order to make the virtual DOM === real DOM
• one-way data flow -- essentially, React classes have props -- which are like pieces of data. these props are passed down from one component to the next, the goal being a) it's easier to follow the data flow b) keeps things modular c) fast -> versus two-way data binding -> example

sranso

visual blocks in vim

:'<,'> w outfile.hbs visual block, and then hit w for write and then the place i want it to go, like outfile.hbs :'<,'> ! python -mjson.tool :'<,'>s/change/tothis/g

'<,'> represents the selected text ! says run a shell command

and the python module json.tool can be run like that it takes stdin and prints formatted json as stdout

sranso

#append in jquery just learned that you can only append a jquery array, not a single object in that array.

for example $('#myh1').append('<h2>hi, h1. i am now your child.</h2>'); works. this, on the other hand, does not: $('#myh1')[0].append('<h2>hi, h1. i am not your child. i will make jquery unhappy.</h2>'); it will return TypeError: undefined is not a function because append is not a funciton on an individual item. must be in array.

sranso

Team Shabu, AKA the web team, works almost entirely in Javascript. One function we use often is bind. Let's take a little lookskis at what's going on here.

Here's a simple example of how you might use bind:

var obj = {
  foo: function() {
    console.log(this);
    this.name = 'baz';
    (function() {
 console.log('inside func');

sranso

overall

• css transform property lets you modify the coordinate space of the css visual formatting model.
• elements can be ______ according to values set ⋅⋅* translated ⋅⋅* rotated ⋅⋅* scaled ⋅⋅* skewed
• you can almost think of transform as an "umbrella" property that says to the interpreter: "hey, something about the coordinate space of the css visual formatting model is gonna change. i'll tell you waht it is in in the k thx"

syntax

sranso

CSS Transitions

• allow property changes to take place over a period of time

what's animatable?

• list of animatable properties
• the properties need an initial state in order to change from something to something. ⋅⋅* b/c of this, be careful when transitioning on an object that was just added to the DOM. use setTimeout()

how to animate

• the property needs an initial transition -- where you define and control how the property will change -- and then the transform description on the "new state" (e.g. .box:hover or .box.animate-me)

sranso

var object = {
  levelOne: function(activity, emotion) {
    console.log('we\'re playing', activity, 'and we feel', emotion, 'about it.')
  }
}

object.levelOne('baseball', 'bored');
//>> we're playing baseball and we feel bored about it. 
 
object.levelOne.apply(this, ['baseball', 'bored']);