- Containerizing Angular, React, and VueJS.
- Mutlistage Docker builds.
- Use NGINX to serve Angular, React and VueJS applications.
- Using environment variables to configure applications
- Using .env files for configuring applications.
Environment Agnostic Configurations
Building environment-specific images as a workflow dependancy where changes to one environment must be promoted to other environments. As this is usually never a simple operation, since environments rarely mirror each other, you will begin to experience config drift.
Config drifts bring risk into your development workflows. If there is too much drift an application’s behavior may change between environments, which will invalidate your test results.
Environment configuration should be injected using environment variables where possible. When environment variables are not appropriate, a deployment pipeline should then be used to inject configuration files.
An alternative to environment variables for node-based projects is
.env files. Using files for configuring your applications is not as flexible as an environment variable. Your application requires access to the file during run-time, but the file should never be part of the build image for security reasons.
.env file must be injected into the running container image and the most common way of accomplishing this is through volumes.
FROM node:latest AS build COPY ./src . RUN npm install \ && npm run-script build-production
The second stage creates the final Docker image. This image will only contain our application’s build artifacts and services required to run the application.
FROM nginx:latest AS final COPY --from=build build/* /usr/local/nginx/html
The final Dockerfile with both stages would look similar to the following.
FROM node:latest AS build COPY ./src . RUN npm install \ && npm run-script build-production FROM nginx:latest AS final COPY --from=build build/* /usr/local/nginx/html
Three Stage Build
An example of a three-stage build would test, compile, and build a final application container. We let our Docker container handle most of the continuous deployment pipeline.
- We ensure our unit tests pass
- We build our application artifacts
- We output a final image for an environment agnostic image