Load Data from REST API

How to load data from a REST API to then display it inside a component? This is achieved inside the ComponentDidMount for class components and inside a call to useEffect() without parameters in functional components.

useEffect(() => {
console.log('useEffect()');
getRESTData();
console.log('useEffect() done');
}, []);

There is one important thing to know! ComponentDidMount and the empty effect are called after the components are rendered for the first time. In other words, components are rendered with empty data initially!

Make sure to design your components so that they deal with empty data without throwing any errors!

When ComponentDidMount or the empty effect have been executed and the data is finally available, the components are rendered again and this time around do have access to the REST data. Design your components in a way that they deal with data arriving at a later point in time!

Leave a Reply