How to Handle API Calls in Angular Production Build When Contextual Data is Missing (e.g.,...

I'm in the process of Dockerizing my Angular app, and I'm trying to build it in production mode using the command ng build --configuration production. However, when I run this command, all the API calls to the backend are triggered, and they fail because they require contextual data (such as a user being logged into their Google account) to return the appropriate information from backend. Obviously, during the build process, no user is logged in, as this is an automated process, so these API calls return errors.

What I tried: To address this issue, one solution I came across is to add a check in either the frontend or backend code to see if the environment is production. If it is, I could return mock data to ensure that the build proceeds smoothly. However, after the build is complete, I'd have to remove these checks to make sure that when deployed, the app returns real data for actual users. The problem is that, once the code is updated to remove these checks, I'd need to rebuild the production build, which would cause the original issue to resurface.

My question:

• 
  How can I successfully build my Angular app in production without my API calls failing, even when contextual data (like a logged-in user) is missing during the build phase?
  
  
• 
  Is there a more sustainable solution to this issue, or a best practice for handling this scenario?
  
  
• 
  Perhaps I am misunderstanding something fundamental about Dockerization, I am building a production version of my app to make my docker containers lighter and quicker, am I on the right track of is there something I am missing?
  

Continue reading...