I’ve open sourced some sample code that shows how to deploy Angular, React and Vue web applications to Kubernetes on the IBM Cloud.
In order to serve the web applications, nginx is used. Check out nginx.conf for a simple sample configuration. The file also shows how to access other domains via HTTP.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
server {
listen 80;
charset utf-8;
sendfile on;
root /usr/share/nginx/html;
location / {
expires -1;
add_header Pragma "no-cache";
add_header Cache-Control "no-store, no-cache, must-revalidate, post-check=0, pre-check=0";
try_files $uri $uri/ /index.html = 404;
}
location /api/v1/namespaces/ {
proxy_pass https://openwhisk.ng.bluemix.net;
}
}
The built web applications in the dist/build folders are copied on a Docker image. The image extends the standard nginx image from DockerHub. Here is the Dockerfile.
1
2
3
FROM nginx:latest
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY dist /usr/share/nginx/html
In order to deploy the applications to Kubernetes, the Docker images are pushed to Docker registries and the Kubernetes configurations are deployed via the kubectl CLI.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
apiVersion: v1
kind: Service
metadata:
name: angular-app
labels:
run: angular-app
spec:
type: NodePort
ports:
- port: 80
targetPort: 80
protocol: TCP
name: http
- port: 443
protocol: TCP
name: https
selector:
run: angular-app
---
apiVersion: extensions/v1beta1
kind: Deployment
metadata:
name: angular-app
spec:
replicas: 1
template:
metadata:
labels:
run: angular-app
spec:
containers:
- name: angular-app
image: nheidloff/angular-app
ports:
- containerPort: 80
- containerPort: 443
If you want to try out deploying web applications on Kubernetes, you can register an account on the IBM Cloud.