JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fb.me/react-with-addons-0.8.0.js"></script>
<script src="http://fb.me/JSXTransformer-0.8.0.js"></script>
<div id="temp_converter"></div>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

input {
    width: 6em;
    text-align: right;
}

JavaScript 1.7

var TemperatureConverter = React.createClass({
	getInitialState: function() {
		return {c: 0, f: 0}
	},
	render: function() {
		var celciusValueLink = {
			value: this.state.c.toString(),
			requestChange: this.onCelsiusChange
		}
		var fahrenheitValueLink = {
			value: this.state.f.toString(),
			requestChange: this.onFahrenheitChange
		}
		return <div>
			<input type="number" valueLink={celciusValueLink}/>°C
			<span> ⇄ </span>
			<input type="number" valueLink={fahrenheitValueLink}/>°F
		</div>
	},
	onCelsiusChange: function(data) {
		this.setState({c: data, f: c2f(parseFloat(data))})
	},
	onFahrenheitChange: function(data) {
		this.setState({c: f2c(parseFloat(datadata)), f: data})
	}
})



function c2f(c) {
    return 1.8 * c + 32;
}
function f2c(f) {
    return 0.5555555555555 * (f - 32);
}

React.renderComponent(
    <TempConverter/>,
    document.getElementById('temp_converter')
);