== Why is this an issue?

The following order represents what is commonly expected by ReactJS developers. 

Not following this convention has no technical impact, but will reduce the class's readability because most developers are used to this standard order.


1. ``++static++`` methods

2. the ``++constructor++``

3. ``++getChildContext()++``

4. ``++componentWillMount()++``

5. ``++componentDidMount()++``

6. ``++componentWillReceiveProps()++``

7. ``++shouldComponentUpdate()++``

8. ``++componentWillUpdate()++``

9. ``++componentDidUpdate()++``

10. ``++componentWillUnmount()++``

11. clickHandlers or eventHandlers such as ``++onClickSubmit()++`` or ``++onChangeDescription()++``

12. getter methods for render such as ``++getSelectReason()++`` or ``++getFooterContent()++``

13. optional render methods such as ``++renderNavigation()++`` or ``++renderProfilePicture()++``

14. ``++render()++``


=== Noncompliant code example

[source,javascript]
----
export default class MyApp extends React.PureComponent {

  render() { // Noncompliant
  }
  ...
  componentDidMount() {
  }
}
----


=== Compliant solution

[source,javascript]
----
export default class MyApp extends React.PureComponent {

  componentDidMount() {
  }
  ...
  render() {
  }
}
----


ifdef::env-github,rspecator-view[]
'''
== Comments And Links
(visible only on this page)

=== on 7 Feb 2018, 12:53:52 Alexandre Gigleux wrote:
Reference: \https://hackernoon.com/reactjs-component-lifecycle-methods-a-deep-dive-38275d9d13c0

=== on 23 Feb 2018, 11:41:04 Alexandre Gigleux wrote:
This rule is covered by ESLint for React: \https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/docs/rules/sort-comp.md (react/sort-comp)

endif::env-github,rspecator-view[]
