Create requirements checklist for frontend framework

[crcommons]

• [ ] Style guide
  • [ ]Component style and structuring: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 -- read it; understand it; believe it. Example: https://gist.github.com/chantastic/fc9e3853464dffdb1e3c
  • [x]JS styling linter rules: https://github.com/airbnb/javascript
  • [x] React styling rules: https://github.com/airbnb/javascript/tree/master/react or https://github.com/vasanthk/react-bits
  • [ ]commit styling: https://commitizen.github.io/cz-cli/
• [ ] File structure
  • Combine container and components is ok, but see above.
  • Test next to component files
  • Structure based on functionality https://www.lucidchart.com/documents/edit/3d9139cc-980f-452d-8477-8ab8a69b2a59/0?shared=true&docId=3d9139cc-980f-452d-8477-8ab8a69b2a59
• [ ] redux requirements
  • [ ] form state: https://github.com/erikras/redux-form
  • [ ] reselect: https://tonyhb.gitbooks.io/redux-without-profanity/content/transforming_state_per_component.html
  • [ ] normalizer for nested data: https://github.com/paularmstrong/normalizr
  • [ ] redux-thunk to handle async; potentially sagas, but they seems overly complicated for now.
• [x] http requests: fetch

[rjmackay]

File structure is probably the important bit. And TBH we're likely to get it wrong first try I'd suggest something like https://marmelab.com/blog/2015/12/17/react-directory-structure.html

For redux we can start with https://tonyhb.gitbooks.io/redux-without-profanity/content/architecture.html as reasonable recommendations. Though we definitely don't need to use all of it.

[rjmackay]

https://github.com/developit/preact-redux

[rjmackay]

This might be a follow up task

• Pre commit hooks to run linting
  • https://github.com/okonet/lint-staged
  • https://github.com/observing/pre-commit or https://github.com/typicode/husky
• Use conventional commits
• Add linting for conventional commits

[rjmackay]

If we want to enforce immutable data structures: https://github.com/rtfeldman/seamless-immutable Might be worth a look as a simpler option compared to immutablejs. However I can't find exactly how to best connect this with redux.