🕛

2024. 9. 26 (Docker, CI/CD)

생성일

2025/01/24 05:52

태그

front(폴더)

nginx.conf 생성

server {
    listen 80;
    server_name localhost;

    root /usr/share/nginx/html;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }

    location /api/ {
        proxy_pass http://1.2.3.4:8080;
    }
}
Plain Text
복사

Dockerfile 생성

## React 프로젝트 배포 절차 ##

# 1. node 이미지
FROM node:20 AS build

# 2. 컨테이너에 작업 디렉토리 설정
WORKDIR /app

# 3. package.json & package-lock.json을 작업 디렉토리에 복사 (와일드카드 적용 : *)
COPY package*.json ./

# 4. 의존성 업데이트 및 설치
RUN npm update
RUN npm install

# 5. 소스 코드를 컨테이너에 복사
COPY . .

# 6. React 애플리케이션 빌드
RUN npm run build

# 배포
# 1. nginx 이미지
FROM nginx:alpine

# 2. nginx 설정 파일을 교체
COPY nginx.conf /etc/nginx/conf.d/default.conf

# 3. nginx 기본 html 삭제
RUN rm -rf /usr/share/nginx/html/*

# 4. 빌드된 React 애플리케이션을 nginx 디렉토리로 복사
COPY --from=build /app/build /usr/share/nginx/html 

# 5. nginx 포트 노출
EXPOSE 80

# 6. nginx 서버 실행
CMD [ "nginx", "-g", "daemon off;" ]
Java
복사

VM에서 git pull 이후에 docker run

# Dockerfuile 이 있는 경로에서 실행할 경우 '.' 으로 표시
docker build -t frontimage .

# 이미지 생성 이후 확인
hms@ubuntu:~/2024-kosta-project/front$ docker images
REPOSITORY   TAG       IMAGE ID       CREATED              SIZE
frontimage   latest    9aba366a599d   About a minute ago   50.2MB
<none>       <none>    e8e7657380ae   2 minutes ago        1.97GB
node         20        dd223fd5024d   5 weeks ago          1.1GB
nginx        alpine    c7b4f26a7d93   6 weeks ago          43.2MB
Shell
복사

•

로그 찍어보기 + 경로 확인

docker logs -f front-container

/docker-entrypoint.sh: /docker-entrypoint.d/ is not empty, will attempt to perform configuration
/docker-entrypoint.sh: Looking for shell scripts in /docker-entrypoint.d/
/docker-entrypoint.sh: Launching /docker-entrypoint.d/10-listen-on-ipv6-by-default.sh
10-listen-on-ipv6-by-default.sh: info: Getting the checksum of /etc/nginx/conf.d/default.conf
10-listen-on-ipv6-by-default.sh: info: /etc/nginx/conf.d/default.conf differs from the packaged version
/docker-entrypoint.sh: Sourcing /docker-entrypoint.d/15-local-resolvers.envsh
/docker-entrypoint.sh: Launching /docker-entrypoint.d/20-envsubst-on-templates.sh
/docker-entrypoint.sh: Launching /docker-entrypoint.d/30-tune-worker-processes.sh
/docker-entrypoint.sh: Configuration complete; ready for start up
2024/09/26 00:51:25 [notice] 1#1: using the "epoll" event method
2024/09/26 00:51:25 [notice] 1#1: nginx/1.27.1
2024/09/26 00:51:25 [notice] 1#1: built by gcc 13.2.1 20240309 (Alpine 13.2.1_git20240309) 
2024/09/26 00:51:25 [notice] 1#1: OS: Linux 5.15.0-122-generic
2024/09/26 00:51:25 [notice] 1#1: getrlimit(RLIMIT_NOFILE): 1048576:1048576
2024/09/26 00:51:25 [notice] 1#1: start worker processes
2024/09/26 00:51:25 [notice] 1#1: start worker process 29
2024/09/26 00:51:25 [notice] 1#1: start worker process 30
192.168.233.1 - - [26/Sep/2024:01:04:31 +0000] "GET / HTTP/1.1" 304 0 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36" "-"
192.168.233.1 - - [26/Sep/2024:01:04:31 +0000] "GET /static/css/main.f855e6bc.css HTTP/1.1" 304 0 "http://192.168.233.128/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36" "-"
192.168.233.1 - - [26/Sep/2024:01:04:31 +0000] "GET /static/js/main.de9920e1.js HTTP/1.1" 304 0 "http://192.168.233.128/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36" "-"


# 1줄만 보여주기 (최신순)
docker logs --tail 1 -f front-container
192.168.233.1 - - [26/Sep/2024:01:04:31 +0000] "GET /static/js/main.de9920e1.js HTTP/1.1" 304 0 "http://192.168.233.128/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36" "-"

# sh 접속
hms@ubuntu:~/2024-kosta-project/front$ docker exec -it front-container /bin/sh

/ # ls
bin                   home                  proc                  sys
dev                   lib                   root                  tmp
docker-entrypoint.d   media                 run                   usr
docker-entrypoint.sh  mnt                   sbin                  var
etc                   opt                   srv
/ # cd usr/share/nginx/html
/usr/share/nginx/html # ls
asset-manifest.json  index.html           logo512.png          robots.txt
favicon.ico          logo192.png          manifest.json        static
/usr/share/nginx/html # cat index.html
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>React App</title><script defer="defer" src="/static/js/main.de9920e1.js"></script><link href="/static/css/main.f855e6bc.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>/usr/share/nginx/html # 
Shell
복사

docker run -d --name front-container -p 80:80 front-image

hms@ubuntu:~/2024-kosta-project/front$ docker images
REPOSITORY    TAG       IMAGE ID       CREATED          SIZE
front-image   latest    87ed939d1f53   4 seconds ago    50.2MB
<none>        <none>    e2102b88367b   5 seconds ago    1.97GB
<none>        <none>    e8e7657380ae   38 minutes ago   1.97GB
node          20        dd223fd5024d   5 weeks ago      1.1GB
nginx         alpine    c7b4f26a7d93   6 weeks ago      43.2MB
hms@ubuntu:~/2024-kosta-project/front$ docker rmi e8e
Deleted: sha256:e8e7657380ae36b037c958c3fe64100e1c79cb4aaedbb526d6ce5e2db682eb24
Deleted: sha256:e7e8a1538893edeb505532c415c8136101f8dc5ee1edaa6245903690a25753d2
Deleted: sha256:518c50e89e4251253f5b245bd890346e97acfa6f37a80de7712dab349215ee64
Deleted: sha256:4675debf5af52336fb8e703ff69987cf80bcb3c1aa30b2169daa021c38a01a28
hms@ubuntu:~/2024-kosta-project/front$ docker images
REPOSITORY    TAG       IMAGE ID       CREATED          SIZE
front-image   latest    87ed939d1f53   54 seconds ago   50.2MB
<none>        <none>    e2102b88367b   55 seconds ago   1.97GB
node          20        dd223fd5024d   5 weeks ago      1.1GB
nginx         alpine    c7b4f26a7d93   6 weeks ago      43.2MB
hms@ubuntu:~/2024-kosta-project/front$ docker run -d --name front-container -p 80:80 front-image
188d7ca39f2b08a8c0ab88f22885466736b8381efe7d5779634057ddfbde5b5e
Shell
복사

Backend(폴더)

Dockerfile

# 빌드
# 1. 빌드 이미지 (gradle)
FROM gradle:8-jdk17-alpine AS build

# 2. 컨테이너 작업 디렉토리 설정
WORKDIR /app

# 3. Gradle 파일만 복사
COPY build.gradle settings.gradle gradlew ./
COPY gradle ./gradle

# 4. 프로젝트 파일 전체 복사
COPY . .

# 5. gradlew 파일에 실행 권한을 추가 부여 (gradlew은 빌드를 진행하기 위한 파일)
# [r : 읽기 권한, w : 쓰기 권한, x : 실행 권한]
RUN chmod +x gradlew

# 6. 빌드 실행
RUN ./gradlew clean build -x test

# 배포
# 1. openjdk 이미지
FROM openjdk:17-jdk-alpine

# 2. 컨테이너 작업 디렉토리 설정
WORKDIR /app

# 3. 빌드 단계에서 생성된 jar 파일 복사 (build.gradle jar { enabled: false })
COPY --from=build /app/build/libs/*.jar /app/app.jar

# 4. 포트 노출
EXPOSE 8080

# 5. 애플리케이션 실행
ENTRYPOINT [ "java", "-jar", "/app/app.jar" ]
Shell
복사

VM에서 git pull 이후 이미지 생성 + mysql setting

docker build -t back-image .

docker pull mysql

ms@ubuntu:~/2024-kosta-project/back$ docker run \
> -d \
> --name mysql-container \
> -p 3306:3306 \
> -e MYSQL_ROOT_PASSWORD=1234 \
> -e MYSQL_USER=codesche \
> -e MYSQL_PASSWORD=1234 \
> -e MYSQL_DATABASE=rest_blog_db \
> -e TZ=Asia/Seoul \
> mysql
be0be3b5b948a5e36d3d82588f606247a360662573ec5fe2c44bf2238aef9d94
hms@ubuntu:~/2024-kosta-project/back$ docker ps
CONTAINER ID   IMAGE         COMMAND                  CREATED          STATUS          PORTS                                                  NAMES
be0be3b5b948   mysql         "docker-entrypoint.s…"   3 seconds ago    Up 2 seconds    0.0.0.0:3306->3306/tcp, :::3306->3306/tcp, 33060/tcp   mysql-container
188d7ca39f2b   front-image   "/docker-entrypoint.…"   33 minutes ago   Up 33 minutes   0.0.0.0:80->80/tcp, :::80->80/tcp                      front-container
hms@ubuntu:~/2024-kosta-project/back$ docker exec -it mysql-container mysql -u root -p
Enter password: 
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 8
Server version: 9.0.1 MySQL Community Server - GPL

Copyright (c) 2000, 2024, Oracle and/or its affiliates.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql> 

mysql> show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| mysql              |
| performance_schema |
| rest_blog_db       |
| sys                |
+--------------------+
5 rows in set (0.00 sec)
Shell
복사

Mysql 8버전으로 변경

hms@ubuntu:~/2024-kosta-project$ docker stop mysql-container
mysql-container
hms@ubuntu:~/2024-kosta-project$ docker rm mysql-container
mysql-container
hms@ubuntu:~/2024-kosta-project$ docker rmi mysql:latest 
Untagged: mysql:latest
Shell
복사

Docker Network 생성

hms@ubuntu:~/2024-kosta-project$ docker network create kosta-net
970b6b04c809fc242d3b025743decf6a27858f72404630b6169e0b57661a77e2
hms@ubuntu:~/2024-kosta-project$ docker network ls
NETWORK ID     NAME                        DRIVER    SCOPE
81e2e1ded856   bridge                      bridge    local
a801247236dd   host                        host      local
970b6b04c809   kosta-net                   bridge    local
fc5689946292   none                        null      local
c647ffc00bdc   rest_shopping_jpa-network   bridge    loca
Shell
복사

Docker 기본 절차

•

이미지 빌드 → 컨테이너 생성

docker build -t back-image .
docker images
docker run -d --name back-container -p 8080:8080 -e SPRING_DATASOURCE_URL=jdbc:mysql://mysql-container:3306/rest_blog_db -e SPRING_DATASOURCE_USERNAME=root -e SPRING_DATASOURCE_PASSWORD=1234 --network kosta-net back-image
Shell
복사

Docker-compose yml 파일 생성 위한 초기화

hms@ubuntu:~/2024-kosta-project/back$ docker stop front-container back-container mysql-container
front-container
back-container
mysql-container
hms@ubuntu:~/2024-kosta-project/back$ docker rm front-container back-container mysql-container
front-container
back-container
mysql-container
hms@ubuntu:~/2024-kosta-project/back$ docker ps -a
CONTAINER ID   IMAGE          COMMAND                  CREATED       STATUS                     PORTS     NAMES
660c94f1e4d3   f05d9449e619   "/bin/sh -c './gradl…"   4 hours ago   Exited (126) 4 hours ago             charming_williamson
hms@ubuntu:~/2024-kosta-project/back$ docker rm 660c
660c
hms@ubuntu:~/2024-kosta-project/back$ docker images
REPOSITORY    TAG              IMAGE ID       CREATED          SIZE
back-image    latest           f95d8a9d5226   23 minutes ago   377MB
<none>        <none>           01f78139c4ef   23 minutes ago   660MB
<none>        <none>           a6543a52708b   3 hours ago      660MB
<none>        <none>           894ff6326204   3 hours ago      377MB
<none>        <none>           3af1ab7b093f   3 hours ago      660MB
<none>        <none>           0c16c8268714   4 hours ago      660MB
<none>        <none>           f05d9449e619   4 hours ago      608MB
front-image   latest           87ed939d1f53   4 hours ago      50.2MB
<none>        <none>           e2102b88367b   4 hours ago      1.97GB
gradle        8-jdk17-alpine   b3c54050e08c   2 weeks ago      555MB
node          20               dd223fd5024d   5 weeks ago      1.1GB
nginx         alpine           c7b4f26a7d93   6 weeks ago      43.2MB
mysql         8                f742bd39cd6b   2 months ago     584MB
openjdk       17-jdk-alpine    264c9bdce361   3 years ago      326MB
hms@ubuntu:~/2024-kosta-project/back$ docker network rm kosta-net
kosta-net
hms@ubuntu:~/2024-kosta-project/back$ docker rmi $(docker images -q)
Shell
복사

Docker-compose yml 파일 생성

•

Docker-compose는 network도 같이 생성해준다.

Front

version: '3'
services:
  react-app:
    build:
      context: .
    container_name: front-container
    ports:
      - "80:80"
Docker
복사

Dockerfile  nginx.conf  package.json  public  README.md  src
hms@ubuntu:~/2024-kosta-project/front$ git pull
remote: Enumerating objects: 7, done.
remote: Counting objects: 100% (7/7), done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 4 (delta 3), reused 3 (delta 2), pack-reused 0 (from 0)
Unpacking objects: 100% (4/4), 392 bytes | 130.00 KiB/s, done.
From https://github.com/codesche/2024-kosta-project
   b0875b7..c7a841c  main       -> origin/main
Updating b0875b7..c7a841c
Fast-forward
 front/{src => }/docker-compose.yml | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename front/{src => }/docker-compose.yml (100%)
hms@ubuntu:~/2024-kosta-project/front$ ls
docker-compose.yml  Dockerfile  nginx.conf  package.json  public  README.md  src
hms@ubuntu:~/2024-kosta-project/front$ docker-compose up -d

# 삭제 후 다시 빌드 (진행 시 실행하지는 않았음)
hms@ubuntu:~/2024-kosta-project/front$ docker-compose up --build -d
Shell
복사

Back

•

build.gradle

plugins {
	id 'java'
	id 'org.springframework.boot' version '3.3.3'
	id 'io.spring.dependency-management' version '1.1.6'
}

group = 'com.kosta'
version = '0.0.1-SNAPSHOT'

// executable jar 파일만 생성
// 해당 단계 수행 위해 적용
// Dockerfile - 3. 빌드 단계에서 생성된 jar 파일 복사 (build.gradle jar { enabled: false })
jar {
	enabled = false
}

java {
	toolchain {
		languageVersion = JavaLanguageVersion.of(17)
	}
}

configurations {
	compileOnly {
		extendsFrom annotationProcessor
	}
}

repositories {
	mavenCentral()
}

dependencies {
	// OAuth2
	implementation 'org.springframework.boot:spring-boot-starter-oauth2-client'

	// JWT 추가
    implementation 'io.jsonwebtoken:jjwt-api:0.12.6'
    runtimeOnly 'io.jsonwebtoken:jjwt-impl:0.12.6'
    runtimeOnly 'io.jsonwebtoken:jjwt-jackson:0.12.6'
    
	implementation 'org.springframework.boot:spring-boot-starter-data-jpa'
	implementation 'org.springframework.boot:spring-boot-starter-security'
	implementation 'org.springframework.boot:spring-boot-starter-web'
	compileOnly 'org.projectlombok:lombok'
	developmentOnly 'org.springframework.boot:spring-boot-devtools'
	runtimeOnly 'com.mysql:mysql-connector-j'
	annotationProcessor 'org.projectlombok:lombok'
	testImplementation 'org.springframework.boot:spring-boot-starter-test'
	testImplementation 'org.springframework.security:spring-security-test'
	testRuntimeOnly 'org.junit.platform:junit-platform-launcher'
}

tasks.named('test') {
	useJUnitPlatform()
}
Plain Text
복사

•

docker-compose.yml

version: '3'
services:
  mysql:
    image: mysql:8
    container_name: mysql-container
    environment:
      - MYSQL_ROOT_PASSWORD=1234 
      - MYSQL_USER=codesche 
      - MYSQL_PASSWORD=1234 
      - MYSQL_DATABASE=rest_blog_db 
      - TZ=Asia/Seoul 
    ports:
      - "3306:3306"
    networks:
      - kosta-net
  back-image:
    build:
      context: .
    container_name: back-container
    ports:
      - "8080:8080"
    environment:
      - SPRING_DATASOURCE_URL=jdbc:mysql://mysql-container:3306/rest_blog_db
      - SPRING_DATASOURCE_USERNAME=root
      - SPRING_DATASOURCE_PASSWORD=1234
    networks:
      - kosta-net
    depends_on:
      - mysql
    restart: always
networks:
  kosta-net:
    driver: bridge
Docker
복사

•

git pull 이후

# docker-compose 실행
docker-compose up -d
Docker
복사