Using functional components (discussion)

[brodycj]

Pure functional components:

• https://medium.freecodecamp.org/functional-setstate-is-the-future-of-react-374f30401b6b
• https://www.dalejefferson.com/stateless-components-in-react-native/
• https://stackoverflow.com/questions/45040163/what-is-the-use-and-functionality-of-render-in-react-native
• https://medium.com/@PhilipAndrews/react-how-to-access-props-in-a-functional-component-6bd4200b9e0b
• https://hackernoon.com/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc
• https://github.com/acdlite/recompose#lift-state-into-functional-wrappers
• https://daveceddia.com/convert-createclass-to-function-component/
• https://www.npmjs.com/package/react-pure-stateless-component (https://github.com/christophehurpeau/react-pure-stateless-component)
• https://medium.com/@joshblack/stateless-components-in-react-0-14-f9798f8b992d
• https://medium.com/missive-app/45-faster-react-functional-components-now-3509a668e69f
• https://www.npmjs.com/package/react.pure.component (https://github.com/nadimtuhin/react-pure-component) wrapper (for further investigation)

Using createReactClass() function instead of ES6 Component class:

• https://www.npmjs.com/package/create-react-class - needed for createReactClass() function since it was removed from React 16.x
• https://github.com/FaridSafi/react-native-gifted-form - shows example of using createReactClass() function in React Nativehttps://codeburst.io/when-to-use-component-or-purecomponent-a60cfad01a81
• https://reactjs.org/docs/react-without-es6.html

Counterpoints:

• https://medium.freecodecamp.org/7-reasons-to-outlaw-reacts-functional-components-ff5b5ae09b7c
• https://toddmotto.com/react-create-class-versus-component/
• https://www.fullstackreact.com/articles/react-create-class-vs-es6-class-components/
• https://daveceddia.com/convert-createclass-to-es6-class/
• https://reactjsnews.com/composing-components
• https://medium.com/@antonkorzunov/2-things-about-purecomponent-you-probable-should-know-b04844a90d4 and other PureComponent references:
  • https://reactjs.org/docs/optimizing-performance.html
  • https://codeburst.io/when-to-use-component-or-purecomponent-a60cfad01a81
  • Counterpoint to using PureComponent: https://hackernoon.com/react-purecomponent-considered-harmful-8155b5c1d4bc

Other reading:

• https://medium.freecodecamp.org/8-key-react-component-decisions-cc965db11594
• https://cdb.reacttraining.com/use-a-render-prop-50de598f11ce - excellent arguments against HOC ("higher order components"), favors using render props instead (may be considered a counterpoint since it advocates using ES6 classes instead of composition)
• https://medium.com/@bluepnume/even-with-async-await-you-probably-still-need-promises-9b259854c161

[brodycj]

General (neutral):

• https://cdb.reacttraining.com/react-inline-functions-and-performance-bdff784f5578

Some additional resources from Eric Elliot:

• https://github.com/ericelliott/react-pure-component-starter
• https://medium.com/javascript-scene/baby-s-first-reaction-2103348eccdd
• https://github.com/stampit-org/react-stamp - composables for React
• https://gist.github.com/jquense/47bbd2613e0b03d7e51c (ref: https://twitter.com/_ericelliott/status/600934120252780544?lang=en)

[brodycj]

Radical:

• https://www.bignerdranch.com/blog/destroy-all-classes-turn-react-components-inside-out-with-functional-programming/ ... NOTE that there are some things I do not agree with:
  • let can and should be replaced with const in most if not all cases
  • I am also not happy that it uses async functions ref: https://medium.com/@bluepnume/even-with-async-await-you-probably-still-need-promises-9b259854c161

[brodycj]

Additional for React Native:

• http://reactnativequickly.com/book/chap03.html - "Hello World and the React Native CLI" - also shows use of React.createClass() (outdated since createClass() was moved into a separate package)

[brodycj]

Possibly relevant: https://medium.com/javascript-scene/baby-s-first-reaction-2103348eccdd

[brodycj]

and maybe https://gist.github.com/jquense/47bbd2613e0b03d7e51c