From the course: Learning Full-Stack JavaScript Development: MongoDB, Node, and React

Unlock the full course today

Join today to access over 24,800 courses taught by industry experts.

Fetching data while React is rendering

Fetching data while React is rendering

From the course: Learning Full-Stack JavaScript Development: MongoDB, Node, and React

Start my 1-month free trial Buy for my team

Fetching data while React is rendering

“

- [Narrator] To fetch data for the project so far, we used this method, fetch and then render. This sequence is not ideal, making React wait on the fetch. It would be better if we let React do its rendering while the data is being fetched. And then when the data arrives, React can do a DOM update operation, that's slightly more efficient. There are a few methods to accomplish that, but the gist for all of them is to not make this dependency here. So we need to have React render the app right away, and we can use just an empty array of contests for the initial data. React will render fine with an empty list of contests. Then we take this fetch call and move it to the React component that needs the data. In this case, the contest list component. Ideally, we can have the data fetching start even before React renders the component. But for simplicity, I'll put the data fetching in a use effect call within the contest list…

Contents