deploy a Custom Docker Image with Nginx and Save it to AWS ECR

6 min readMar 10, 2024

what is cloud9

Once your development environment is set up, you can use the Cloud9 editor to write and edit code, run and debug your code, and collaborate with other developers. It is a powerful and easy-to-use cloud-based IDE that also includes a terminal and other tools to help developers manage and deploy their code. Whether you’re a beginner or an experienced developer, it has everything you need to get your code up and running in the cloud.

What is Docker?

Docker is an open platform for developing, shipping, and running applications in a container. Containers don’t use any of the host resources like hardware or CPU. An image is a read-only template with instructions for creating a Docker container. You might create your own images or you might only use those created by others and published in a registry. To build your own image, you create a Dockerfile with a simple syntax for defining the steps needed to create the image and run it. Each instruction in a Dockerfile creates a layer in the image. When you change the Dockerfile and rebuild the image, only those layers which have changed are rebuilt. This is part of what makes images so lightweight, small, and fast, when compared to other virtualization technologies.

What is Amazon ECR?

Amazon Elastic Container Registry (Amazon ECR) is an Amazon Web Service (AWS) product that stores, manages and deploys Docker images, which are managed clusters of Amazon EC2 instances. Amazon ECR allows all AWS developers to save configurations and quickly move them into a production environment, thus reducing overall workloads.

How Amazon ECR works

Amazon Elastic Container Registry writes and packages code in the form of a Docker image.
Next, it compresses, encrypts and manages access to the images — including all tags and versions — and controls image lifecycles.
Finally, the Amazon ECS pulls the necessary Docker images from the ECR to be used in the deployment of apps and continues to manage containers everywhere — including Amazon Elastic Kubernetes Service (Amazon EKS), AWS cloud and on premise networks.

Let’s get started

Create your own image using Nginx and add a file that will tell you the date the container has been deployed
Deploy your container with port 8080 open
Save your container data to the AWS Elastic Container Registry (ECR)
Cloud9 IDE, comes with Docker installed.
Allow the EC2 instance to be accessible by our IP (Add an inbound rule to the EC2 Security Group to allow the instance to access port 8080).

Create a Directory

In the Cloud9 IDE, create a directory to save your HTML & Dockerfile.
Then cd into that directory

mkdir <directory_name>
cd <directory_name>

Pull Latest Nginx Image from Docker Hub

We have to use Nginx to deploy our custom website, so pull the latest version of the Nginx image from Docker Hub.

docker pull nginx:lastest

This will bring the image on to your local computer. verify that we pulled the latest image.

docker images

Create Dockerfile and index.html

Create Dockerfile

Modify the Dockerfile to make it run our script on start-up!

Note: make sure the D is capitalized or it will not be recognized by docker.

 $sudo vim Dockerfile

Add the following code to the Dockerfile and save it

# ---  Docker_projects/Docker_Nginx_Image_ECR/Dockerfile ---


FROM nginx
COPY index.html /usr/share/nginx/html
EXPOSE 8080

Create a new index.html file in the same directory by typing the following command:

 $sudo nano index.html

Add the following html code to the file and save it.



<!DOCTYPE html>
<html>
  <head>
    <title> Docker nginx page</title>        
  </head>

    <body>
        <b>
          <h1> Hello! The container has been successfully deployed.
          </h1> 

          <h2> The current date and time:
            <p><span id="datetime"></span></p>
              <script>
                var dt = new Date();
                document.getElementById("datetime").innerHTML = dt.toLocaleString();
              </script>
          <h2/>         
        <b/>
     
    <body/>
<html/>

Let’s start building our image from the Docker file running the following commands.

The “.” at the end of the command is used to only look for files in the directory you are in.

docker build -t <image name> .

Verify the image from Dockerfile, by running the following command

docker images

Next we will create the new container using the nginx image with port 8080 exposed.

docker container run -d --name <Container_Name> -p 8080:80 <Image_Name>

Let’s check to make sure our container is running

$docker ps -a

Next we will determine that our Docker container running and we can connect to it by running a curl command

curl localhost:8080

It prints out the index.html

Since I am running my environment on Cloud9 and my Docker container is hosted outside of my local computer I will need to enter the IP address of my ec2 instance with port 8080 at the end to verify that the page is working.

After entering in the IP and the port # we can see that the site is working.

Let’s save and push the container data to AWS ECR.

First we need to create a repository with the following comand.

aws ecr create-repository --repository-name <Project Name> - region <region>

Confirm that the repository has been created by checking the AWS ECR console

Next lets create a token and log into the Docker CLI.

aws ecr get-login-password --region <region>

Then

aws ecr --region <region>| docker login -u AWS -p <Token> <ECR URI>

Next step is tag the image

docker tag <Image Name> <ECR URI>

Use the following command to push the image to ECR

docker push <ECR URI>

Let’s check the ECR console…

You will see that your image has been used to the ECR

What we have done so far

In Cloud9 environment, we created a custom Docker image with NGINX. We have completed this project by modifying a Dockerfile, that will display the date and time the container is deployed and pushing our container to ECR.