React Base Fiddle (JSX)

Starting point for creating JSFiddles with React.

by aninaslyan

HTML

<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

Babel + JSX

const Button = props => {
  const { kind, children, ...other } = props;
  const className = kind === "primary" ? "PrimaryButton" : "SecondaryButton";
  console.log(other);
  console.log(props);
  return <button className={className} {...other}>{children}</button>;
};

const App = () => {
	function func() {
  	console.log("clicked!")
  }

  return (
    <div>
      <Button kind="primary" onClick={func}>
        <p>Hello World</p>
      </Button>
    </div>
  );
};

ReactDOM.render(
  <App />,
  document.getElementById('container')
);