Xây Dựng Hệ Thống CICD và infrastructure cho hệ thống web application nhiều tiers chuẩn thực tế (Phần 1)

Lab Introduction

AWS experience: Intermediate
Time to complete: 180 minutes
AWS Region: US East (N. Virginia) us-east-1
Cost to complete: (Optional) Free Tier eligible, bellow 10$
Services used: Github Action (Github), EC2, Auto Scaling Group, S3, Cloudwatch Log, AMI, RDS, KMS, Terraform (Hashi Corp), Packer (HashiCorp)

Giới thiệu về Lab

Xin chào các bạn, Mình là Long Mentor hôm nay mình sẽ mang tới cho các bạn một bài lab khá thú vị, về việc xây dựng một hệ thống CICD hoàn chỉnh với độ phức tạp tiệm cận với một dự án thực tế. Mục đích mình xây dựng bài lab này là để cho các bạn có thể hình dung về một hệ thống CICD hoàn chỉnh thực tế sẽ trông như thế nào. Dù bài viết sẽ không cover được hoàn toàn tất cả các biến thể của hệ thống thực tế nhưng mà có sao đâu, học hành là con đường dài, nếu các bạn đi với mình thì chúng ta cùng nhau khám phá dần dần nhé. 😎 Vì bài viết khá dài nên mình xin phép được chia ra làm nhiều phần.

Bài viết không được generate bởi AI, nên có thể sẽ bao gồm :

Lỗi chính tả. ✍
Ý văn lủng củng. ☹
Một số nội dung không phù hợp do mình cao hứng viết. 😝
Câu chuyện do mình bịa ra nhưng gây đồng cảm sâu sắc. 😊

Tuy nhiên sẽ không bao gồm:

Câu từ hoa mỹ nhưng không có ý nghĩa. 🤦‍♂️
Code không được verify.🤬
Cảm giác fake fake khi đọc. 🤢

Câu chuyện

Vào một ngày đẹp trời, Long là một nhân viên trong công ty 3X có sản phẩm là "KissHub" , được sếp bảo sẽ chuyển cậu qua đội devop và infrastructure. Team devop và infra là một trọng những đội khá ít việc vì sản phẩm của công ty đã chạy ổn định, sáng 9h đến công ty, chiều 5h đi về, lâu lâu có task xem log, thu thập lỗi, fix bug cũng không đến tay, lương lại cao hơn mặt bằng chung vì có tiền trách nhiệm. Có thể nói đây là vua của mọi nghề, đối với một người lười như Long thì đây là một vị trí ao ước từ lâu, từ nay Long có thể chia tay với những deadline không hồi kết. Có thời gian chạy bộ buổi chiều, có điều kiện ăn uống ngủ nghỉ điều độ để căn bệnh trĩ lâu năm sẽ hồi phục được tốt hơn, ông bà nói rất đúng khổ tận cam lai, công sức trung thành 5 năm với công ty bây giờ đã đến ngày hái quả trong lòng hân hoan, niềm vui tột độ khiến Long giữa đêm khi ngủ cũng bật dậy cười ha há, thật là không gì hạnh phúc hơn.

Tuy nhiên người ta thường nói "Nhạc cực sinh bi" (vui quá hóa buồn) niềm vui ngắn chẳng tày gang, trong cuộc sống, khi ta đắm chìm trong hạnh phúc, đôi khi quên rằng mọi thứ đều có thể đổi thay nhanh chóng, sang team mới tận hưởng được một tuần thì Long đón nhận tin dữ.

Với làn sóng chuyển đổi số, tích hợp cloud , ban giám đốc và CTO của công ty đã quyết định migration infrastructure của sản phẩm "KissHub" từ onpremise lên AWS, đội của Long nhận nhiệm vụ xây dựng CICD mới cho hệ thống. Đang đắm mình trong niềm vui , Long nghe tin như sét đánh giữa trời quang , tâm thần chao đảo trước biến cố bất ngờ. Tuy vậy, không hổ là thợ code lâu năm, Long đã sốc lại tinh thần đề nhận nhiệm vụ được giao.

KissHub tổng quan

Hệ thống KissHub là sản phẩm chính của công ty 3x , là nền tảng phân phối video , clip ướt át. Vì sao gọi là ướt át, đó là vì nội dung của clip là những câu chuyện cảm động, nói về tình cảm giữa người với người, người với động vật, khiến cho người xem cảm động rơi nước mắt.

User

Nên tảng hoạt động chủ yếu trên web, phục vụ hàng ngàn lược truy cập một lúc cả ngày lẫn đêm. KissHub được vận hành bởi cụm server, chia làm 3 tầng,

Frontend : Phục vụ hiển thị giao diện trang web ,chứa code giao diện web, mã js, html , css ... .
Backend : Phục vụ cung cấp API, giúp frontend tương tác với db và các third party (nếu có)
Database: Lưu trữ dữ hiệu , người dùng, thông tin video ....

Thiết kế infrastructure

Sau vài ngày suy nghĩ, Long và đồng đội đã chọn được kiến trúc như sau:

Frontend và những resource tĩnh sẽ được deploy lên S3 và phân phối thông qua cloudfront
Các server sẽ được migration lên EC2 service với Auto Scaling Group. Để chạy trên môi trường EC2 thì application sẽ được đóng gói vào AMI .
Layer DB sẽ được migration sử dụng dịch vụ RDS với mô hình activate - standby bình thường thì traffic từ app sẽ sử dụng 1 instance RDS activate.
Application log được monitoring sử dụng cloudwatch logs, các EC2 server được monitoring với cloudwatch metrics và alarm.

Thiết kê CICD

Quy trình hiện tại:

Developer push code -> review (pair review) -> deploy (Đẩy source code mới lên server)

Quy trình mới:

Developer push code -> check lint (CI server) -> Run tests (CI server) -> Merged code (CI server) -> Tạo AMI (packer) -> đẩy lên AMI service (AWS) -> refresh instance với new AMI (AWS Auto Scaling Group)

OK bắt đầu thôi 🤓

1. Mục 1: Tạo khung project với Terraform

Thiết kế khung project theo mô hình nhiều modules nhỏ , theo chuẩn mà Terraform khuyến cáo.

#Directory structure:
└── cmp-multi-layer-app-infra/
    ├── README.md
    ├── backend.tf
    ├── main.tf
    ├── outputs.tf
    ├── modules/
    │   ├── cicd/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── compute/
    │   │   ├── compute.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── efs/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── load_balancer/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── monitoring/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── rds/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── rds_bastion/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   ├── security/
    │   │   ├── main.tf
    │   │   ├── outputs.tf
    │   │   └── variables.tf
    │   └── vpc/
    │       ├── main.tf
    │       ├── outputs.tf
    │       └── variables.tf
    └── .github/
        └── workflows/
            └── terraform.yml

Các modules Tài nguyên Chính :

VPC + Subnet (Public / Private)
Route Table + Internet Gateway (IGW) + NAT Gateway
Các Phiên bản EC2 với Run Template
ALB -> Tất nhiên rồi 🤓
RDS (MySQL) với Read Replica
EFS với Attach Point
Metrics và alarm CloudWatch
Backend S3 cho Frontend

2. Mục 2: Application code (local test)

Cấu trúc source code

./app
├── README.md
├── backend
│   ├── Dockerfile
│   ├── app.py
│   ├── config.py
│   ├── models
│   │   └── video.py
│   ├── requirements.txt
│   └── routes
│       └── videos_routes.py
├── docker-compose.yml
└── frontend
    ├── README.md
    ├── package-lock.json
    ├── package.json
    └── src
        ├── App.css
        ├── App.js
        ├── api.js
        ├── assets
        │   └── images
        │       └── kisshub-logo.png
        ├── components
        │   ├── Header.js
        │   ├── Logo.js
        │   ├── Task.js
        │   ├── Video.js
        │   └── VideoPlayer.js
        ├── index.js
        ├── pages
        │   ├── VideoList.js
        │   └── VideoPage.js
        ├── reportWebVitals.js
        └── services
            └── api.js

Các bạn có thể check out source ở đây nhé:

https://github.com/longngo192/cmp-cicd/tree/main/app

code Khầy Long code vội, thắp hương mới chạy được các bạn đừng review nhé 🤫

Chạy thử local :

Start Docker (backend, db) (☞ﾟヮﾟ)☞

#app/
docker compose up --build

Start Frontend (dev) ☜(ﾟヮﾟ☜)

#app/frontend
npm install
npm run start-dev

Tada !!

verify thành công ╰(°▽°)╯:

Frontend đã kết nối được backend ✔
Backend Kết nối được DB ✔
App chạy ổn ✔

Mặt trời xuống núi , chim bay về tổ , khách qua đường tìm chỗ dừng chân. Bài giảng hôm nay xin phép tạm dừng ở đây, chuyện ngày mai xin mạn phép lúc sau kể tiếp.