Fetching data in react

There is this excellent article about data fetching in react.

Data fetching in react simplified

Usually, let's start with the basics. Mostly what we do is that if we consider an example of fetching user data from the backend server then we first create a state variable using useState hook. Now as fetching data from the backend is a side effect in react. When we talk about side effects in the context of React.js, we are referring to anything that is outside the scope of React. Hence making an HTTP request is also an example of react side effect. Usually, these side effects are handled with the help of the useEffect hook that is provided by react.

Now inside this useEffect hook, we use fetch API to request the backend and then when the data is received we store the result in our state variable so that it can be used later.

This is a simple approach to fetching and storing the data. However, more complex architecture and practices are discussed in the article.