Building and Updating Docker Containers: A Practical Hands-On Guide for Beginners

Introduction ## Prerequisites ## Step 1: Prepare the Application ## Step 2: Create the Dockerfile ## Step 3: Build the Docker Image ## Step 4: Run Your Container ## Step 5: Verify Running Containers ## Step 6: Update the Application In today’s fast-paced development environment, consistency and portability are critical. Applications must run reliably across different machines, environments, or even in the cloud. Docker provides a solution by packaging your application along with its dependencies into a container, ensuring it behaves the same everywhere. In this hands-on guide, you’ll learn how to containerize a simple Node.js “Todo List” application. You don’t need prior experience with Node.js — the focus is on understanding how Docker builds, packages, and runs applications. By the end of this tutorial, you’ll be able to: Ensure you have the following tools installed: These tools allow you to build and run containers smoothly. Open a new folder in VS Code and name it container. Open a terminal in that folder. Clone the sample Node.js application: You’ll see the following folder structure: This is the source code you will containerize. In the getting-started-app folder, create a file named Dockerfile and add: This file tells Docker how to build your image. Navigate to your project folder by doing ls and cd into the folder/directory: Visit http://localhost:3000 in your browser. Your Todo List app should be running. Add tasks, mark them complete, and see how everything works inside the container. To check which containers are running: You’ll see the container ID, image name, port mappings, and status — confirming that your app is active. Suppose you want to change the “empty text” message to: docker ps: To get the ID of the container, then insert the Container ID into the docker stop and docker rm to update Refresh http://localhost:3000 to see your updated text. Templates let you quickly answer FAQs or store snippets for re-use. Hide child comments as well For further actions, you may consider blocking this person and/or reporting abuse COMMAND_BLOCK:

git clone https://github.com/docker/getting-started-app.git COMMAND_BLOCK:
git clone https://github.com/docker/getting-started-app.git COMMAND_BLOCK:
git clone https://github.com/docker/getting-started-app.git CODE_BLOCK:
getting-started-app/
│── .dockerignore
│── package.json
│── README.md
│── spec/
│── src/
└── yarn.lock CODE_BLOCK:
getting-started-app/
│── .dockerignore
│── package.json
│── README.md
│── spec/
│── src/
└── yarn.lock CODE_BLOCK:
getting-started-app/
│── .dockerignore
│── package.json
│── README.md
│── spec/
│── src/
└── yarn.lock COMMAND_BLOCK:
# syntax=docker/dockerfile:1 FROM node:lts-alpine
WORKDIR /app
COPY . .
RUN yarn install --production
CMD ["node", "src/index.js"]
EXPOSE 3000 COMMAND_BLOCK:
# syntax=docker/dockerfile:1 FROM node:lts-alpine
WORKDIR /app
COPY . .
RUN yarn install --production
CMD ["node", "src/index.js"]
EXPOSE 3000 COMMAND_BLOCK:
# syntax=docker/dockerfile:1 FROM node:lts-alpine
WORKDIR /app
COPY . .
RUN yarn install --production
CMD ["node", "src/index.js"]
EXPOSE 3000 COMMAND_BLOCK:
cd /path/to/getting-started-app COMMAND_BLOCK:
cd /path/to/getting-started-app COMMAND_BLOCK:
cd /path/to/getting-started-app COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started CODE_BLOCK:
You have no todo items yet! Add one above! CODE_BLOCK:
You have no todo items yet! Add one above! CODE_BLOCK:
You have no todo items yet! Add one above! CODE_BLOCK:
- <p className="text-center">No items yet! Add one above!</p>
+ <p className="text-center">You have no todo items yet! Add one above!</p> CODE_BLOCK:
- <p className="text-center">No items yet! Add one above!</p>
+ <p className="text-center">You have no todo items yet! Add one above!</p> CODE_BLOCK:
- <p className="text-center">No items yet! Add one above!</p>
+ <p className="text-center">You have no todo items yet! Add one above!</p> COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker build -t getting-started . COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -d -p 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker ps
docker stop <container-id> docker rm <container-id> COMMAND_BLOCK:
docker ps
docker stop <container-id> docker rm <container-id> COMMAND_BLOCK:
docker ps
docker stop <container-id> docker rm <container-id> COMMAND_BLOCK:
docker run -dp 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -dp 127.0.0.1:3000:3000 getting-started COMMAND_BLOCK:
docker run -dp 127.0.0.1:3000:3000 getting-started - Build a Docker image using a Dockerfile
- Run your application inside a container
- Expose your app to your local host
- Understand how images, containers, and layers interact - Docker Desktop (latest version)
- Git (for cloning the sample app)
- VS Code or another code editor - Open a new folder in VS Code and name it container.
- Open a terminal in that folder.
- Clone the sample Node.js application: - FROM selects a lightweight Node.js image
- WORKDIR sets the working directory inside the container
- COPY transfers your source code into the container
- RUN installs your dependencies
- CMD defines the command to start the app
- EXPOSE documents the port your app listens on - Docker downloads the Node.js base image (if not already on your machine)
- Copies your app files
- Installs dependencies
- Packages everything into a Docker image named getting-started - -d: runs the container in the background
- -p HOST:CONTAINER: maps container port 3000 to your local port 3000 - Edit src/static/js/app.js and update line 56: - Rebuild the Docker image: - Start a new container using the updated code, You probably saw an error. - Stop the old container: - Start the updated container: