Giới Thiệu
Bạn có bao giờ tự hỏi mã code bạn viết trên laptop sẽ trở thành một trang web trực tuyến mà bất kỳ ai cũng có thể truy cập như thế nào không?
- Ở phía sau, nhiều công cụ và nền tảng làm việc cùng nhau:
- GitHub để quản lý và chia sẻ mã của bạn
- Các nền tảng như Vercel cho việc lưu trữ nhanh chóng
- Các container Docker để tính di động
- Các quy trình CI/CD cho tự động hóa
- Các máy chủ đám mây cho khả năng mở rộng
Trong bài viết này, chúng ta sẽ phân tích quy trình này từng bước, sử dụng một ứng dụng web React đơn giản làm ví dụ.
Bước 1: Phát Triển Tại Chỗ
Mỗi dự án bắt đầu trên máy tính của bạn.
Ví dụ: một ứng dụng React hiển thị các dự án của bạn.
bash
npx create-react-app my-app
cd my-app
npm start
Bạn sẽ thấy ứng dụng chạy cục bộ tại http://localhost:3000.
Lúc này, chỉ có bạn mới có thể nhìn thấy nó.
Bước 2: Đưa Mã Lên GitHub
Trước khi triển khai, bạn cần đưa dự án của mình lên GitHub.
Tại sao? Bởi vì GitHub là nguồn gốc đáng tin cậy của dự án:
- Lưu trữ mã nguồn thô của bạn (các tập tin React, cấu hình, Dockerfile, các quy trình CI/CD).
- Theo dõi mọi thay đổi (commit, nhánh, pull request).
- Cho phép hợp tác với đồng đội.
- Là điểm kích hoạt cho các quy trình CI/CD.
👉 Hãy nghĩ về GitHub như là xưởng nơi các bản vẽ (mã) của bạn sinh sống.
Bước 3: Triển Khai Với Các Nền Tảng Như Vercel
Các nền tảng như Vercel làm cho việc triển khai trở nên đơn giản:
- Kết nối repo GitHub của bạn với Vercel.
- Mỗi lần bạn đẩy mã, Vercel:
- Lấy mã mới nhất từ GitHub
- Chạy
npm run build
- Lưu trữ ứng dụng trên một URL công cộng
✨ Những điểm chính:
- Vercel = lưu trữ không máy chủ → không cần quản lý máy chủ.
- Xử lý HTTPS, CDN, caching và scaling cho bạn.
- Tuyệt vời cho các trang tĩnh hoặc ứng dụng web đơn giản.
✅ Lợi ích: thân thiện với người mới và nhanh chóng
❌ Hạn chế: ít kiểm soát hơn về thời gian chạy và môi trường
Bước 4: Giới Thiệu Docker
Thế nếu bạn muốn kiểm soát nhiều hơn hoặc muốn ứng dụng của bạn có thể chạy ở bất kỳ đâu (đám mây, tại chỗ, hoặc trên một laptop khác)?
Đó là lúc Docker giúp đỡ.
- Docker Image = ứng dụng của bạn + hệ điều hành + môi trường chạy + các phụ thuộc → tất cả được gói gọn lại.
- Docker Container = một phiên bản đang chạy của image đó.
Ví dụ về Dockerfile:
dockerfile
# Bước 1: Giai đoạn xây dựng
FROM node:18-alpine AS build
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
# Bước 2: Phục vụ với Nginx
FROM nginx:alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
Xây dựng và chạy:
bash
docker build -t my-app:v1 .
docker run -p 8080:80 my-app:v1
Bây giờ ứng dụng của bạn chạy bên trong Docker, độc lập với cấu hình máy của bạn.
Bước 5: Docker Hub (Kho Lưu Trữ Image)
Để chia sẻ các image, chúng ta sử dụng Docker Hub (giống như GitHub nhưng cho các container).
bash
docker tag my-app:v1 yourusername/my-app:v1
docker push yourusername/my-app:v1
Người khác có thể kéo và chạy nó:
bash
docker pull yourusername/my-app:v1
docker run -p 8080:80 yourusername/my-app:v1
✅ Lợi ích: ứng dụng của bạn bây giờ có thể di động.
👉 Chú ý sự khác biệt:
- GitHub = mã nguồn thô, nơi có thể theo dõi các thay đổi.
- Docker Hub = các image đã được xây dựng, sẵn sàng để chạy ở bất kỳ đâu.
Cả hai đều là phần thiết yếu của quy trình làm việc.
Bước 6: Triển Khai Đám Mây
Thay vì chạy các container cục bộ, hãy triển khai chúng lên các dịch vụ đám mây:
- Google Cloud Run
- AWS ECS / Fargate
- Azure App Service cho Containers
Quy trình:
- Đám mây kéo image từ Docker Hub.
- Chạy nó bên trong một container.
- Ứng dụng trở nên có thể truy cập công khai.
Bước 7: Tích Hợp Liên Tục & Triển Khai (CI/CD)
Cho đến nay, bạn đã học cách:
- Xây dựng các Docker image cục bộ
- Đưa chúng lên Docker Hub
- Triển khai chúng trên đám mây
Điều này rất tốt cho các dự án nhỏ, nhưng hãy tưởng tượng bạn phải làm điều đó bằng tay mỗi khi bạn thực hiện một thay đổi.
🔴 Quy Trình Thủ Công (Lặp Lại & Dễ Sai Sót)
Giả sử bạn thay đổi một dòng mã trong thành phần React của bạn. Để cập nhật ứng dụng trực tuyến, bạn cần:
bash
# Xây dựng một Docker image mới
docker build -t my-app:v2 .
# Gán nhãn đúng cho image
docker tag my-app:v2 yourusername/my-app:v2
# Đưa lên Docker Hub
docker push yourusername/my-app:v2
# SSH vào đám mây & kéo image
docker pull yourusername/my-app:v2
# Dừng container cũ, chạy mới
docker stop my-app
docker run -d -p 8080:80 --name my-app yourusername/my-app:v2
Bây giờ hãy tưởng tượng làm điều này mỗi khi bạn sửa một lỗi, thêm một tính năng hoặc cập nhật nội dung.
- Nó rất lặp lại.
- Dễ quên một bước.
- Phiên bản có thể bị lộn xộn (v2, v3, final-v3, final-final-v4 😅).
- Trong một nhóm, nhiều nhà phát triển có thể ghi đè hoặc mâu thuẫn với nhau trong việc triển khai.
Rõ ràng, điều này không thể mở rộng.
🟢 Quy Trình Tự Động Với CI/CD
Đây là lúc CI/CD (Tích Hợp Liên Tục / Triển Khai Liên Tục) cứu cánh.
Dưới đây là cách thức hoạt động:
Bạn đẩy mã của bạn lên GitHub.
- Điều này đóng vai trò như một kích hoạt.
- Không cần phải chạy các lệnh Docker thủ công.
CI (Tích Hợp Liên Tục) bắt đầu.
- Một workflow GitHub Actions (hoặc Jenkins, GitLab CI, CircleCI, v.v.) tự động:
- Kiểm tra mã mới nhất.
- Cài đặt các phụ thuộc.
- Chạy các bài kiểm tra (khuyến nghị nhưng không bắt buộc).
- Xây dựng một Docker image mới với mã mới nhất.
Image được tự động đẩy lên Docker Hub.
- Pipeline đăng nhập với thông tin tài khoản Docker Hub của bạn (được lưu giữ an toàn dưới dạng bí mật).
- Gán nhãn image với "latest" (hoặc một hash commit / số phiên bản).
- Đẩy lên Docker Hub mà không cần bạn làm gì.
CD (Triển Khai Liên Tục) tiếp quản.
- Tùy thuộc vào thiết lập của bạn, pipeline cũng có thể:
- Kích hoạt nhà cung cấp đám mây của bạn (Google Cloud Run, AWS ECS, Kubernetes, v.v.).
- Kéo image mới.
- Tự động triển khai container.
Kết Quả: Trong vòng vài phút sau khi đẩy mã, ứng dụng của bạn được cập nhật trực tuyến.
✅ Tại Sao Điều Này Quan Trọng
- Tính nhất quán → Các bước giống nhau được thực hiện mỗi lần, không có vấn đề "chạy trên máy của tôi".
- Tốc độ → Việc triển khai mất vài phút, không phải vài giờ.
- Thân thiện với nhóm → Nhiều nhà phát triển có thể đẩy mã, pipeline xử lý việc gộp và triển khai.
- Giảm lỗi → Không có lệnh nào bị quên, không có nhãn sai.
- Khả năng mở rộng → Hoạt động giống nhau cho dù bạn triển khai một lần mỗi tuần hay 20 lần mỗi ngày.
Ví dụ: CI/CD với GitHub Actions
yaml
name: Docker Build & Deploy
on:
push:
branches: [ main ]
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: Build Docker image
run: docker build -t yourusername/my-app:${{ github.sha }} .
- name: Login to Docker Hub
uses: docker/login-action@v2
with:
username: ${{ secrets.DOCKER_USERNAME }}
password: ${{ secrets.DOCKER_PASSWORD }}
- name: Push Docker image
run: docker push yourusername/my-app:${{ github.sha }}
🔑 Lưu Ý:
Image được gán nhãn với SHA commit (${{ github.sha }}) nên mỗi lần xây dựng đều liên kết duy nhất với một phiên bản của mã.
Không cần gán nhãn thủ công, không có sai sót.
👉 Tóm lại:
- Không có CI/CD → Bạn là một robot triển khai con người, lặp lại các lệnh.
- Với CI/CD → Việc triển khai là tự động, đáng tin cậy và có khả năng mở rộng.
Đây chính xác là cách mà các công ty thực tế gửi mã hàng chục hoặc hàng trăm lần mỗi ngày mà không bị lỗi.
Tóm Tắt Toàn Diện
Kết Luận
- GitHub → xưởng nơi mã sống, hợp tác diễn ra và các pipeline được kích hoạt.
- Vercel → triển khai nhanh chóng, thân thiện với người mới.
- Docker → làm cho ứng dụng có thể di động và sẵn sàng sản xuất.
- Docker Hub → lưu trữ các image đã được xây dựng để chia sẻ và triển khai.
- Đám mây → chạy các container ở quy mô lớn.
- CI/CD → tự động hóa quá trình xây dựng, kiểm tra, đẩy image và triển khai.
Cùng nhau, những công cụ này tạo thành quy trình triển khai hiện đại mà các công ty thực tế sử dụng hàng ngày.
Với thiết lập này, bất kỳ dự án, danh mục đầu tư, blog hoặc ứng dụng web nào cũng có thể:
✅ Được xây dựng cục bộ
✅ Được theo dõi trên GitHub
✅ Được Docker hóa
✅ Được lưu trữ ở bất kỳ đâu
✅ Được cập nhật tự động với CI/CD
📌 Cảm ơn bạn đã đọc!
Nếu bạn thấy hướng dẫn này hữu ích, hãy kết nối với tôi:
- 📝 Theo dõi tôi trên Dev.to
- 💼 Kết nối trên LinkedIn
- 🖥️ Xem công việc của tôi trên GitHub
- 🌐 Khám phá danh mục đầu tư của tôi
🚀 Hãy cùng nhau lập trình, học hỏi và xây dựng!