# ES6 React Component lifecycle

## Known React lifecycle events

#### The React lifecycle will go through these cycles:

- Mounting
- Updating
- Unmounting

Event | ES5 | ES6 | Description | When
--- | --- | --- | --- | ---
Mounting
getInitialState | ✓ | ✗ | Returns initial state | Once
getDefaultProps | ✓ | ✗ | Returns initial props | Once (cached)
componentWillMount | ✓ | ✓ | your before-component is mounted functionality | Once
render | ✓ | ✓ | Returns HTML to render ##### Example from this component
    <button className="btn btn-primary"
    onClick={this.increment}>
    Clicked {this.state.count} time{(this.state.count>1 || this.state.count===0) ? 's' : ''}
    </button>
| Every time
componentDidMount | ✓ | ✓ | called after component has been rendered in DOM | Once
Updating
componentWillReceiveProps | ✓ | ✓ | called before render when props is about to change | Prop changes
shouldComponentUpdate | ✓ | ✓ | stop rendering by returning `false` | Before render
componentWillUpdate | ✓ | ✓ | Just before `render` this method is ivoked | Immediately before render
componentDidUpdate | ✓ | ✓ | Just after `render` this method is ivoked | Immediately after render
Unmounting
componentWillUnmount | ✓ | ✓ | Just before the component is removed from DOM | Once