Life Cycle Quest

App.js

import React, { Component } from 'react';

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

  setTimer () {
    this.setState({count : this.state.count + 1})
    if (this.state.count >= 20) {
      alert('Boom ! Bitch !')
      this.state.count = 0;
    }
  }

  componentDidMount() {
    setInterval(this.setTimer.bind(this), 1000);
  }

  componentWillUpdate() {
    console.log('Le composant va se mettre à jour');
  }

  render() {
      return (
          <div>
            <img src="https://wildcodeschool.fr/wp-content/uploads/2017/01/logo_orange_pastille.png" alt="wild" />
            <p>Attention ! Ca va péter dans {this.state.count}...</p>
          </div>
      );
  }
}


export default Timer;

Timer.js

import React, { Component } from 'react';

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

  setTimer () {
    this.setState({count : this.state.count + 1})
    if (this.state.count >= 20) {
      alert('Boom ! Bitch !')
      this.state.count = 0;
    }
  }

  componentDidMount() {
    setInterval(this.setTimer.bind(this), 1000);
  }

  componentWillUpdate() {
    console.log('Le composant va se mettre à jour');
  }

  render() {
      return (
          <div>
            <img src="https://wildcodeschool.fr/wp-content/uploads/2017/01/logo_orange_pastille.png" alt="wild" />
            <p>Attention ! Ca va péter dans {this.state.count}...</p>
          </div>
      );
  }
}


export default Timer;