Practical Example Using Global State
Examine a fully functional React application utilizing the global state solution built with React Hooks.
Now, it is time for hands-on exercises where you can see the global state in action.
For this exercise, consider building a dashboard application to show user-specific data when visiting the /dashboard URL.
In such applications, it is likely that a number of components require access to the profile and account data. Use global state to store this data. Later, components can access it via Store throughout the application.
The following diagram shows how the application looks. It has three main React components:
- A
Headercomponent connected to the global state. - A
Usercomponent that is responsible for loadingprofiledata when the component mounts. - A
Dashboardcomponent that is rendered when the user visits the/dashboardURL. It is also connected to the global state to access data and the update