Getting started with React Hooks
As we learned earlier in this chapter, React Hooks solve many problems, especially in larger web applications. Hooks were added in React 16.8, and they allow us to use state, and various other React features, without writing a class. In this section, we will start by defining a class component, and then we will write the same component as a function component using Hooks. We will then discuss the advantages of Hooks and how to migrate from classes to a Hook-based solution.
Starting with a class component
Let’s start by creating a traditional React class component, which lets us enter a name; this is then displayed in our app:
- Copy the
Chapter01_1
folder to a newChapter01_2
folder, as follows:$ cp -R Chapter01_1 Chapter01_2
On macOS, it is important to run the command with a capitalized
-R
flag, not-r
. The-r
flag deals differently with symlinks and causes thenode_modules/
folder to break. The...