Deploy on Cloud

In this final project, you will be deploying “Guess the Captial” on the cloud. It is a web application that asks you to guess the capital of a country from 4 choices.

You will use the source code and the steps provided to practice hands-on how an application can be developed and deployed on the cloud.

Objectives: Clone the source code Build Docker image Deploy on Docker Tag and Push image to IBM Cloud Deploy on IBM Code Engine

Background Docker Containers are isolated environments that package applications and their dependencies. Each container runs as an isolated process on the host operating system.

Docker is an open-source platform that enables developers to automate the deployment and management of applications inside lightweight, isolated containers.

IBM Cloud IBM Cloud is a cloud computing platform and suite of cloud-based services offered by IBM. It provides a range of infrastructure, platform, and software services to support the development, deployment, and management of various types of applications and workloads in the cloud.

IBM Code Engine IBM Cloud Code Engine is a serverless compute platform provided by IBM Cloud. It allows developers to deploy and run containerized applications without the need to manage the underlying infrastructure. Abstracting away the complexities of server provisioning, scaling, and maintenance, enabling developers to focus on writing code and building applications

• Code Engine CLI

 1ibmcloud ce project current
 2theia@theiaopenshift-sghafoor:/home/project$ ibmcloud ce project current
 3Getting the current project context...
 4OK
 5
 6Name:       Code Engine - sn-labs-sghafoor
 7ID:         4cb66df9-139f-4ecd-930d-f99e135d9b00
 8Subdomain:  1t84x11ry08j
 9Domain:     us-south.codeengine.appdomain.cloud
10Region:     us-south
11
12Kubernetes Config:
13Context:               1t84x11ry08j
14Environment Variable:  export KUBECONFIG="/home/theia/.bluemix/plugins/code-engine/Code Engine - sn-labs-sghafoor-4cb66df9-139f-4ecd-930d-f99e135d9b00.yaml"
15theia@theiaopenshift-sghafoor:/home/project$

• Now home directory is ready

• ---

Instructions

1. Install docker and ibm cloud cli
2. Need to have an IBM Cloud account
3. Clone the source code from the repository provided
4. Cd into the project directory and list the contents

1Dockerfile  README.md  favicon.ico  script.js
2LICENSE     data.json  index.html   style.css

5. Host the web page using python3 -m http.server 8080
6. Open the browser and navigate to http://localhost:8080, interact with the application.
7. Once the web page is up, stop the server using ctrl+c
8. Create a Dockerfile in the project directory
9. Add the following lines to the Dockerfile:

1From nginx
2COPY favicon.ico /usr/share/nginx/html/favicon.ico
3COPY index.html /usr/share/nginx/html/index.html
4COPY script.js /usr/share/nginx/html/script.js
5COPY style.css /usr/share/nginx/html/style.css
6COPY assets /usr/share/nginx/html/data.json

10. Build the docker image using docker build -t guess-the-capital .
11. List the docker images docker images.

1docker images
2REPOSITORY          TAG       IMAGE ID       CREATED              SIZE
3guess-the-capital   latest    aa2363d8b8c4   About a minute ago   192MB

12. Run the image docker run -it -d -p 8080:80 guess-the-capital
13. Build the docker image using docker build -t guess-the-capital . OR docker build . -t us.icr.io/${SN_ICR_NAMESPACE}/guess-the-capital if you are using IBM Cloud Container Registry
14. Tag the image using docker tag guess-the-capital us.icr.io/${SN_ICR_NAMESPACE}/guess-the-capital
15. Push the image to IBM Cloud using docker push us.icr.io/${SN_ICR_NAMESPACE}/guess-the-capital
16. Deploy the image on IBM Code Engine using ibmcloud ce application create --name guess-the-capital --image us.icr.io/${SN_ICR_NAMESPACE}/guess-the-capital --registry-secret icr-secret --port 8080
17. Note the URL and open it in the browser https://guess-the-capital.1t84x11ry08j.us-south.codeengine.appdomain.cloud

Explanation