Setting up the state management structure in the middle of the project React.js

Question

I started the project when I had no experience in React.js, i used prop drilling for entire project. Now project got complicated as i expected

So i wanna create state management structure but i don't know how to start.

Can i apply to whole project or could I only use it for the next components?

Answer 1

You can easily start using a state management library within parts of your app without needing to refactor the whole app immediately. This way, you can start using it in new components right away and revisit the older code from time to time and refactor them slowly to clean up prop drilling.

If you are planning to use React Context, you can follow the pattern recommended here: https://kentcdodds.com/blog/how-to-use-react-context-effectively

I also suggest looking into Redux Toolkit as an alternative to React Context: https://redux-toolkit.js.org/tutorials/quick-start