Chia sẻ Dumv 21/03/2025 0 Comments

Tạo ứng dụng báo cáo tình trạng coronavirus trong vòng 2 ngày

Với tinh thần toàn thế giới phòng chống dịch bệnh 2019-nCoV, mình đã làm một ứng dụng về cập nhật tình hình virus Corona và publish trên google play store trong 2 ngày, 1 ngày để code và 1 ngày để tinh chỉnh, triển khai. Các bạn có thể download ứng dụng tại.

Sau đây mình sẽ hướng dẫn các bạn cách làm ứng dụng trong thời gian ngắn, cụ thể là từ 1-2 ngày. Phạm vi bài viết này là tập trung vào hướng dẫn sử dụng công nghệ, không tập trung vào hướng dẫn cách code.

Table of Contents

Bước 1: Xác định yêu cầu của ứng dụng

Ứng dụng cần hiển thị thông tin về phòng chống, làm sao tự bảo vệ bản thân tránh lây nhiễm conronavirus.
Ứng dụng cần hiển thị thông tin về số ca lây nhiễm, hồi phục, chết trên toàn thế giới tính đến thời điểm hiện tại.
Ứng dụng cần có những thông tin cở bản liên quan đến viruscorona để mọi người tham khảo.
Ứng dụng phải cập nhật dữ liệu liên tục từ các nguồn dữ liệu tin cậy.
Ứng dụng miễn phí, phục vụ cộng đồng nhưng phải ổn định.
Đầu tư cho ứng dụng này thấp nhất: 2 ngày + 0$ cho hosting 🙂

Các bạn có thể đưa ra nhiều yêu cầu hơn, tuy nhiên trong phạm vị 1 đến 2 ngày, mình chỉ đưa ra chừng đó.

Bước 2: Nguồn dữ liệu

Khó nhất của ứng dụng loại này không phải là làm sao để code mà là nguồn dữ liệu ở đâu, làm sao để có thông tin chính xác nhất về coronavirus, có dữ liệu real time về các trường hợp lây nhiễm chính xác nhất. Trong thời gian tìm hiểu về tình trạng coronovirus mình tìm được 3 nguồn khá tin cậy.

Nguồn từ WHO, hiển nhiên nguồn này là đáng tin cậy nhất, những thông tin về coronavirus mình lấy từ đây. Nhưng nhược điểm của nguồn dữ liệu này là chậm, thông tin được báo cáo hàng ngày và để bóc tách dữ liệu cũng khá phức tạp, phải lấy từ file pdf nên không phù hợp cho phần thống kê tình hình thực tế.
Nguồn từ Bộ Y Tế, hiển nhiên nguồn này cũng rất đáng tin cậy, cập nhật nhanh, nhưng thông tin được đưa ra ở dạng text và image rất khó bóc tách, mình không thể hoàn thành việc đó trong vòng 2 ngày được.
Nguồn từ corona.kompa.ai, nguồn dữ liệu này cũng được cập nhật từ WHO và Bộ Y Tế nên cũng đáng tin cậy, ưu điểm của nguồn này là có thể bóc tách được dữ liệu từ API. Nó phù hợp cho dự án 2 ngày của mình, nên mình chọn nguồn này cho phần dữ liệu thời gian thực.

Bước 3: Kiến trúc ứng dụng

Để thực hiện được yêu cầu đặt ra, ứng dụng này cần có 2 phần:

Back-End: phần này sẻ được triển khai trên 1 máy chủ, chạy 24/24 để tổng hợp dữ liệu và public dữ liệu liên tục. Ngoài ra nó còn đảm nhận là 1 Back-End service cho ứng dụng khách.

Ở phần này, các bạn có thể dùng bất kỳ môi trường mình đang có, riêng cho ứng dụng này mình đã sử dụng Google Cloud Platform (GCP) để tạo 1 VM đủ mạnh cho mục đích của mình. Một số môi trường cloud khác các bạn có thể chọn là AWS, Azure hay Heroku, DigitalOcean, …

*** Nếu bạn chưa quen thuộc với môi trường cloud thì bạn nên học một khóa cơ bản về Cloud để hiểu thêm tại sao mình chọn nó. Không dùng Cloud khó mà tạo được ứng dụng trong vòng 2 ngày (*_*)

Front-End: Để đơn giản hóa việc sử dụng, và phục vụ đa số người nên mình sẽ làm một ứng dụng điện thoại để hiển thị dữ liệu được tổng hợp. Bạn không cần gì khác ngoài việc code và publish.

Ứng dụng điện thoại tối thiểu được publish lên 2 store của Google và Apple.

Bước 4: Xác định công nghệ

Back-End: Việc tổng hợp từ các nguồn dữ liệu khác nhau thông qua web API khá đơn giản. Ở phần này để thực hiện nhanh, tận dụng khả năng xử lý JSON tốt, deploy nhanh, nhẹ. Mình đã chọn NodeJS và thư viện express để tạo RESTful service.

Front-End: Hiện tại có khá nhiều hybrid framework cho việc code 1 lần và deploy được trên nhiều nền tảng. Ở phần này mình chọn React Native.

*** Việc lựa chọn công nghệ nào nó phụ thuộc vào thế mạnh của bạn, tuy nhiên hiện nay theo mình thấy dân DEV nên trang bị cho mình tối thiểu 1 bộ ba kỹ năng chỉ dự vào 1 ngôn ngữ lập trình Javascripts/ES là: NodeJS/ReactJS/React Native hoặc tương đương cho Angular/Vue. Nó sẻ giúp các bạn phát triển ứng dụng đơn giãn hơn, nhanh hơn, mềm dẽo hơn.

Bước 5: Thiết kế giao diện

Phần này tùy mỗi người có mỗi thiết kế khác nhau, riêng ứng dụng của mình thì giao diện như thế này, bạn có thể download ứng dụng để thấy chi tiết hơn.

Công cụ thiết kế khá là nhiều, bạn có thể tham khảo một số công cụ sau nếu chưa có:

Fluid UI: ưu điểm là phần mềm free đáp ứng khá đầy đủ những gì mình cần (*_*), design trên nền web, xem kết quả trực tiếp trên điện thoại.
Color tool: giúp bạn có thể chọn được bảng màu phù hợp nhất cho ứng dụng của mình.

Bước 6: Code thôi

Chuẩn bị: Chuẩn bị môi trường phát triển và triển khai, mình giả định là các bạn đã biết làm, thân thuộc với Ubuntu, nếu chưa biết các bạn google các bài liên quan heng (*_*)

Môi trường Production:

1 host với Node (10.x) server trên GCP cho phần BE.
Các tài khoản để đẩy ứng dụng lên Android và iOS store. Phần này không free, các bạn mất khoảng “2 triệu” cho lần đâu (các bạn có thể nhờ người có rồi để upload ké).

Môi trường Development:

Mình cần Node (10.x) ở local để chạy thử.
Bộ React Native CLI để xây dựng ứng dụng (để giảm tải cho PC, bạn nên cài đặt cấu hình sử dụng máy thực khi chạy thử ứng dụng thay vì chạy máy ảo).
Bộ Express generator để tạo ứng dụng RESTful dùng thư viện express.
Visual studio Code, IDE cho cả BE và FE.

Tips:

Khi cài Node, bạn nên cài thông qua nvm sẻ đơn giản hơn mà tiện cho sau này muốn chuyển qua version khác để dùng.
Đẩy ứng dụng lên store: sau khi code xong các phần cơ bản thì mình cần build bản release và upload luôn, sau đó hoàn thiện dần rồi upload phiên bản cuối cùng lên. Vì khi upload ứng dụng lên store lần đầu các bạn cần qua rất nhiều bước, thường bước review là mất thời gian nhất, còn bước update thì thường nhanh hơn nhiều.

Code ứng dụng: trong phạm vi bài này mình không nói về cách làm sao code với Node hay React Native cũng như hướng dẫn chi tiết cách cài đặt môi trường Production, Development mà chỉ dừng lại ở việc làm sao để xây dựng ứng dụng này trong 2 ngày và các kỹ thuật, kiến thức liên quan bạn cần biết để thực hiện được mục tiêu đó.

Bạn có thể tải code liên quan đến bài này từ github: