I'm currently learning React and working on improving my frontend development skills. I understand the basics of JSX, components, and props, but I'm struggling with more advanced concepts like state management, hooks (especially useEffect), and handling asynchronous data (API calls). Sometimes I get confused about component lifecycle and when exactly certain logic should run.
For example, I don't fully understand how to properly fetch data inside useEffect without causing unnecessary re-renders or bugs. Also, structuring a scalable project (folder structure, reusable components, etc.) is a bit challenging for me.
Could you explain these concepts with clear, real-world examples and best practices? It would be really helpful if you could also show how a small React project is structured in a professional way.