Skip to content

Instantly share code, notes, and snippets.

@twerp
Created January 31, 2018 17:20
Show Gist options
  • Save twerp/cd7cfbbb55f24de05d4fe75288909a68 to your computer and use it in GitHub Desktop.
Save twerp/cd7cfbbb55f24de05d4fe75288909a68 to your computer and use it in GitHub Desktop.
Most simple React component using ES6 class & JSX
<div id="root"></div>
<script src="https://unpkg.com/react@16.2.0/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.2.0/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6.26.0/babel.js"></script>
<script type="text/babel">
class Button extends React.Component {
constructor() {
super(); this.state = { count: 0 }
}
updateCount() {
this.setState((prevState, props) => {
return { count: prevState.count + 1 } })
}
render() {
return (<button onClick={() => this.updateCount()}>
Klikattu {this.state.count} kertaa
</button>) }
}
const rootElement = document.getElementById('root')
const element = <Button />
ReactDOM.render(element, rootElement)
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment