Learn React Hooks

Defining the function component

Now, we define the same component as a function component:

1. First, we remove all code from the src/App.js file.
2. Next, in src/App.js, we import React, and the useState Hook:

    import React, { useState } from 'react'

3. We start with the function definition. In our case, we do not pass any arguments, because our component does not have any props:

    function MyName () {

The next step would be to get the name variable from the component state. However, we cannot use this.state in function components. We have already learned that Hooks are just JavaScript functions, but what does that really mean? It means that we can simply use Hooks from function components, just like any other JavaScript function!

To use state ...