While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.
Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.
All of the state management libraries you mentioned have their unique features and advantages, and the choice of which one to use ultimately depends on the specific needs and requirements of your project. However, here's a brief overview of each library:
MobX: MobX is a simple, lightweight, and easy-to-learn library for managing state in React applications. It has a reactive programming model and provides automatic state updates, which means you don't have to write complex code for updating your app's state. It also has good performance and works well with TypeScript.
React Context: React Context is a built-in feature of React that allows you to share data between components without having to pass props down the component tree. It's a good choice for simple use cases where you need to share state between components without any complex logic.
Redux: Redux is a widely-used library that provides a single source of truth for managing state in large-scale React applications. It has
