Fetch API data using useEffect React hook

React

In this article we will talk about the use of useEffect React hook to fetch API data. We will create a sample React application to pull data from a provider and use it in our application.

Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.

Setting up the basic React Application

Lets first create a new React Application in your favorite directory using the following command:

npx create-react-app .

Open the application in Visual Studio Code:

REACT App in Visual Studio Code

Modify the App.js to as below:

App.js

Start the application using following commad:

npm start

Once the application starts, following screen will be displayed in browser: