Home.jsx

import React, {Component} from 'react'

import Modal from '../components/Modal'

class Home extends Component {
  constructor () {
    super()
    
    this.openModal = this.openModal.bind(this)
    this.closeModal = this.closeModal.bind(this)
  }

  state = {isContactModalOpen: false}
  
  openModal() {
    this.setState({isContactModalOpen: true})
  }
  
  closeModal () {
    this.setState({isContactModalOpen: false})
  }

  render () {
    const {isContactModalOpen} = this.state
    
    return (
      <div>
        {isContactModalOpen && <Modal onClose={this.closeModal} />}

        <h1>Hello world!</h1>

        <hr />

        <p>What a beautiful day to learn about React's state—don't you think?</p>
        
        <hr />
        
        <button onClick={this.openModal}>Get in touch</button>
      </div>
    )
  }
}

export default Home