1. 웹 프론트엔드 프로젝트(HTML, CSS, Nginx)를 Docker로 배포
- Windows PowerShell
PS C:\Users\admin> mkdir my-web-server
디렉터리: C:\Users\admin
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2026-05-21 오후 8:41 my-web-server
1) HTML, CSS 파일 생성
- my-web-server/index.html
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>My Web Page</h1>
</body>
</html>
* 주의
Nginx 기본 설정에 의해 메인 페이지(첫 페이지)의 파일명을 index.html 로 지어야 함
- my-web-server/style.css
* {
color: blue;
}
2) Dockerfile 작성
Docker Hub - nginx : https://hub.docker.com/_/nginx
nginx - Official Image | Docker Hub
Quick reference Supported tags and respective Dockerfile links 1.31.0, mainline, 1, 1.31, latest, 1.31.0-trixie, mainline-trixie, 1-trixie, 1.31-trixie, trixie 1.31.0-perl, mainline-perl, 1-perl, 1.31-perl, perl, 1.31.0-trixie-perl, mainline-trixi
hub.docker.com
- my-web-server/Dockerfile
FROM nginx
COPY ./ /usr/share/nginx/html
3) Dockerfile 바탕으로 이미지 빌드
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker build -t my-web-server .
[+] Building 6.8s (8/8) FINISHED docker:desktop-linux
=> [internal] load build definition from Dockerfile 0.1s
=> => transferring dockerfile: 79B 0.0s
=> [internal] load metadata for docker.io/library/nginx:latest 2.2s
=> [auth] library/nginx:pull token for registry-1.docker.io 0.0s
=> [internal] load .dockerignore 0.1s
=> => transferring context: 2B 0.0s
=> [internal] load build context 0.1s
=> => transferring context: 340B 0.0s
=> [1/2] FROM docker.io/library/nginx:latest@sha256:800e7c98538c6bf725f5177e841aa720ae0ed1c378bbea368b6330bfe18a36b3 3.7s
=> => resolve docker.io/library/nginx:latest@sha256:800e7c98538c6bf725f5177e841aa720ae0ed1c378bbea368b6330bfe18a36b3 0.1s
=> => sha256:388081780287c79616f4c942f3e0d7ce31b37e4b112917eec4c6e4b1103e7e91 1.40kB / 1.40kB 0.2s
=> => sha256:6735e617770dacdaea79e927b4a2e98dea7190e29a6315a67c6aeff9bb817e3b 1.21kB / 1.21kB 0.4s
=> => sha256:e2dc6cdcd98883bb41d951653a5c63be7a1c20d9e38018288a78fe777a5bae47 405B / 405B 0.6s
=> => sha256:fa14110e5ccbff9407edce43177fcd89d36497c2f03be55a5ede3ef12d745c86 955B / 955B 0.6s
=> => sha256:564041453b759ee0a5209b9e474b8827949318d9f7ae55f54d6da39201c55cf0 628B / 628B 0.4s
=> => sha256:cf902b7062fb3bfcceea06550605215730d9c042a8ef4a8a82684793b7741806 33.31MB / 33.31MB 2.2s
=> => sha256:5b4d6ff92fc4e14e911b7753c954fac965d48c40fe1075758d284148ccace970 29.78MB / 29.78MB 1.6s
=> => extracting sha256:5b4d6ff92fc4e14e911b7753c954fac965d48c40fe1075758d284148ccace970 0.5s
=> => extracting sha256:cf902b7062fb3bfcceea06550605215730d9c042a8ef4a8a82684793b7741806 0.5s
=> => extracting sha256:564041453b759ee0a5209b9e474b8827949318d9f7ae55f54d6da39201c55cf0 0.0s
=> => extracting sha256:fa14110e5ccbff9407edce43177fcd89d36497c2f03be55a5ede3ef12d745c86 0.0s
=> => extracting sha256:e2dc6cdcd98883bb41d951653a5c63be7a1c20d9e38018288a78fe777a5bae47 0.0s
=> => extracting sha256:6735e617770dacdaea79e927b4a2e98dea7190e29a6315a67c6aeff9bb817e3b 0.0s
=> => extracting sha256:388081780287c79616f4c942f3e0d7ce31b37e4b112917eec4c6e4b1103e7e91 0.0s
=> [2/2] COPY ./ /usr/share/nginx/html 0.1s
=> exporting to image 0.4s
=> => exporting layers 0.2s
=> => exporting manifest sha256:376de8713688046185bfd95c82f0d38e608ccac0e0ab58363e76adcd28b11398 0.0s
=> => exporting config sha256:46804899155ae59dde0931655d4885b933b3d164557b5d95c04131b2771fb0ad 0.0s
=> => exporting attestation manifest sha256:035ea125fb32fdccad550ee8cd78f6e21165ff9e79188ddbfcc38fa77d31059c 0.1s
=> => exporting manifest list sha256:f9c3a888835e53bbf1c6aeba182ab307408961eee1e8f3cefdd19412cb92481b 0.0s
=> => naming to docker.io/library/my-web-server:latest 0.0s
=> => unpacking to docker.io/library/my-web-server:latest 0.0s
View build details: docker-desktop://dashboard/build/desktop-linux/desktop-linux/meeyfjqcsiht4bg70alvnhxtm
4) 이미지 생성 확인
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker image ls
i Info → U In Use
IMAGE ID DISK USAGE CONTENT SIZE EXTRA
my-jdk17-server:beta 18e650b59b52 682MB 212MB
my-jdk17-server:latest 09a2803e5d8e 682MB 212MB U
my-node-server:latest 9a1e49574c81 1.77GB 442MB U
my-server:latest c8dad74bef6b 157MB 41.6MB U
my-web-server:latest f9c3a888835e 238MB 63.1MB
5) 생성한 이미지 컨테이너로 실행
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker run -d -p 80:80 my-web-server
c5278785a655d0ff0fd10f07af5af5b4fceacbe225ebb0619848bd013bced605
6) 컨테이너 실행 확인
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
c5278785a655 my-web-server "/docker-entrypoint.…" 15 seconds ago Up 15 seconds 0.0.0.0:80->80/tcp, [::]:80->80/tcp competent_mccarthy
7) 브라우저에서 확인
브라우저에서 http://localhost:80/ 접속
8) 컨테이너 내부 파일 확인
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker exec -it c527 bash
root@c5278785a655:/# ls
bin boot dev docker-entrypoint.d docker-entrypoint.sh etc home lib lib64 media mnt opt proc root run sbin srv sys tmp usr var
root@c5278785a655:/# cd /usr/share/nginx/html
root@c5278785a655:/usr/share/nginx/html# ls
50x.html Dockerfile index.html style.css
root@c5278785a655:/usr/share/nginx/html# exit
exit
What's next:
Try Docker Debug for seamless, persistent debugging tools in any container or image → docker debug c527
Learn more at https://docs.docker.com/go/debug-cli/
9) 실행시킨 컨테이너 중지 후 삭제, 이미지 삭제
- Windows PowerShell
PS C:\Users\admin\my-web-server> docker stop c527
c527
PS C:\Users\admin\my-web-server> docker rm c527
c527
PS C:\Users\admin\my-web-server> docker ps -a
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
47c438563cdb my-server "/bin/bash -c 'sleep…" 3 days ago Exited (0) 3 days ago nice_matsumoto
10b3825e00f9 my-node-server "/bin/bash -c 'sleep…" 7 days ago Exited (0) 7 days ago pensive_ride
e8f1ab86997c my-jdk17-server "/bin/bash -c 'sleep…" 7 days ago Exited (0) 7 days ago tender_ride
PS C:\Users\admin\my-web-server> docker image ls
i Info → U In Use
IMAGE ID DISK USAGE CONTENT SIZE EXTRA
my-jdk17-server:beta 18e650b59b52 682MB 212MB
my-jdk17-server:latest 09a2803e5d8e 682MB 212MB U
my-node-server:latest 9a1e49574c81 1.77GB 442MB U
my-server:latest c8dad74bef6b 157MB 41.6MB U
my-web-server:latest f9c3a888835e 238MB 63.1MB
PS C:\Users\admin\my-web-server> docker image rm f9c3
Untagged: my-web-server:latest
Deleted: sha256:f9c3a888835e53bbf1c6aeba182ab307408961eee1e8f3cefdd19412cb92481b
PS C:\Users\admin\my-web-server> docker image ls
i Info → U In Use
IMAGE ID DISK USAGE CONTENT SIZE EXTRA
my-jdk17-server:beta 18e650b59b52 682MB 212MB
my-jdk17-server:latest 09a2803e5d8e 682MB 212MB U
my-node-server:latest 9a1e49574c81 1.77GB 442MB U
my-server:latest c8dad74bef6b 157MB 41.6MB U
비전공자도 이해할 수 있는 Docker 입문/실전| JSCODE 박재성 - 인프런 강의
현재 평점 4.9점 수강생 14,479명인 강의를 만나보세요. 비전공자 입장에서도 쉽게 이해할 수 있고, 실전에서 바로 적용 가능한 Docker 입문/실전 강의를 만들어봤습니다! Docker 기본 개념, Spring Boot를
www.inflearn.com
'강의 실습 > 비전공자도 이해할 수 있는 Docker 입문 실전' 카테고리의 다른 글
| [실습] Docker Compose 전체 흐름 느껴보기 (Nginx 설치 및 실행) (0) | 2026.05.23 |
|---|---|
| Docker Compose를 사용하는 이유 (0) | 2026.05.22 |
| [실습] 웹 프론트엔드 프로젝트(Next.js)를 Docker로 배포하기 (0) | 2026.05.20 |
| [실습] 백엔드 프로젝트(Nest.js)를 Docker로 실행시키기 (0) | 2026.05.19 |
| EXPOSE : 컨테이너 내부에서 사용 중인 포트를 문서화하기 (0) | 2026.05.18 |
댓글