@zuolizhu
Posted
Hey @buchi,
Nice job on this challenge 🙌! prop drilling
itself is not effective at all 😂, that's why people created state management tools for handling passing props crossing components.
However, if you want to stick with props and not introducing extra complex, you can do state lifting
, 👉 official doc you can check it out. In your example, instead of fetching all the countries in your Country.jsx
, you can fetching it in the upper components, which is your App.js
component, and then passing down to other components.
Another tool you can try (and I highly recommended) is Zustand for global statement management, super easy to setup and works just fine 👌.
You can also use some tools like React Query or SWR, those tools have built in cache you can use, so instead of save the fetched data into state, save it as cache and use it in your components.
Hope my answer helps and happy coding 😆!
@buchi-1996
Posted
@zuolizhu thanks I will look into your suggestions