sebmarkbage

React (Virtual) DOM Terminology

In React's terminology, there are five core types that are important to distinguish:

• ReactElement / ReactElement Factory
• ReactNode
• ReactComponent / ReactComponent Class

React Elements

mathisonian

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details: mathisonian/requirify#5

inspiration

sebmarkbage

React Element Factories and JSX

You probably came here because your code is calling your component as a plain function call. This is now deprecated:

var MyComponent = require('MyComponent');

function render() {
 return MyComponent({ foo: 'bar' }); // WARNING

constantology

// use like this:
// process.emit( 'app:log', module, arg1, arg2, ..., argN );

var Module = require('module');

function logConsole(method, module) {
  var args = [(new Date()).toJSON(), method];
  var index = 1;

  if (module instanceof Module) {

d-ronnqvist

If you've haven't seen it before, there is a cool accessibility feature in UITableView that allows the user to toggle between different actions. It's really very elegant and it's a powerful and convenient implementation for VoiceOver users on iOS. One could say that it's the VoiceOver version of the swipe-to-delete feature.

To try it out yourselves, open one of the built in apps like Mail or Notes and turn on VoiceOver. If you are afraid to accidentally delete some of your important notes or email, you can also create a new Master-Detail Application in Xcode and run it on your device. Navigate to one of the cells and use the "Rotor" (rotate with two fingers on the screen) to find the "Actions" item. Now you can swipe up and down do toggle between "Activate Item (default action)" and "Delete". If you now double tap, the cell gets deleted instead of selected.

This is the default behavior and you get this accessibility out of the box with UITableView.

insin

var INPUT_TYPES = 'color|date|datetime|datetime-local|file|month|number|password|range|search|tel|text|time|url|week'.split('|')

var App = React.createClass({
  getInitialState: function() {
    return {}
  },

  onChange: handleFormInputChange,

  render: function() {

STRd6

Hamlet Spec

Tags

Tags map directly to the DOM tag with that name. If the tag is omitted it is assumed to be a div.

h1

spoike

var EventEmitter = require('events').EventEmitter,
    _ = require('lodash');

/**
 * Creates an action functor object
 */
exports.createAction = function() {

    var action = new EventEmitter(),
        eventLabel = "action",

staltz

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

---

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

---

alexshafran

#Collections in Swift

Arrays and dictionaries are the most common data stores in many applications. Swift has brought us a new generation of these collections, so let's take a look at how they compare to the collections found in Objective-C.

##Greatest Differences

###Typing One of the most obvious differences between collections in Objective-C and Swift is that Swift collections are explicitly typed. Typed collections are useful for many reasons, primarily because the system requires you to be precise with the content type you are working with. Any type mismatches will throw errors, which will help you avoid common mistakes.

###Mutability