Skip to content
CodeSook
CodeSook

20. Build docker image and deploy


Github actions build docker image and push to dockerhub

เราจะมาสร้าง docker image ด้วย github actions พอได้แล้ว docker image แล้วเราจะ push ไปที่ dockerhub

Dockerfile
Dockerfile
FROM oven/bun:1 AS base
WORKDIR /app
FROM base AS builder
COPY package.json bun.lock ./
RUN bun install
COPY . .
RUN bun run build
FROM joseluisq/static-web-server:2
WORKDIR /app
COPY --from=builder /app/dist dist
CMD ["--port", "80", "--root", "dist"]
.dockerignore
.dockerignore
node_modules
README.md
.git
.github

Create workflow

เราจะสร้าง workflow แบบนี้

name: Build Docker
on:
push:
workflow_dispatch:
jobs:
build:
runs-on: ubuntu-latest
env:
USERNAME: ${{ vars.DOCKERHUB_USERNAME }}
steps:
- name: Get Code
uses: actions/checkout@v4
- name: Login to Docker Hub
uses: docker/login-action@v3
with:
username: ${{ vars.DOCKERHUB_USERNAME }}
password: ${{ secrets.DOCKERHUB_TOKEN }}
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and push
uses: docker/build-push-action@v6
with:
context: .
push: true
tags: ${{ env.USERNAME }}/gh-action-react:latest

เราสร้าง env USERNAME จาก vars แบบนี้

env:
USERNAME: ${{ vars.DOCKERHUB_USERNAME }}

เราใช้ actions หลายตัวเลย ตามนี้

  • docker/login-action@v3 ใช้เพื่อ login เข้า dockerhub

    • password จะใช้เป็น token แทนนะ
  • docker/setup-qemu-action@v3 ทำให้ docker build image ได้หลาย architecture

  • docker/setup-buildx-action@v3 ใช้ setup BuildX เอาไว้ build docker น่ะแหละ

  • docker/build-push-action@v6 เราสั่ง build docker image

    • push build image เสร็จแล้วจะให้ push เลยไหม
    • tags เราจะใส่ tag image ว่าอะไร ซึ่งปกติเราก็ต้องใช้ <username>/<image_name>:<tag>

เสร็จแล้วลอง push code ดู

ลองเปิดดูที่ dockerhub ว่ามี image เข้าไปแล้วหรือยัง