Communicating with APIs and the outside world using useEffect

Here, you can use a free mock REST API. However, you do need to address the problem of accessing external data and the management of external events. External to what, you might wonder?

You have seen that React and its mighty Hooks are centered around the task of synchronizing the UI to the state and the data. Components can contain other components, and together, they form what is known as a component tree, which is then constantly compared to the current state. React does all of this coordination work, to determine what should be rendered, updated, and more.

Events that are outside of the React data flow process are called side effects. Notable examples of React side effects are as follows:

• Performing API calls—sending or receiving data from an external server
• Subscribing to external data sources via websockets or streams
• Setting or getting data values to and from the local storage or session...