Setting the initial state

Firstly, we define the initial state by creating a constructor method. This method will be called when an instance of the class is created:

In our case, constructor(props) will be called when a React component is created from our class:

class Timer extends React.Component {
  constructor (props) {

Because we are extending React.Component, which has its own constructor(props) method, we have to call super(props) to ensure that React's constructor also gets called, letting React know about the properties:

super(props)

Now, we can define the initial state by writing to this.state:

    this.state = {
      seconds: 0
    }
  }

Then, we modify the render() method to pull seconds from this.state instead of this.props:

  render () {
    const { seconds } = this.state
    return <h1>You spent {seconds} seconds on this page!</h1>
  }