Hi,<p>I'm interested in how do professionals handle routing, authorization, and code/project management for enterprise-level React or Next.js application, here's a list to describe the situation:<p>1. The application are for large-scale enterprise (>1000 users), and it's for internal user only
2. The system supposed to handle both transactional and analytical business (like financing, human resource, purchasing, analytics etc.)
3. The system could have hundreds of loosely coupled apps (may or may not correlated to other apps), and can even grow to thousands.
4. User may only have access to a small set of apps related to his/hers role.
5. For a single app, different user might be able to perform different functionalities (display only, create, edit etc) depend on his/hers role.<p>edit:
1. I understand that we need to do authorization control at backend API level, but we also want to achieve it at UI level, so if a user opens a url but lacks authorization, a message should be displayed instead of the actual app.
2. regarding code management, should we use a single project or different projects, if use different projects, how to best put them together to make it work?
UI only reacts to the responses from backend. Of course it has some amount of logic not to show things user doesn't have permission to do anyway.<p>Regarding the error handling, just return response and show the error. For example if trying to load a dashboard and you get a 403, just display an error.