Deploying a Static Website In a Docker Container using an NGINX webserver

What is Docker?

Docker is an open platform for developing, shipping, and running applications. Docker enables you to separate your applications from your infrastructure so you can deliver software quickly without the concern of what type of operating system the host and end-user may use. With Docker, you can manage your infrastructure in the same ways you manage your applications.

Please visit the official docker page here to download docker to your local machine: https://docs.docker.com/docker-for-windows/install/

What is NGINX?

NGINX is open-source software for web serving, reverse proxying, caching, load balancing, media streaming, and more. It started out as a web server designed for maximum performance and stability. In addition to its HTTP server capabilities, NGINX can also function as a proxy server for email (IMAP, POP3, and SMTP) and a reverse proxy and load balancer for HTTP, TCP, and UDP servers.

In this lab, you must understand the basics of docker and how images and containers are built. I will do my best to explain it in as simple terms as possible, as I am learning containers and “labbing” at higher levels and gaining higher-level understanding.

Docker Images

A Docker image is a read-only template that contains a set of instructions for creating a container that can run on the Docker platform. It provides a convenient way to package up applications and preconfigured server environments, which you can use for your private use or share publicly with other Docker users. Images are available to be pulled via the CLI from the official docker hub. The images that you can pull include official and custom-built images that users have uploaded. You can search for the in the command line using the docker search <name of image> command. See below (red box is the name of the image which can change depending on what you are looking for…there are thousands)

What in the world is a Container?

A container is a standard unit of software that packages up code and all its dependencies so the application runs quickly and reliably from one computing environment to another… Secure: Applications are safer in containers and Docker provides the strongest default isolation capabilities in the industry.

Now that we have a basic level of understanding of Docker and its use case lets go over a scenario where you can host a static website from a docker container. At a higher level, you can deploy application code inside of this container and use port mapping to expose the container to the world for access, or to other end users (securely that is…). But in this case, we are deploying it to our localhost.

Note: I will be using port 5000 locally since I have Jenkins(configuration management tool) install on port 8080 locally.

Dockerfile

A Dockerfile is a text document that contains all the commands a user could call on the command line to assemble an image. Using docker build users can create an automated build that executes several command-line instructions in succession.

Link to the Dockerfile: https://gist.github.com/bmwitcher/d046386bef49945ea0892683d8084d77

FROM ubuntu

RUN apt-get update

RUN apt-get install nginx -y

COPY index.html /var/www/html/

EXPOSE 80

CMD [“nginx”,”-g”,”daemon off;”]

FROM — is where we are pulling our official image from ubuntu is an official image provided by Docker

WORKDIR- you guessed it…it is setting the current location (directory) of where are files are located(not used here but an option for your future use)

RUN — provides an instruction to download and acquire all packages updates from the internet

RUN- the next run instruction install nginx web server on our container

COPY (not to be confused with the ADD command)- is taking our index.thml file from out local directory were are working in and moves it into the /var/www/html root directory(of NGINX) in our container. (Note: with the ADD command also close in its function, you are able to reference a URL and other things) make sure your index.html file is in your working directory.

EXPOSE- is a documentation instruction letting the container know we are exposing the standard port 80 (TCP)

CMD- provide defaults for an executing container

Next, let’s build our docker container using the docker build command which will pull from our Docker File instructions.

Link to the HTML file: https://gist.github.com/bmwitcher/79194d8f44ae6a2e0c96c006b58118a7

docker build -t <name of tag of container I used dockernginx> . ← . is to symbolize current directory.

You will now see your screen run each step of the docker file to include the installation and pull of the ubuntu image from the official repo, get updates from the apt-get install command, and install nginx. At the bottom, you should see the following outcomes.

You see here your container has successfully been built and all of the steps have been run.

Your image ID is 7283b7009d05 you will have a different ID# than I do.

You also see where that -t option when used in our command tagged the container as dockernginx:latest.

Now let’s run our container and I will explain the options to you briefly I would definitely consider visiting the official docker page for commands and their explanations because there are too many to remember 😂.

Here we are going to run: docker container run -d -p 5000:80 dockernginx:latest

-d = detached mode — means that a Docker container runs in the background of your terminal. If you run containers in the background, you can find out their details using docker ps and then reattach your terminal to its input and output.

-p = port mapping [hostname — you] : [port we exposed in the Dockerfile also the port that nginx runs on]

NOT USED HERE BUT YOU MAY NEED THIS TO LOG IN TO YOUR CONTAINER IN THE FUTURE:

-i & -t = interactive mode which will give us the option to log in and run commands to the inside of the container if we so choose to.

— NAME <CONTAINER NAME IT WILL CHANGE FROM RANDOM CHARACTERS TO THE SPECIFIC NAME YOU CHOOSE>

This long number you see under the first command is your running container ID. Here you can also see the -t (or tag) we used when we built or original image. The next command docker ps shows all of your RUNNING containers.

Now, the final step lets see if our static website is working that should show from our index.html file. We will use localhost:5000 ← hostname we set in the port mapping stage. You could use your local ip address:5000 and it will show the same web page.

Let’s see if our HTML file is written correctly and if our link works.

Levelupintech.com — just went live by the way and looks great.

Let's clean up our environment…run the following commands to stop the containers, remove the containers, and delete the images.

NOTE: I am deleting my entire environment PLEASE be careful in running these commands if you have containers you would like to keep. I DO NOT RECOMMEND RUNNING THESE COMMANDS IN A WORK/PRODUCTION ENVIRONMENT.

1. Stop all running containers. docker stop $(docker ps -aq)- to stop this one container → after stop <name of container or id>
2. Remove all containers. docker rm $(docker ps -aq) — to delete this one after rm → <name of container or id>
3. Remove all images. docker rmi $(docker images -q)- to remove this one image after rmi → <name of image or id of image>

Thanks for reading I try to be brief but detailed in many of my projects to respect your time.