[예제] 프론트엔드(HTML, CSS, Nginx) 서버를 파드(Pod)로 띄워보기

author

JSCODE 박재성

✅ 프론트엔드(HTML, CSS, Nginx) 서버를 파드(Pod)로 띄워보기

HTML, CSS 파일 만들기

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이라고 지어야 한다.

style.css


* {
  color: blue;
}

실행시켜보기

Dockerfile 작성하기

nginx - Official Image | Docker Hub

Official build of Nginx.

https://hub.docker.com/_/nginx

Dockerfile


FROM nginx 
COPY ./ /usr/share/nginx/html

Dockerfile을 바탕으로 이미지 빌드하기


$ docker build -t my-web-server .

이미지가 잘 생성됐는 지 확인하기


$ docker image ls

매니페스트 파일 작성하기

web-server-pod.yaml


apiVersion: v1
kind: Pod
metadata:
  name: web-server-pod
spec:
  containers:
    - name: web-server-container
      image: my-web-server
      imagePullPolicy: IfNotPresent
      ports:
        - containerPort: 80

매니페스트 파일을 기반으로 파드(Pod) 생성하기


$ kubectl apply -f web-server-pod.yaml

파드(Pod)가 잘 생성됐는 지 확인


$ kubectl get pods

포트 포워딩으로 웹 서버가 실행됐는 지 확인


$ kubectl port-forward web-server-pod 5000:80

파드 삭제하기


$ kubectl delete pod web-server-pod

author