Introduction What You Will Build Today By the end of this tutorial, you will have: A live web server running inside Docker Your custom HTML page served from a container A persistent website that survives container death Screenshots proving every step works Time required: 20 minutes Prerequisites: Docker installed (I will show you how to check) Why Project-Based Learning When I started learning Docker, I watched hours of videos and forgot everything. Then I switched to building real projects. This is Project 1 of 6 in my "Docker Zero to Hero" series. Let me show you what I built, step by step. Section 1: Verifying Docker Step 1: Is Docker Alive? First, I opened my terminal (PowerShell on Windows with WSL2 enabled). command: docker --version docker ps The docker ps command showed an empty table - that is normal. No containers running yet. What I learned: docker ps only shows RUNNING containers. Use docker ps -a to see all containers including stopped ones. Section 2: Running Your First Container Step 2: The 5-Second Web Server Here is where the magic happened. I ran one command and got a production-grade web server. Command: docker run -d --name my-first-website -p 8080:80 nginx Breaking down what this means: Command part What it does docker run Create and start a container
-d Run in background (detached mode)
--name my-first-website Give it a friendly name
-p 8080:80 Map my computer's port 8080 to container's port 80 nginx The image name (web server used by Netflix) I got back a long container ID - that is proof it worked. My container appeared in the list with status "Up". Section 3: Seeing It in the Browser Step 3: Opening Your Website
I opened my browser (Chrome) and went to:
http://localhost:8080
"Welcome to nginx!" appeared. In 5 seconds, I deployed the same web server that runs Netflix, Airbnb, and Uber. My reaction: This is insane. No Apache setup. No Nginx installation. No dependency hell. What I learned: Containers package the application AND its dependencies together. That is why it "just works." Section 4: Making It Your Website Step 4: Modifying the Website A default "Welcome to nginx" page is useless for real work. Let me change it to a maintenance page my boss would actually use. First, I created my own HTML file: echo " Back at 9am. " > index.htmlThen I copied it into the running container: docker cp index.html my-first-website:/usr/share/nginx/html/index.html Refreshed my browser: What I learned: docker cp works like regular cp - but it copies files INTO a running container. The path /usr/share/nginx/html/ is where nginx looks for web files Step 5: Simulating a Crash Here is where I learned the most important lesson about containers. I stopped and removed my container:
docker stop my-first-website
docker rm my-first-website
Checked if it was gone: docker ps -a Refreshed my browser: The page was dead. My custom HTML was gone forever. Why? Containers are ephemeral - when they die, everything inside them dies too. The problem: If I deployed a real app this way, a simple restart would wipe all my data. That is unacceptable for production. Section 6: Fixing It with Volumes (Production Solution) Step 6: Persistent Storage with Volumes The solution is volume mounts - share a folder from MY computer with the container. I created a dedicated project folder: mkdir docker-project-1 && cd docker-project-1 Created a new HTML file: echo " This survives container death.
" > index.htmlRan the container with a volume mount (-v):
docker run -d --name persistent-site -p 8080:80 -v "$(pwd):/usr/share/nginx/html" nginx
What -v "$(pwd):/usr/share/nginx/html" means:
Part Meaning -v Volume mount flag "$(pwd)" My current folder on my computer : Separator /usr/share/nginx/html Folder inside the container Translation: "Docker, mirror my computer's folder inside the container. When I change files on my computer, change them in the container too." Refreshed my browser: Now for the real test. I deleted the container again: docker stop persistent-site && docker rm persistent-site Ran the SAME command again: docker run -d --name persistent-site -p 8080:80 -v "$(pwd):/usr/share/nginx/html" nginx Refreshed my browser: IT STILL WORKED. What I learned: Without volumes: Data dies with container With volumes: Data lives on your computer, containers just read it This is how databases, file uploads, and user data survive restarts in production