How to Containerize an Application with Docker

Containerizing an application involves packaging it with its dependencies and configuration files. This enables it to run seamlessly in any environment.

This step is crucial in the development process because it allows developers to concentrate on the application itself rather than the environment in which it will operate.

Additionally, it enables the application to deploy in any environment without concerns about dependencies and configurations.

In this article, you'll learn how to write a Dockerfile to containerize a simple frontend weather application.

Prerequisites

While this tutorial will detail each step, it's recommended that you have the following:

• Docker installed on your machine. You can find installation instructions for various platforms on the Docker website.
• A fundamental understanding of Docker. If you're new to Docker, you can explore the Docker Documentation for a quick introduction.

Overview

For simplicity, this tutorial will use a basic weather application. The aim is to learn how to create a Dockerfile - the primary requirement for containerizing an application.

More complex applications will necessitate multiple Dockerfiles, which will introduce Docker Compose and an orchestration tool like Kubernetes. However, these are beyond the scope of this tutorial.

The weather application, named Zeus, is a frontend application utilizing HTML, CSS, and JavaScript to showcase the weather forecast for a specified location.

To containerize an application, you need to create a Dockerfile. A Dockerfile is a text file that contains instructions for building a Docker image.

This Docker image can then be used to create a Docker container which is a running instance of the image.

Figure 1. Workflow for containerizing an application by MrDevSecOps on Medium

The steps below will guide you through the process of creating a Dockerfile for the weather application.

Step 1: Clone Weather App

To get the source code for the weather application, you can clone the repository from GitHub:

git clone https://github.com/Aahil13/Zeus.git

Step 2: Create the Dockerfile

Navigate into the application directory and create a file named Dockerfile.

Before diving into writing the Dockerfile for this application, here's a template Dockerfile outlining its various components:

# Use a base image with Node.js pre-installed
FROM node:14

# Set the working directory inside the container
WORKDIR /app

# Copy package.json and package-lock.json (if exist) to the working directory
COPY package*.json ./

# Install Node.js dependencies
RUN npm install

# Copy the rest of the application code
COPY . .

# Expose the port your application listens on
EXPOSE 3000

# Command to run your application
CMD ["node", "app.js"]

Here's a breakdown of each layer of the Dockerfile:

# Use a base image
FROM <base_image>

• FROM: This instruction specifies the base image to use for your Docker image. The base image provides the starting point for your container.

• <base_image>: You replace this placeholder with the name of the base image you want to use. For example, if you're building a Node.js application, you would use node:14 as the base image.
  The base image is typically an official image from Docker Hub. You can find a list of official images on the Docker Hub website.
  

# Set the working directory inside the container
WORKDIR /app

• WORKDIR: This instruction sets the working directory for any subsequent instructions in the Dockerfile.
  It's similar to the cd command in a shell. All paths will be relative to this directory unless explicitly specified otherwise.

• /app: This is the path inside the container where your application files will be copied. You can choose any directory structure that makes sense for your application.
  

# Copy the application files into the container
COPY . .

• COPY: This instruction copies files from the Docker host into the container. It takes two arguments: the source path (on the host) and the destination path (in the container).

• .: This represents the current directory on the Docker host. It copies all files and directories from the current directory into the specified destination directory (/app in this case) inside the container.
  

# Install dependencies (if any)
RUN <dependency_installation_command>

• RUN: This instruction allows you to execute commands inside the container during the image build process. It's typically used to install dependencies, configure the environment, or perform any necessary setup steps.

• <dependency_installation_command>: You replace this placeholder with the actual command(s) needed to install dependencies for your application.
  For example, if you're using a Node.js application with a package.json file, you might run npm install to install Node.js dependencies.
  

# Specify the command to run your application
CMD ["<command_to_start_your_application>"]

• CMD: This instruction specifies the default command to run when the container starts. It's similar to running a command in a shell after the container is launched.

• <command_to_start_your_application>: You replace this placeholder with the actual command needed to start your application.

For example, if you're running a Node.js application, you might specify node app.js to start your Node.js server.

For the weather application, you can use the following Dockerfile:

# Base image
FROM httpd:2.4-alpine

# Copy the application files into the container
COPY . /usr/local/apache2/htdocs/

# Expose port 80
EXPOSE 80

The Dockerfile for the weather application is very simple because it's a frontend application that doesn't require any dependencies or configuration.

The base image is httpd:2.4-alpine which is an Apache HTTP server image based on Alpine Linux.

The application files are copied into the /usr/local/apache2/htdocs/ directory inside the container. This is the default directory for serving files with Apache.

The EXPOSE instruction exposes port 80 which is the default port for HTTP traffic.

Step 3: Build the Docker Image

Once you have the Dockerfile, you can build the Docker image using the docker build command:

docker build -t zeus .

• docker build: This command builds a Docker image from a Dockerfile.
• -t zeus: This option tags the image with the name zeus.
• .: This represents the current directory on the Docker host. It tells Docker to look for the Dockerfile in the current directory.

Step 4: Run the Docker Container

Once the image is built, you can run a container based on that image using the docker run command:

docker run -d -p 80:80 zeus:latest

• docker run: This command runs a Docker container based on a Docker image.
• -d: This option runs the container in detached mode. It means that the container will run in the background and you can continue to use the terminal.
• -p 80:80: This option maps port 80 on the Docker host to port 80 on the container. It allows you to access the application running inside the container through port 80 on the Docker host.
• zeus:latest: This is the name of the Docker image to use for the container. The latest tag is used to specify the latest version of the image.

Step 5: Access Your Application

You can now access your application through your web browser.

If you're running Docker on your local machine, you can access the application at http://localhost.

If you're running Docker on a remote server, you can access the application at http://<server_ip_address>.

With the weather application, you should see a page like this:

Figure 2. Screenshot of the weather application

There are several things you can do with your Docker container. You can stop, start, restart, or remove the container.

To stop the container, you can run:

docker stop zeus

Conclusion

In this tutorial, you learned how to write a Dockerfile to containerize a simple frontend weather application.

You can use these same steps to containerize any application. The only difference will be the Dockerfile.

This is a high-level overview of the process of containerizing an application. For more information, you can read the Docker Documentation.