JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://fb.me/react-with-addons-0.14.6.js"></script>
<script src="https://fb.me/react-dom-0.14.6.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="react-wrapper"></div>

CSS

@import url(https://fonts.googleapis.com/css?family=Poiret+One);

#wrapper {
    width: 300px;
    border: 2px solid #d5d5d5;
}

#display {
    height: 40px;
    line-height: 40px;
    font-size: 2em;
    font-family: 'Poiret One';
    border: 2px solid #d5d5d5;
    border-bottom: 4px solid #d5d5d5;
    text-align: right;
    padding: 0px 10px;
}

#clearDisplay {
    width: 98%;
    margin: 1% 1%;
    letter-spacing: 5px;
    font-size: 1.5em;
    font-family: 'Poiret One';
}

.btn {
    width: 23%;
    margin: 1%;
    font-size: 2em;
    font-family: 'Poiret One';
    transition: .3s;
}

.btn:hover {
    transform: scale(1.1);
}

JavaScript 1.7

var layout = [
	['7', '8', '9', '/'],
    ['4', '5', '6', '*'],
    ['1', '2', '3', '-'],
    ['0', '.', '=', '+']
]

var Button = React.createClass({
	handleClick: function() {
    	this.props.handleClick(this.props.value);
    },

	render: function() {
    	return (
        	<button className={'btn'} onClick={this.handleClick}>{this.props.value}</button>
        )
    }
});

var Calc = React.createClass({
	getInitialState: function() {
    	return { 'stash': '', 'stashed': false, 'display': '' }
    },
    
    clear: function() {
    	this.setState({ 'stash': '', 'stashed': false, 'display': '' });
    },
    
	handleClick: function(value) {
        if (value === '=') {
        	var result = eval(this.state.display);
            this.setState({ 'stash': result, 'stashed': true, 'display': result });
        }
        else if (this.state.stashed && '/*-+'.split('').indexOf(value) === -1)
        	this.setState({ 'stashed': false, 'display': value });
        else this.setState({ 'stashed': false, 'display': this.state.display += value });
    },
    
	render: function() {
    	var self = this,
        	buttons = layout.map(function(row, i) {
            	var r = row.map(function(btn) {
                	return <Button
                    	key={btn}
                        value={btn}
                        handleClick={self.handleClick} />
                });
            	return <div key={i}>{r}</div>
            });
    	return (
        	<div id={'wrapper'}>
            	<div id={'display'}>{this.state.display}</div>
                <button id={'clearDisplay'} onClick={this.clear}>clear</button>
            	{buttons}
            </div>
        )
    }
})

ReactDOM.render(
	<Calc />,
    document.getElementById('react-wrapper')
)