This documentation provides you with step by step instructions on how to build and deploy this application in an OpenShift 3.3+ and Jenkins 2.x+ environment. Jenkins is not required and you could just use the built-in OpenShift triggers.
The benefits are:
- Uses Nginx to serve static files (10x faster than NodeJS)
- Only build outputs are on runtime container (reduces security risk and container size)
- Uses
mainline
nginx to automatically keep up with patches - (Optional) configure Nginx as a reverse proxy for REST APIs
Enhancements to base Nginx image are:
- security response HTTP headers
- throttling to reduce DDoS
- W3C standard log formatting
- performance tuning
- uses X-Forwarded-For for client IP for better logging and access control.
- gzip enabled for better client performance
- Optional IP filtering for access control
- TODO: Optional HTTP Basic for access control
This build strategy uses OpenShift's feature called Extended Builds.
In a nutshell, it allows you to build with one s2i image, i.e., NodeJS 6+, then use another image, i.e., nginx, for runtime.
OpenShift is responsible for:
- Building Docker images
- Building S2I Images
- Moving output of S2I to runtime image
- Deployments
Jenkins is responsible for:
- Listing for pushes from GitHub SCM, i.e., GitHub hook -> Jenkins
- Triggers the Build/Deploy Pipeline
- Executing the
Jenkinsfile
- SCM checkout
- Trigger OpenShift to build images
- Tagging images to instruct OpenShift to deploy
- Build notifications, repo tagging and other CI/CD goodies
This is your builder image that compiles the angular source code.
This image is based on the OpenShift's community NodeJS 6 image, i.e., FROM centos/nodejs-6-centos7
.
We use this because the stock NodeJS 4 can't compile angular-cli
(an ES6 issue). Once the stock NodeJS 4 image
is upgraded this won't be required.
To add this image to your OpenShift Project,
- Open OpenShift web console->Add to Project->Import YAML/JSON
- Paste
angular-builder.json
into form -> Create - Change the Git Repo URL to yours -> Create
- With the new build config, go to the Builds->
angular-builder
-> Start Build
What happens in OpenShift:
- Fetches
Dockerfile
from<your repo>/angular-builder/Dockerfile
- Executes Dockerfile build strategy
- Pushes new
angular-builder
image into your project's Image Streams
This is your runtime image that is deployed with output of the angular-builder
.
This images is based on docker hub's official nginx image, i.e., FROM nginx:mainline
. It will auto
update to latest mainline for every build. If you need to pin it to a version alter the nginx-runtime/Dockerfile
.
To add this image to your OpenShift Project,
- Open OpenShift web console->Add to Project->Import YAML/JSON
- Paste
nginx-runtime.json
into form -> Create - Change the Git Repo URL to yours -> Create
- With the new build config, go to the Builds->
nginx-runtime
-> Start Build
What happens in OpenShift:
- Fetches
Dockerfile
from<your repo>/angular-builder/Dockerfile
- Executes Dockerfile build strategy
- Pushes new
nginx-runtime
image into your project's Image Streams
This is the s2i builder image to glue the angular-builder
output with the nginx-runtime
image. The result is a
new image based on nginx-runtime
but with the output of angular-builder
.
To add this image to your OpenShift Project,
- Open OpenShift web console->Add to Project->Import YAML/JSON
- Paste
angular-on-nginx-build
into form -> Create - Change the
Name
to the name of your application - Change the
Git Source Repo URL
to yours -> Create - This should auto trigger a build
What happens in OpenShift:
- Trigger's
angular-builder
to build with your source code - Copies output, i.e.,
/opt/app-root/src/dist/
tonginx-runtime
directorytmp/app
- Create to image,
<your app name>-build
to Image Stream
Once we've got an image out of the angular-on-nginx
builder, e.g., <your app name>
, we
need to setup the deployment. We've provide a deployment template that is based on real load testing:
- Tuned CPU/Memory for the ngnix runtime on containers
- Auto-scaling for high work loads
- Tweaked readiness and liveness probes settings
The deployment template will create in OpenShift:
- Deployment config with default nginx runtime env vars
- Service config
- Route config
To add this image to your OpenShift Project,
- Open OpenShift web console->Add to Project->Import YAML/JSON
- Paste
angular-on-nginx-deploy
into form -> Create - Change the
Name
to the name of your application - Change the
Env TAG name
to the name of your application - Change the
APPLICATION_DOMAIN
to the domain name you would like - This should auto trigger a build
Repeat these steps for each environment you have changing the Env TAG name
.
You can choose not to use Jenkins at this point. Instead, use vanilla OpenShift build triggers and image changes deployments. However, Jenkins provides some nice features you'll probably need.
So, you've chosen to use Jenkins! Congrats!
This repo also comes with a Jenkinsfile
to take advantage of the Pipelines feature in OpenShift and Jenkins.
Follow BCDevOps Jenkins Configuration to get started
Note: we've already provided the default Jenkinsfile
tailored for this app.
Jenkins out-of-the-box needs some additional setup.
- First off, you'll need the admin password. Go the Deployments ->
jenkins-pipeline-svc
-> Environment ->JENKINS_PASSWORD
- Navigate to jenkins web site by looking in your Routes in made for Jenkins
- Upgrade all the plugins in Jenkins
- Add the
GitHub
plugin - Add the
NodeJS
plugin - After installing the plugin, go to the global jenkins configuration panel (JENKINS_URL/configure or JENKINS_URL/configureTools if using jenkins 2), and add new NodeJS installations. See (https://wiki.jenkins.io/display/JENKINS/NodeJS+Plugin) for more information on what exactly to do. Your Name of installed node must match the name in the Jenkins file where it declares the tools section. EG: 'NodeJS-V8.x'