use controlled component paradigm for text input

[splendido]

I've just started to read about React and how to integrate it with Meteor.
Reading the Facebook's react tutorial (the one suggested at step 2 of the 'Todo app with React' tutorial for Meteor) it seems the suggested way to deal with input elements is using Controlled Components.
You can read about in this section.

This PR changes the example code to use that paradigm avoiding the use of React.findDOMNode and (possibly) simplifying a little the code.
In case you'd like to accept these changes, the text for the tutorial should be changed accordingly possibly making reference to Controlled Components so that people starting to lear React from Meteor get pointed to the right direction.

[stubailo]

Ah, this is basically the idea of storing the input's value in your own state variable, and reading from that instead of the value of the input field itself. I guess this means React can manage the state of the input instead of the browser, which could be nice.

If React's docs recommend doing things this way, we should surely change them in our tutorial as well.

@yyx990803 do you have plans for updating the React tutorial? Perhaps we could fold this in?

Thanks for the heads up, @splendido!

[splendido]

What they say is (for the React diffing algo I guess...) it is better to have the actual DOM always in sync with the virtual one and with controlled components you actually get a read-only input fields which value is always taken from the component's state.

This is at least my understanding for their sentence:

With the traditional DOM, input elements are rendered and the browser manages the state (its rendered value). As a result, the state of the actual DOM will differ from that of the component. This is not ideal as the state of the view will differ from that of the component. In React, components should always represent the state of the view and not only at the point of initialization.