import React, { Component } from 'react';

export class Counter extends Component {
  displayName = Counter.name

  constructor() {
    super();
    this.state = { currentCount: 0 };
  }

  incrementCounter() {
    this.setState({
      currentCount: this.state.currentCount + 1
    });
  }

  render() {
    return (
      <div>
        <h1>Counter</h1>

        <p>This is a simple example of a React component.</p>

        <p>Current count: <strong>{this.state.currentCount}</strong></p>

        <button onClick={() => this.incrementCounter()}>Increment</button>
      </div>
    );
  }
}

import React, { Component } from 'react';

export class Counter extends Component {
  displayName = Counter.name

  constructor() {
    super();
    this.state = { currentCount: 0 };
    this.incrementCounter = this.incrementCounter.bind(this);
  }

  incrementCounter() {
    this.setState({
      currentCount: this.state.currentCount + 1
    });
  }

  render() {
    return (
      <div>
        <h1>Counter</h1>

        <p>This is a simple example of a React component.</p>

        <p>Current count: <strong>{this.state.currentCount}</strong></p>

        <button onClick={this.incrementCounter}>Increment</button>
      </div>
    );
  }
}

Align class event handler creation with React docs
Align class event handler creation with React docs

This is small change to align example React app with current advised way of assigning
event handlers that are declared as ES6 class methods:
https://reactjs.org/docs/handling-events.html

Thanks!
