Build an Angular app once, Deploy Anywhere with Docker & Nginx
The article explains how to build an Angular application once and deploy it across multiple environments using Docker and Nginx. Instead of rebuilding the app for each environment, configuration files are swapped at runtime using an entrypoint script. This approach improves CI/CD efficiency and ensures consistency across deployment stages.
- ▪Standard Angular builds require separate builds for each environment, which is inefficient.
- ▪The solution uses JSON config files and an entrypoint script to inject environment-specific settings at runtime.
- ▪A single Docker image can be deployed across Dev, Staging, and Prod by setting an environment variable.
- ▪The Dockerfile uses a multi-stage build to compile the Angular app and serve it via Nginx.
- ▪The APP_INITIALIZER in Angular ensures the config is loaded before the application starts.
Opening excerpt (first ~120 words) tap to expand
try { if(localStorage) { let currentUser = localStorage.getItem('current_user'); if (currentUser) { currentUser = JSON.parse(currentUser); if (currentUser.id === 347695) { document.getElementById('article-show-container').classList.add('current-user-is-article-author'); } } } } catch (e) { console.error(e); } Basit Jamil Posted on May 2 Build an Angular app once, Deploy Anywhere with Docker & Nginx #docker #angular #nginx Standard Angular builds bake environment variables into the code at build time. This means if you have Dev, Staging, and Prod environments, you have to build the app three times. That's a waste of time. Instead, we should build a single Docker image and swap configurations at runtime. Here is how to do it. 1.
…
Excerpt limited to ~120 words for fair-use compliance. The full article is at DEV.to (Top).