JSFiddle - React, Tailwind, and code Playground

by Rabinarayan Biswal

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.js"></script>
<div id="app">
  
</div>
<script type="text/babel">
(function() {   
	var BoxSetup = React.createClass({

		clicked : "",

		getInitialState : function () {
			return { clickCount : 0};
		},

		handleDivClick : function (event) {
			if (this.clicked !== "Button") {
				window.location.href = "http://www.google.com";
			}

			// reset
			this.clicked = "";
		},
		
		handleButtonClick : function (event) {
		   this.clicked = "Button"
		   this.setState({
				clickCount : ++this.state.clickCount
		   });
		},

		render : function () {

			return (
			<div>
				<div onClick={this.handleDivClick} style={ { }}>
					<div style={ { width : "100px", height : "100px", border : "1px solid red" } }>
						<h2 className="title">{ this.state.clickCount }</h2>
						<button onClick={this.handleButtonClick}> Like </button>
					</div>
				</div>
			</div> 
			);
		}
	});

	var element = React.createElement(BoxSetup, { title : "Hello" });

	ReactDOM.render(element, document.getElementById("app"));    
})();
</script>