Trong chapter 1, chúng ta đã hoàn thành project `hello world`. Trong phần hôm nay, chúng ta sẽ tạo một web tĩnh đơn giản bằng GAS. Let's go.
Vì nội dung chapter này khá nhiều, nên lỡ rồi mình chèn thêm một vài khái niệm liên quan khi phát triển web ha.
Tất cả tại data -- lời nói cửa miệng của mọi Fullstack
Thời bây giờ, có keyword là có thể search google hoặc ChatGPT rất hiệu quả. Nên mình list ra vài danh từ thường dùng (đại khái thôi nhan).
Quy trình trong phát triển ứng dụng nó cũng đã lên cái tầm tối ưu tới không còn một động tác thừa, nên nói mình tóm gọn trong vài câu quả nhiên là thất lễ.
Thôi thì cho đơn giản, đóng vai trò là 1 self-taught fullstack, mình đưa ra một quy trình gợi ý rút gọn như sau:
Vừa hay full-stack thì từ 2 tới 6 làm hết.
Trong những phần sau, mình sẽ tập trung phần coding nhiều hơn. Lần này đề bài dễ 1 chút.
Team HR cần 1 trang web hiển thị thông tin của từng staff trong cty, có ảnh, staff-id, tên, chức vụ. Chưa cần update hay lưu data, chỉ cần show ra là được.
Cần 1 trang, có 1 cái info card được lặp lại nhiều lần, show ra là được
Nhái lại design này cho lẹ
I would not want to see any relaxation of the law prohibiting human cloning -- Tony Abbott
function doGet() { return HtmlService.createTemplateFromFile("index").evaluate().setTitle("GAS - chapter 2");}
Giải thích:
Hàm doGet là 1 hàm mặc định cần có, khi có user vào trong link tương ứng do GAS sinh ra (ở mục 4.2 hoặc 4.3), GAS sẽ mặc định chạy function này.
Ở đây chúng ta dùng HtmlService để lấy nội dung có trong file index.html rồi show ra màn hình (thông qua lệnh .evaluate()).
<p>Hello GAS - chapter 2</p>
Ở bước này, chúng ta sẽ render code của mình thành output là 1 web-app. Output sẽ chỉ mang tính thời điểm ngay lúc deploy, nếu có thay đổi trong code về sau, thì bạn cần deploy lại (thao tác không đổi).
Click Deploy >> New deployment >> Select type: Web app >> Deploy
Sau khi hoàn thành như hình trên, GAS sẽ cho bạn 1 link, click vào dẫn ra màn hình như thế này là ổn nhé.
Khác với 4.2, deploy test sẽ phản ánh ngay tức thì thay đổi trong code lên output. Ý tưởng là, cứ dev vs test, lúc nào xong thì hẵng quay lại thực hiện 4.2 rồi đưa link ở 4.2 cho client luôn. Lỡ trong quá trình dev mình có phá gì hư code thì họ cũng không bị ảnh hưởng (hehe).
Thay đổi nội dung trong thẻ <body> lại lần nữa.
<p>Hello GAS - chapter 2 - test deploy</p>
Thực hiện deploy: Click Deploy >> Test deployments
GAS sẽ cho bạn 1 link khác với 4.2 với nội dung mới.
Trong bài hôm nay, chúng ta đã tìm hiểu qua vài khái niệm thường dùng, cũng như quy trình (tóm tắt) khi phát triển ứng dụng.
Bắt tay vào code và deploy được một web-app cơ bản trong GAS. Tự nhiên buồn ngủ ngang, tạm thời tới đây thôi, phần sau sẽ hoàn thành đề bài ở Step 1.