Gain insights into using React Hooks to enhance code composition and reuse. Delve into custom hooks, global state management, unit testing, and the useDependency Pattern for enterprise-level coding.

prettyeslint.tar.gz

Jest

Jest only

Jest only-copy

Jest-copy

In this course, you will learn how to use React Hooks, which will help you achieve better code composition, code reuse, and unit testing ability as opposed to using class components.

You’ll start by reviewing what React Hooks are all about and why we need them. This will set the stage for the rest of the course. After that you will dive into the Hooks API, how to manage application state globally, as well as how to create custom hooks.

In the second half, you’ll get into unit testing and how to work with the popular useDependency Pattern. By the end of this course, you’ll have the confidence to write enterprise-level React Hooks code.

A Deep Dive into React Hooks


**Motivations** can be defined as problems React Hooks solve and the benefits gained from using them instead of writing classes.

Continue with the lesson  to see the main benefits from using React Hooks.

# Better code composition

If the diagrams in the previous lesson are compared, it shows that  React Hooks allow you to write code in a more functional way. 

When using classes, the side effects logic in different lifecycle events are being divided. This makes it harder to follow code composition and the flow of data. Hooks solve this problem by allowing you to write side effects logic in a linear and rendering flow.

**Solving HOC Hell**

You may be familiar with "Callback Hell" when writing asynchronous functions. ES6 introduced `async` and `await` syntax to overcome this problem. We can draw an analogy here. With HOC (High-Order Components), wrap one component in another function and return a new component from it. Depending upon the complexity of a component, it may require several HOCs to create fully functional logic

With React Hooks, simply “use” any hook in a functional component but avoid running into the trap of wrapping components.


This lesson will examine the motivations behind using React Hooks in your code. In addition, the biggest benefits of using React Hooks today will also be discussed.

Introduction

Getting Started with React Hooks

React Hooks API

Advanced: Deep Dive into useEffect Hook

Managing Global State with Hooks

Create Your Own Hooks

Unit Testing for React Hooks

Advanced: useDependency Pattern with Hooks

Conclusion

The Need for Hooks in React

Better code composition