Stateful vs. Stateless

statefull.stateless.js

// https://stackoverflow.com/a/49920844

// Stateless
const ProjectListComponent = (props) => {
  const { handleClick } = props
  return (
    <button onClick={handleClick}>Click me</button>
  )
}

class AppComponent extends Component {
  handleClick() {
    console.log('clicked')
  }

  render() {
    return (
      <ProjectListComponent onClick={this.handleClick} />
    )
  }
}

// Stateful
class ProjectListComponent extends Component {
  handleClick() {
    console.log('clicked')
  }

  render() {
    return (
      <button onClick={this.handleClick}>Click me</button>
    )
  }
}