From the course: React: Building Progressive Web Apps (PWAs)

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Fetch data with React Hooks

Fetch data with React Hooks - React.js Tutorial

From the course: React: Building Progressive Web Apps (PWAs)

Start my 1-month free trial

Fetch data with React Hooks

“

- Let's upgrade our app by fetching some dynamic data from an API. The API we want to get the data from is here, orangevalleycaa.org/api/videos. Now this API is serving up an array of objects, where we have this key called video URL. And then all of these video URLs, I'm going to just copy one and paste one into our tab here, and it autoplays, but we're seeing that this is just an API that serves up some information about videos as well as their URLs. So, if I want to load this data into my app, I'm going to need to make an HTTP request using my app component. Now, back to our app component, let's go ahead and add this. So a couple things I want to do. First up, I'm going to import use state and use effect from React. Now, these are hooks that I'm going to use for state management and for data loading. Within the app, I'm going to create a state variable called data, and a function for updating state called set data. And I'm going to set this equal to use state, and what use state is…

Contents