c7deb5a0d1
I did this as a warm-up to using [React hooks](https://reactjs.org/docs/hooks-intro.html), which provide a better way to accomplish stateful things and side effects using functional components. This allows all components to be written in the same style, improves testability, facilitates code reuse, etc. There's [a intro here](https://reactjs.org/docs/hooks-intro.html) which links to [Dan's talk at React Conf](https://www.youtube.com/watch?time_continue=3599&v=dpw9EHDh2bM) which does a really good job of explaining why hooks are a good way to write components. He describes hooks as being the electrons and neutrons to components which are atoms. Low-level functionality which was always there in React, though not as accessibly or visibly. This adds a lint rule that enforces "the rule of hooks" which says they have to be declared at the top level in the functional component. I don't think this changeset does a fabulous job of showing off the improvements hooks allows, though I think it is still a good direction for this code.
29 lines
452 B
YAML
29 lines
452 B
YAML
env:
|
|
browser: true
|
|
|
|
plugins:
|
|
- import
|
|
- react-hooks
|
|
|
|
parser: 'babel-eslint'
|
|
|
|
parserOptions:
|
|
sourceType: 'module'
|
|
|
|
extends:
|
|
- 'standard-jsx'
|
|
- 'standard-react'
|
|
- './.eslintrc.yml'
|
|
|
|
settings:
|
|
react:
|
|
version: '16.4'
|
|
|
|
rules:
|
|
no-console: 'error'
|
|
|
|
import/extensions: ['error', 'never', { 'json': 'always', 'yml': 'always' }]
|
|
react/jsx-sort-props: 'error'
|
|
react-hooks/rules-of-hooks: 'error'
|
|
react-hooks/exhaustive-deps: 'error'
|