How to Run Spring Boot Application in a Docker Container

首先如平時作法、將寫好的專案生成 jar 檔。

  1. Maven – Clean
    http://idea0816.synology.me/wordpress/wp-content/uploads/2022/11/Maven發佈1.jpg

  2. Maven – Package
    http://idea0816.synology.me/wordpress/wp-content/uploads/2022/11/Maven發佈2.jpg

之前的作法都是先在要運行的主機上安裝好 JRE 後、再執行以下的指令

java -jar webapierp-0.1.jar

現在要在 Docker 上直接運行。先新增 Dockerfile 內容如下(20221226更新):

# jdk版本號
FROM adoptopenjdk/openjdk11:latest
# 工作目錄
RUN mkdir /opt/app
# 添加所有檔案到工作目錄中
COPY webapierp-0.1.jar /opt/app
# port
EXPOSE 9090
# 時區1
RUN apt-get update \
    &&  DEBIAN_FRONTEND=noninteractive apt-get install -y tzdata
# 時區2-胡志明    
RUN TZ=Asia/Ho_Chi_Minh \
    && ln -snf /usr/share/zoneinfo/TZ /etc/localtime \
    && echoTZ > /etc/timezone \
    && dpkg-reconfigure -f noninteractive tzdata 
# 安裝Vim
RUN DEBIAN_FRONTEND=noninteractive apt-get install -y vim
# RUN
CMD ["java", "-jar", "/opt/app/webapierp-0.1.jar"]

將 jar 和 Dockerfile 放在同一目錄下(或是直接將這2個檔案直接上傳到 Server 上)、並執行以下指令(先放圖)。

http://idea0816.synology.me/wordpress/wp-content/uploads/2022/11/截圖-2022-11-10-下午1.53.14.jpg

firstjar 可替換成自己要的名字。特別注意此指令後面有一個「 . 」、沒加上會出錯。

docker build -t firstjar . 

「 -d -p 」或「 -dp 」是為了在後台運行新容器。另外在主機創立 9090 到 容器 9090 的端口映射。

docker run -dp 9090:9090 firstjar

20221226更新:
在 Docker 上線發現有時區問題、所以修改了 Dockerfile。
DEBIAN_FRONTEND=noninteractive:在 Linux 中不需使用者交互。
執行了新的 Dockerfile 會有以下的訊息出現、以確定是否已將時區修正完成:

在 Linux 中也可使用以下指令去修正 Locltime:

# 安裝Vim
RUN DEBIAN_FRONTEND=noninteractive apt-get install -y vim

How to Run ReactJs Application in a Docker Container

踩坑了許多、在查閱眾多文件後;以下為目前最終作法(非最佳)、希望之後可以再讓其更好。

  • 在項目的根目錄下新增 Dockerfile 。

http://idea0816.synology.me/wordpress/wp-content/uploads/2022/11/截圖-2022-11-09-下午7.32.20.jpg

  • 原本寫法會使 image 暴增成近 1G 的檔案;經修改為以下的設定後目前僅有 27MB 左右。
# node 版本號(依開發時所使用的環境選擇為 18 、並加上 alpine 為穩定版)
FROM node:18-alpine as builder
# 建立工作目錄(小寫)
WORKDIR /webbyerp
# 添加所有檔案到工作目錄中
ADD . /webbyerp
# RUN npm install && npm run build && npm install -g http-server(用 ci 替代 npm install)
RUN npm ci && npm run build
# PORT(這裡只是給發布的人知道自己原本的 PORT 接口)
EXPOSE 3000
# CMD http-server ./build -p 3000容器啟動後、執行http-server(用 nginx 取代)
FROM nginx:alpine
COPY --from=builder /webbyerp/build /usr/share/nginx/html
  • 建立完成後就來產出 image 檔(先上全圖)。

http://idea0816.synology.me/wordpress/wp-content/uploads/2022/11/截圖-2022-11-09-下午8.03.29.jpg

  • testimage 可替換成自己要的名字。特別注意此指令後面有一個「 . 」、沒加上會出錯。
docker build -t testimage .
  • 「 -d -p 」或「 -dp 」是為了在後台運行新容器。另外在主機創立 3000 到 容器 3000 的端口映射。後來因為修改成使用 nginx 而非 http-server 、所以我直接改為 80:80 ;當然可以也可以 3000:80 避開主機的 port 80 。
docker run -dp 3000:3000 testimage

結論:
1. 使用 alpine 減少容量。
2. 鎖定 node 版本號:ex: node:18-alpine。
3. npm ci 取代 npm Install 、避免版本問題及提高依賴安裝速度。
4. package.json 單獨添加、充分利用鏡像緩存。
5. 只提取自己撰寫的文作、減小容量。