Understanding Hooks

The two components below do the same job. Each renders a button that counts its own clicks, and after two clicks each one shows "Clicked 2 times". The first is written as a class, the older way to write a React component that has to remember a value. The second is a function component that calls useState.

import { Component } from 'react';

class ClassCounter extends Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    this.setState({ count: this.state.count + 1 });
  }