Containerize a Personal Website

Build and run a personal website inside a Docker container using Nginx.

Introduction

30 Second Summary

Every app you use lives on a computer somewhere. Containers are the boxes that package an app with everything it needs to run, so it works the same way on any computer.

In this project, you will build a personal webpage and package it inside a Docker container. By the end, your website will be live in your browser, served entirely from inside a container you built from scratch.

What You'll Build

You will create an "About Me" webpage with HTML and CSS, then package it inside a Docker container using Nginx as the web server.

By the end of this project, you'll have:

  • A personal website running inside a Docker container, accessible at localhost in your browser.
  • A custom Docker image built from a Dockerfile you wrote from scratch.
  • Hands-on experience with the core Docker workflow: write code, build image, run container, and manage containers.
  • Secret Mission: rebuild your image with changes and run two versions of your site side by side on different ports.

Are there any prerequisites?

You need Docker Desktop and VS Code downloaded on your computer. No prior Docker or coding experience is required.

Before We Start

Before We Start...

Verify Docker Desktop Is Running

Before you start building, the Docker engine needs to be running on your machine. Docker Desktop is the application that manages this engine.

Let's verify everything works by running a quick test container.

What is a container?

A container is a lightweight, isolated environment that runs an application with everything it needs to work. It bundles your code, dependencies, and settings together so the application runs the same way on any machine.

In this step, get ready to:
  • Open Docker Desktop and confirm the engine is running.
  • Verify Docker is accessible from the command line.
  • Run your first container.
Open Docker Desktop

Docker Desktop runs the Docker engine in the background. The engine needs to be active before you can use any Docker commands in your terminal.

  • Press Cmd+Space (macOS) or the Windows key (Windows) to open your search bar.
  • Type Docker Desktop and press Enter to open it.

First time opening Docker Desktop?

You'll see a Docker Subscription Service Agreement. Accept it to continue. Docker Desktop is free for personal use and learning.

Docker Desktop takes a moment to start the engine. You should see Engine running in the bottom-left corner of the Docker Desktop window.

Engine not starting?

  • Make sure Docker Desktop is fully installed, not just downloaded. Run the installer if you haven't already.
  • On Windows, Docker Desktop requires WSL 2. The installer usually handles this automatically, but you may need to restart your computer after installation.
  • Try quitting Docker Desktop completely, then reopening it.

Docker Desktop engine won't start on my machine. How do I fix this?

Check that Docker works in your terminal

Docker Desktop runs the engine, but you interact with Docker through terminal commands. Let's confirm your terminal can reach the engine.

  • Press Cmd+Space (macOS) or the Windows key (Windows) to open your search bar.
  • Type VS Code and press Enter to open it.
  • Click Terminal in the top menu bar.
  • Click New Terminal (or press Ctrl+`).
  • Confirm Docker is accessible by running this command:
docker --version

✔️ I see a version number

The exact version doesn't matter. Something like Docker version 28.x.x confirms Docker is ready. On to the next check.

ⓧ Command not found

Docker isn't reachable from your terminal. Try these fixes:

  • Make sure Docker Desktop is open and shows Engine running.
  • Close your VS Code terminal and open a new one (Terminal > New Terminal). The terminal needs to start after Docker Desktop is running to pick up the path.
  • If it still doesn't work, restart Docker Desktop completely and open a fresh terminal.

Docker command not found even though Docker Desktop is running. How do I fix this?

Run your first container

The hello-world image is a tiny test image hosted on Docker Hub. Running it confirms your entire Docker setup is working end to end.

  • Run your first container by entering this command:
docker run hello-world

You should see Docker pull the image, then print a message that includes Hello from Docker! in the output.

What just happened?

  • Docker looked for the hello-world image on your machine and didn't find it.
  • It downloaded the image from Docker Hub, which is Docker's public registry for container images.
  • It created a container from that image and ran it, which printed the greeting message.

Don't see 'Hello from Docker!'?

  • Check that Docker Desktop is still running and shows Engine running.
  • If you see a network error, check your internet connection. Docker needs to download the image from Docker Hub the first time you run it.

docker run hello-world isn't working. How do I troubleshoot this?

Your Docker setup is confirmed and ready to go. Next up, you'll create the personal website that you'll package into a container.

Create Your Personal Website

Your Docker environment is verified and ready to go. Now you need something to actually containerize.

In this step, you will create a personal "About Me" webpage using HTML and CSS. These two files are the website content that you will package into a Docker container in the next step.

In this step, get ready to:
  • Create a project folder and open it in VS Code.
  • Build an HTML page with your name, a short bio, and a list of things you are learning.
  • Style the page with CSS to give it a clean, dark-themed look.
Set up your project folder

Every Docker project starts with a folder that holds all the files you want to package into a container. You will create a dedicated folder on your Desktop so it is easy to find.

  • Move to your Desktop by running this command in your VS Code terminal:
cd ~/Desktop
  • Create your project folder and move into it by running these commands:
mkdir docker-website
cd docker-website
  • Confirm the folder was created by running:
ls

The output should be empty because the folder is brand new. That is expected.

  • Open this folder in a new VS Code window by running:
code .

What does this command do?

The code . command tells VS Code to open the current folder (the . means "this directory"). A new VS Code window opens with the empty docker-website folder loaded in the Explorer sidebar.

  • Continue working in this new VS Code window from now on.
  • Open a terminal in the new window by clicking Terminal in the top menu bar, then New Terminal.

Your terminal prompt should show docker-website as the current directory.

code . not recognized?

If your terminal says the code command is not found, VS Code may not be in your system PATH. Open VS Code manually instead.

  • Press Cmd+Space (macOS) or the Windows key (Windows) to open your search bar.
  • Type Visual Studio Code and press Enter to open it.
  • Click File in the top menu bar.
  • Click Open Folder.
  • Navigate to your Desktop, select the docker-website folder, and click Open.

Why can't I open my project folder in VS Code?

Build the HTML page

Your website needs an index.html file. This is the main page that a web server looks for when someone visits your site.

  • In the VS Code Explorer sidebar on the left, hover over the DOCKER-WEBSITE heading.
  • Click the New File icon (a page with a + sign).
  • Type index.html and press Enter.

The file opens in the editor. It is empty for now.

  • Copy and paste the following HTML into index.html:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Dockerized Website</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>Hi, I'm Learning Docker!</h1>
        <p>This website is running inside a Docker container using Nginx. I built it from scratch as my first Docker project.</p>

        <h2>Things I'm Learning</h2>
        <ul>
            <li>How to write a Dockerfile</li>
            <li>How to build Docker images</li>
            <li>How to run containers with port mapping</li>
            <li>How to manage container lifecycles</li>
        </ul>

        <div class="footer">
            <p>Served by Nginx in a Docker container</p>
        </div>
    </div>
</body>
</html>

What does this HTML do?

  • The <head> section sets up the page title and links to a stylesheet called style.css (you will create this file next).
  • The <div class="container"> wraps all the visible content into a single card layout.
  • The <ul> list shows four Docker skills you are learning in this project.
  • The footer div at the bottom shows that the page is served by Nginx inside a Docker container.
  • Save index.html by pressing Cmd+S (macOS) or Ctrl+S (Windows).
  • Right-click index.html in the VS Code Explorer sidebar.
  • Select Reveal in File Explorer (Windows) or Reveal in Finder (macOS).
  • Double-click index.html to open it in your browser.

You should see your heading, paragraph, and list items displayed in plain black-and-white text. The page has no styling yet because the style.css file does not exist.

Seeing a blank page?

  • Make sure you saved the file before opening it. Look for a white dot on the index.html tab in VS Code. A white dot means unsaved changes.
  • Check that the file is named exactly index.html with no extra spaces or typos.
  • Confirm you pasted the full HTML starting from <!DOCTYPE html> all the way to the closing </html> tag.

Why is my HTML page blank in the browser?

✔️ Awesome, I've got everything!

Great. Make sure you have saved index.html before moving on.

ⓧ I'd like to double check the full code

Here is the complete index.html file. Compare it against yours to make sure everything matches.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Dockerized Website</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>Hi, I'm Learning Docker!</h1>
        <p>This website is running inside a Docker container using Nginx. I built it from scratch as my first Docker project.</p>

        <h2>Things I'm Learning</h2>
        <ul>
            <li>How to write a Dockerfile</li>
            <li>How to build Docker images</li>
            <li>How to run containers with port mapping</li>
            <li>How to manage container lifecycles</li>
        </ul>

        <div class="footer">
            <p>Served by Nginx in a Docker container</p>
        </div>
    </div>
</body>
</html>
Add the page layout styles

Your HTML page works, but it looks plain. A CSS file controls how the page looks in the browser. You will create a dark-themed design with centered content.

  • In the VS Code Explorer sidebar, click the New File icon again.
  • Type style.css and press Enter.
  • Copy and paste the following CSS into style.css:
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    background-color: #0d1117;
    color: #e6edf3;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
}

.container {
    max-width: 600px;
    background-color: #161b22;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid #30363d;
}

What does this CSS do?

  • The * selector resets all default browser spacing so every element starts from a clean slate.
  • The body styles set a dark background (#0d1117), light text, and use flexbox to center everything on the page.
  • The .container class creates a card with rounded corners and a subtle border.
  • Save style.css and refresh your browser tab where index.html is open.

You should see a dark page with your content centered in a rounded card. The headings and text are still unstyled, but the layout is in place.

Style the content elements

The page shell looks good. Now you need styles for the headings, paragraph text, list items, and footer.

  • In style.css, add the following CSS below the .container block you just pasted:
h1 {
    color: #58a6ff;
    margin-bottom: 16px;
    font-size: 1.8rem;
}

h2 {
    color: #58a6ff;
    margin-top: 24px;
    margin-bottom: 12px;
    font-size: 1.3rem;
}

p {
    line-height: 1.6;
    margin-bottom: 8px;
}

ul {
    list-style: none;
    padding-left: 0;
}

ul li {
    padding: 8px 0;
    border-bottom: 1px solid #30363d;
}

ul li:last-child {
    border-bottom: none;
}

ul li::before {
    content: "🐳 ";
}

.footer {
    margin-top: 32px;
    padding-top: 16px;
    border-top: 1px solid #30363d;
    text-align: center;
    font-size: 0.85rem;
    color: #8b949e;
}

What does this CSS do?

  • The h1 and h2 styles turn the headings blue (#58a6ff) and add spacing between sections.
  • The ul li::before rule adds a whale emoji before each list item, replacing the default bullet points.
  • The .footer section adds a top border and muted gray text to visually separate the footer from the main content.
  • Save style.css and refresh your browser.

You should see blue headings, whale emojis before each list item, and a small gray footer at the bottom of the card. Your personal website is complete.

Styles not showing up?

  • Make sure you saved both index.html and style.css. Unsaved changes will not appear in the browser.
  • Confirm that style.css is in the same folder as index.html. The HTML file references href="style.css" which means the browser looks for it in the same directory.
  • Try a hard refresh with Cmd+Shift+R (macOS) or Ctrl+Shift+R (Windows) to clear the browser cache.

Why isn't my CSS styling showing up in the browser?

✔️ Awesome, I've got everything!

Great. Make sure you have saved style.css before moving on.

ⓧ I'd like to double check the full code

Here is the complete style.css file. Compare it against yours to make sure everything matches.

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    background-color: #0d1117;
    color: #e6edf3;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
}

.container {
    max-width: 600px;
    background-color: #161b22;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid #30363d;
}

h1 {
    color: #58a6ff;
    margin-bottom: 16px;
    font-size: 1.8rem;
}

h2 {
    color: #58a6ff;
    margin-top: 24px;
    margin-bottom: 12px;
    font-size: 1.3rem;
}

p {
    line-height: 1.6;
    margin-bottom: 8px;
}

ul {
    list-style: none;
    padding-left: 0;
}

ul li {
    padding: 8px 0;
    border-bottom: 1px solid #30363d;
}

ul li:last-child {
    border-bottom: none;
}

ul li::before {
    content: "🐳 ";
}

.footer {
    margin-top: 32px;
    padding-top: 16px;
    border-top: 1px solid #30363d;
    text-align: center;
    font-size: 0.85rem;
    color: #8b949e;
}

Your personal website is ready. Next up, you will write a Dockerfile that packages this site into a Docker image so it can run inside a container.

Write a Dockerfile

Your website files are ready. Now you need to give Docker a set of instructions for how to package them into a container.

You do this through a Dockerfile, a special text file that lists every instruction Docker needs to build an image. In this step, you'll write one from scratch.

In this step, get ready to:
  • Create a Dockerfile in your project folder.
  • Choose a lightweight base image for your container.
  • Add instructions to copy your website files into the image.
Create a Dockerfile and set the base image

A Dockerfile is a plain text file with no file extension. Docker reads it line by line to know exactly how to build your image.

  • In the Explorer sidebar in VS Code, click the New File icon (at the top of the file list).
  • Name the file Dockerfile with a capital D and no file extension.
  • Confirm the file was created by running this in your terminal:
ls

You should see Dockerfile, index.html, and style.css in the output.

What is a Dockerfile?

Think of a Dockerfile as a recipe. Each line is one instruction that tells Docker what to include in your image. Docker reads these instructions from top to bottom and follows them in order.

  • Click on Dockerfile in the Explorer sidebar to open it.
  • Add the base image instruction by pasting this code into Dockerfile:
FROM nginx:1.29.8-alpine

What is a base image?

Every Dockerfile starts with a FROM instruction that sets the base image. A base image is a pre-built starting point for your container.

nginx:1.29.8-alpine is the official Nginx web server image built on Alpine Linux. Alpine is a tiny Linux distribution (around 35 MB), which keeps your container lightweight and fast to build.

  • Save Dockerfile.

You won't see a visible change yet. The next substep adds the remaining instructions to your Dockerfile.

Copy your website files into the image

Your base image gives you a web server, but it does not have your website files yet. You need to tell Docker to copy them in.

  • In Dockerfile, add the following lines below the FROM instruction:
COPY index.html /usr/share/nginx/html/
COPY style.css /usr/share/nginx/html/

EXPOSE 80

What does this code do?

  • COPY index.html /usr/share/nginx/html/ copies your HTML file into Nginx's default web directory. This is where Nginx looks for files to serve.
  • COPY style.css /usr/share/nginx/html/ does the same for your stylesheet.
  • EXPOSE 80 declares that the container listens on port 80. This is the default port for web traffic.
  • Save Dockerfile.

You won't see a visible change yet. The next step builds this Dockerfile into an image you can run.

Seeing red squiggles in your Dockerfile?

VS Code might show warnings if it doesn't have a Docker extension installed. This is cosmetic and won't affect your build.

Make sure each instruction (FROM, COPY, EXPOSE) starts at the very beginning of its line with no extra spaces before it.

Help me fix a Dockerfile syntax issue

Review your complete Dockerfile

Your Dockerfile should now have three types of instructions: FROM (the base image), COPY (your website files), and EXPOSE (the port declaration).

Why is there no CMD instruction?

Many Dockerfiles end with a CMD instruction that tells the container what command to run at startup.

The nginx:1.29.8-alpine base image already includes a default CMD that starts the Nginx web server. You don't need to add one.

✔️ Awesome, I've got everything!

Great. Double check you've saved Dockerfile before moving on.

ⓧ I'd like to double check the full code

Here is the complete Dockerfile. Make sure yours matches exactly.

FROM nginx:1.29.8-alpine

COPY index.html /usr/share/nginx/html/
COPY style.css /usr/share/nginx/html/

EXPOSE 80

Your Dockerfile is ready. Next up, you'll build it into an image and run your website inside a container.

Build and Run Your Container

Your Dockerfile is complete. It contains every instruction Docker needs to package your website alongside the Nginx web server.

Right now, those instructions are just sitting on disk. In this step, you will turn them into a real, running website by building a Docker image and launching a container from it.

In this step, get ready to:
  • Build a Docker image from your Dockerfile.
  • Run a container with port mapping to serve your site.
  • View your personal website live in the browser.
Build your Docker image

A Docker image is a snapshot of your application and everything it needs to run. The build process reads your Dockerfile and packages your website files with the Nginx web server into one portable unit.

  • Build your Docker image by running this command:
docker build -t my-website .

What does this command do?

  • docker build reads your Dockerfile and creates a new image from it.
  • -t my-website tags (names) the image my-website so you can refer to it later.
  • . tells Docker to look in the current directory for the Dockerfile and any files it references.
  • Watch the output as Docker pulls the base image and copies your files.
  • Look for a line near the end that mentions my-website:latest to confirm the image was tagged successfully.

Seeing an error during the build?

  • Make sure your terminal is inside the docker-website folder. Run cd docker-website if you navigated away.
  • Check that your file is named exactly Dockerfile with a capital D and no file extension (not Dockerfile.txt).
  • Confirm Docker Desktop is still running. You should see Engine running in the bottom-left corner of the Docker Desktop window.

Help me debug my Docker build error.

Run a container from your image

Your image is built, but an image on its own does not serve anything. You need to run a container from it to bring your website to life.

  • Start a container from your image by running this command:
docker run -d -p 8080:80 --name my-site my-website

What do these flags mean?

  • -d runs the container in detached mode (in the background), so your terminal stays free for more commands.
  • -p 8080:80 maps port 8080 on your computer to port 80 inside the container. Nginx serves your site on port 80 inside the container, but you access it through port 8080 in your browser.
  • --name my-site gives the container a friendly name instead of a randomly generated one.
  • my-website at the end tells Docker which image to create the container from.
  • You should see a long string of letters and numbers printed in your terminal. This is the container ID, confirming your container started successfully.

Seeing an error from docker run?

  • If you see a message about port 8080 already being in use, another process is using that port. Try changing 8080 to 8082 in the command.
  • If you see image not found, the docker build command did not complete successfully. Go back and run the build command again.
  • If you see a name conflict for my-site, a container with that name already exists from a previous attempt. Remove it by running docker rm -f my-site, then try the command again.

Help me fix my docker run error.

Visit your website in the browser
  • Open your web browser.
  • Type localhost:8080 in the address bar and press Enter.

You should see your personal website with the dark background, blue heading, and your list of things you are learning. This page is being served by Nginx from inside your Docker container.

What is port mapping?

Your container runs its own isolated network where Nginx listens on port 80. Your computer cannot reach port 80 inside the container directly.

The -p 8080:80 flag creates a tunnel between your computer and the container. When your browser visits localhost:8080, Docker forwards that request to port 80 inside the container, and Nginx serves your website back.

Don't see your website?

  • Make sure you are visiting http://localhost:8080 and not https://localhost:8080. Nginx is not configured for HTTPS in this project.
  • Go back to your terminal and run docker ps. If you do not see my-site in the list, the container is not running. Try the docker run command again.

Help me figure out why my website is not loading at localhost:8080.

Your website is live inside a Docker container. Next up, you will peek inside the running container and learn how to manage its lifecycle.

Explore and Manage Your Container

In the last step, you built a Docker image and launched your personal website inside a running container. Now it's time to learn how to manage it.

In real projects, you'll need to check which containers are running, peek inside them to debug issues, and clean them up when they're no longer needed. This step covers the essential Docker management commands.

In this step, get ready to:
  • View your running containers and built images.
  • Explore inside a running container.
  • Stop and remove a container.
View your running containers and images

Your container is running in the background right now. Docker gives you commands to see exactly what's happening across all your containers and images.

  • List all running containers by running this command:
docker ps

You should see a table with your my-site container listed. It shows the container ID, the image name (my-website), the status, and the port mapping (0.0.0.0:8080->80/tcp).

What does docker ps show?

  • CONTAINER ID is a short unique identifier for your container.
  • IMAGE is the image the container was built from.
  • STATUS tells you how long the container has been running.
  • PORTS shows the port mapping you configured with -p.
  • NAMES is the friendly name you set with --name.
  • List all your Docker images by running this command:
docker images

You should see my-website listed with a latest tag and a size of approximately 45 MB.

Why is the image only ~45 MB?

The nginx:1.29.8-alpine base image uses Alpine Linux, a minimal Linux distribution that's only about 35 MB. Your HTML and CSS files add barely any size on top of it.

View logs and explore inside your container

Docker lets you see what's happening inside a container without stopping it. You can check its logs and even open a shell to browse its file system.

  • View your container's Nginx access logs by running this command:
docker logs my-site

You should see log entries showing HTTP requests from your browser. These are the requests that were made when you visited http://localhost:8080.

  • Open a shell inside the running container by running this command:
docker exec -it my-site sh

What does this command do?

  • docker exec runs a command inside a running container.
  • -it makes the session interactive so you can type commands.
  • my-site is the name of your container.
  • sh is the shell program. Alpine Linux uses sh instead of bash.

Your terminal prompt changes to something like / #. You're now inside the container's file system.

  • Confirm your website files are inside the container by running this command:
ls /usr/share/nginx/html/

You should see 50x.html, index.html, and style.css listed. The 50x.html file is Nginx's default error page that came with the base image.

  • Leave the container shell by running:
exit

Your terminal returns to your normal prompt on your computer.

Seeing 'Error: No such container'?

  • Make sure you're typing the container name exactly as my-site. Container names are case-sensitive.
  • Run docker ps to confirm the container is still running. If it's not listed, it may have stopped. Re-run it with docker run -d -p 8080:80 --name my-site my-website.
  • Help me fix a 'No such container' error with docker exec.
Stop and remove your container

When you're done with a container, Docker lets you stop it and remove it. The image stays on your machine, so you can start a new container from it any time.

  • Stop the running container by running this command:
docker stop my-site

Docker gracefully shuts down the Nginx server inside the container. The container still exists in a stopped state.

  • Remove the stopped container by running this command:
docker rm my-site

This deletes the container entirely.

  • Open your browser and visit http://localhost:8080.

The page no longer loads. The container that was serving your website has been stopped and removed.

What is the difference between an image and a container?

An image is a blueprint. A container is a running instance of that blueprint. You just deleted the container, but the my-website image still exists on your machine.

You can confirm this by running docker images again. You can create a brand new container from it any time with docker run.

Page still loading at localhost:8080?

  • Your browser might be showing a cached version of the page. Try a hard refresh with Cmd+Shift+R (macOS) or Ctrl+Shift+R (Windows).
  • Run docker ps to confirm no containers are running. If my-site still appears, run docker stop my-site again.
  • Help me figure out why localhost:8080 is still loading after stopping my container.

Secret mission

Run Two Versions Side by Side

You've built and run one version of your website. What happens when you want to make changes and compare them with the original? Update your site, rebuild the image with a version tag, and run two containers side by side on different ports.

Before you go

Clean Up Your Resources

Decide whether to keep your resources running, pause them to come back later, or delete them entirely. This project runs entirely locally using Docker Desktop, so there are no ongoing cloud costs.

Resources you used:

  • Docker Desktop application.
  • Docker image: my-website.
  • Docker container: my-site.
  • The hello-world test image from Step 1.
  • Project folder: docker-website (containing index.html, style.css, and Dockerfile).

Keep everything running

No action needed. Choose this if you are still actively building or plan to continue experimenting with Docker right away.

  • Keep Docker Desktop running.
  • Your my-website image stays saved and ready to use.
  • If your container is still running, your site remains available at http://localhost:8080.

Pause - I'll come back to this later

Shut down running containers and quit Docker Desktop to free up system memory. Your image and project files stay saved on your machine.

  • Stop any running containers by running:
docker stop my-site
  • Quit Docker Desktop from the system tray or taskbar.
  • Your my-website image and your docker-website project folder remain on disk. When you come back, open Docker Desktop and run a new container from your saved image.

Delete - I don't want to use this again

Remove all project resources and start fresh. This removes your containers, images, and project files from your machine.

  • Stop and remove any running containers by running:
docker stop my-site
docker rm my-site
  • Remove your Docker images by running:
docker rmi my-website
docker rmi hello-world
  • Delete the project folder by running:
cd ~/Desktop
rm -rf docker-website
  • If you no longer need Docker Desktop, uninstall it from Settings, then Apps, then Apps & features on Windows.

Mission accomplished

That's a Wrap!

Nice work! You just containerized your first website with Docker. You built a personal webpage from scratch, packaged it inside a container, and served it to your browser using Nginx.

Here's what you learned:

  • Wrote a Dockerfile from scratch using the official Nginx Alpine base image to package a personal website with HTML and CSS.
  • Built a custom Docker image with docker build and ran it as a live container with port mapping using docker run.
  • Explored a running container with docker exec and managed the full container lifecycle with docker ps, docker stop, and docker rm.
  • Secret Mission: Ran two different versions of your site side by side using image tags and different port mappings.

Ready to quiz yourself?