Trade-offs of React class components vs React Hooks

Now that we have finished our migration from class components to Hooks, let us revise and sum up what we have learned.

Function components with Hooks are easier to understand and test, since they are simply JavaScript functions instead of complex React constructs. We were also able to refactor the state-changing logic into a separate reducers.js file, thus decoupling it from the App component, and making it easier to refactor and test. We can safely say that separating concerns between app logic and components significantly improved the maintainability of our project.

Now, let’s recap the advantages we gained by refactoring our app. With function components and Hooks, the following points do not need to be taken into consideration anymore:

• No need to deal with constructors.
• No confusing this context (this re-binding).
• No need to destructure the same values over and over again.
• No magic...