React hooks

Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class. In this topic you will learn why Hooks are added to React and how they can help you write great applications.

6 resources available

The Hooks of React Router

React Router 5 embraces the power of hooks and has introduced four different hooks to help with routing. You will find this article useful if you are looking for a quick primer on the new patterns of React Router. But before we look at hooks, we will start off with a new route rendering pattern. [continue]

Article by Agney Menon

Building a Piano with React Hooks

In this article, we will see how to build a piano with react hooks. Building a Piano with React Hooks. if you are completely new to react hooks, check out this course. [continue]

Tutorial by ganeshmani009

From Redux to Hooks: A Case Study

Using Hooks instead of Redux for state management is by no means easier. You have to be already familiar with the underlying concepts and understand the tradeoffs. Without relying on Redux you lose out-of-the-box performance optimizations, middleware support, devtools extension, time travel debugging [continue]

Tutorial by Sergey Ryzhov

State management using only React Hooks

Managing shared state in larger React apps usually involved pulling in third-party libraries like Redux and MobX. This article simply aims to familiarize you with useReducer and how you can use it as an alternative to manage an application's state. [continue]

Tutorial by Ovie Okeh

A Complete Guide to useEffect

Sometimes when you useEffect, the pieces don't quite fit together. You have a nagging feeling that you're missing something. It seems similar to class lifecycles… but is it really? The goal of this article isn't to give you a list of bullet point recipes. It's to help you truly “grok” useEffect. There [continue]

Article by Dan Abramov

State Management with React Hooks — No Redux or Context API

React Hooks are more powerful than you think. Today, we are going to explore it and develop a custom Hook to manage global states — an easier to use method than Redux, and more performant than Context API. [continue]

Article by André Gardi

What react hooks are / How to use react hooks / How to build custom Hooks / Test component that use hooks / How lifecycle methods correspond to Hooks / How hooks replace render props and higher-order components / Data fetching with hooks / UseState hook / UseCallback hook / Effect hook / UseMemo hook / useRef hook / How to get the previous props or state with hooks / How to memoize calculations with hooks