React example

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import registerServiceWorker from './registerServiceWorker';

class Clock extends React.Component{
    constructor(props) {
        super(props);
        this.state = { date: new Date(), clicks: 0 };
        this.incrementItem = this.incrementItem.bind(this);
    }
    componentDidMount() {
        this.timerID = setInterval(
            () => this.tick(),
            1000
        );
    }
    tick() {
        this.setState({ date: new Date() });
        
    }
    incrementItem(){
        this.setState({ clicks: this.state.clicks + 1 });
    }
    render(){
        return(
            <div>
                <h1>Hello, {this.props.name}!</h1>
                <h2>It is {this.state.date.toLocaleTimeString()}</h2>
                <button onClick={this.incrementItem}>Click to increment by 1</button>
                <h3>{this.state.clicks}</h3>
            </div>
        )
    }
}
const element = (
    <div>
        <Clock name="alex" />
        <Clock name="jon" />
        <Clock name="thomas" />
    </div>
);


ReactDOM.render(element, document.getElementById('root'));