1

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

BÁO CÁO THỰC TẬP

LẬP TRÌNH ỨNG DỤNG DI ĐỘNG VỚI FLUTTER

Công ty thực tập

: Trường Đại Học Bách Khoa TPHCM – Sau Đại
Học

Người phụ trách

: Đặng Vũ Thị Minh Phương

Thực tập sinh

: Phan Phước Đính

TP. Hồ Chí Minh, tháng 12 năm 2021


2

LỜI MỞ ĐẦU

Ngày nay, thiết bị di động với ưu thế nhỏ gọn nhưng tích hợp cả một thế giới văn phịng
và giải trí mini đã nghiễm nhiên trở thành người bạn đồng hành thân thiết của hầu hết mọi

người, đặc biệt là giới trẻ năng động. Với sự tăng trưởng mạnh mẽ của thị trường này, không
chỉ các hãng sản xuất di động mà cả các nhà phân phối và những doanh nghiệp công nghệ khác
cũng chen chân vào cuộc đua phát triển ứng dụng mobile để khai thác hết các tính năng của
thiết bị di động. Việt Nam cũng khơng nằm ngồi xu hướng này. Điều đó đặt ra một yêu cầu là
phải có đội ngũ nhân sự lập trình giỏi để cho ra đời các tiện ích độc đáo và thiết thực, đáp ứng
đòi hỏi ngày càng cao của người dùng. Tuy nhiên, bài toán nhân sự chất lượng tốt đến nay vẫn
chưa có lời đáp.
Sau 4 năm học tập trên trường, do mong muốn có thêm kinh nghiệm thực tế, cũng như
muốn được tham gia xây dựng ứng dụng di động trong một môi trường doanh nghiệp, em quyết
định chọn Trường Đại Học Bách Khoa TPHCM – Sau đại học, một môi trường lý tưởng, hiện
đại, chuyên nghiệp - là nơi sẽ giúp em thực hiện được dự định này.
Hiện tại, học viên Cao học của Trường Đại Học Bách Khoa TPHCM chỉ có thể tra cứu
thơng tin về điểm thi, thời khóa biểu, đăng ký môn học,… qua trang web của Trường. Và sẽ tiện
lợi hơn nếu như học viên có thể tra cứu các thơng tin trên qua thiết bị di động phịng trường hợp
mất kết nối mạng máy tính hoặc ở ngồi đường khơng thể sử dụng laptop, máy tính cá nhân. Vì
vậy đồ án thực tập kỳ này em chọn xây dựng ứng dụng di động cho học viên Cao học của
trường Đại học Bách Khoa TPHCM


3

LỜI CẢM ƠN

Trân trọng gửi lời cảm ơn Phòng đào tạo Sau đại học – Trường Đại Học Bách Khoa
TPHCM đã tạo điều kiện cho em có cơ hội được thực tập tại trường
Chỉ trong một thời gian ngắn, nhưng nhờ sự chỉ dẫn nhiệt tình của các anh chị ở Phòng
Đào Tạo, em đã làm quen được với hệ thống quản lý của Trường Đại Học Bách Khoa TPHCM
– Sau Đại Học. Chân thành cảm ơn các anh chị đã bỏ ra nhiều thời gian,công sức để hướng dẫn
chúng em hoàn thành đợt thực tập này.
Đặc biệt cảm ơn chị Phương, đã training nghiệp vụ, hướng dẫn, giúp đỡ cho em tận tình

cả những khó khăn trong cơng việc, đến những khó khăn việc làm quen với mơi trường mới;
cảm ơn thầy Trang – trưởng Phòng Đào Tạo Sau Đại Học đã tạo điều kiện cho em được thực
tập ở trường trong bối cảnh dịch Covid-19 đang diễn ra khá phức tạp.
Cũng xin cảm ơn thầy cô trong khoa Cơng nghệ phần mềm đã nhiệt tình hỗ trợ, tạo điều
kiện em làm bài báo cáo này.
Phan Phước Đính
TPHCM, 22/12/2021


4

NHẬN XÉT CỦA KHOA

……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………

……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………


5

MỤC LỤC

Chương 1: Giới thiệu công ty thực tập ........................................................................... 6
1. Giới thiệu Trường Đại Học Bách Khoa TPHCM – Sau Đại Học…………….........6
2. Chức năng, nhiệm vụ của Phòng Đào Tạo – Sau Đại Học………………………...7
Chương 2: Nội dung thực tập .......................................................................................... 9
1. Tìm hiểu trường và tổng quan nơi làm việc………………………………..............9
2. Nghiên cứu kỹ thuật……………………………………...………………………...9
2.1 Tìm hiểu CSDL Oracle…………………………………………………………9
2.2 Tìm hiểu về Flutter…………………………………………………………….10
2.3 Lập trình Flutter………………………………………………………………..13
3. Thực hiện Project……………………………………...………………………......17
4. Tìm hiểu về hệ thống hiện tại……………………………………………………..24
5. Chi tiết thời gian thời gian thực tập…….…………………………………………27
Chương 3: Chi tiết ứng dụng của Project ..................................................................... 29
1. Giới thiệu ứng dụng……………………………….................................................29
2. Các tính năng……………………………………...………………………............29
3. Đánh giá…………………………………………………………………………...37
4. Hướng phát triển…………………………………………………………………..39
TỔNG KẾT ...................................................................................................................... 40
TÀI LIỆU THAM KHẢO ............................................................................................... 41



6

Chương 1: Giới thiêu công ty thực tập

1. Giới thiệu Trường Đại Học Bách Khoa TPHCM – Sau Đại Học
- Tổng quan: Trường Đại học Bách khoa – ĐHQG Tp. HCM (ĐHBK) là một
trong những trường đại học giảng dạy và nghiên cứu hàng đầu của Việt Nam, với
24.000 sinh viên đại học, 1600 học viên cao học và nghiên giữ vai trò chủ đạo trong
việc bồi dưỡng nhân tài, cung cấp nguồn nhân lực chất lượng cao cho khu vực phía
Nam. Trường có 11 khoa chun mơn, 1 cơ sở đào tạo tại nội thành (268 Lý Thường
Kiệt, Phường 14, Quận 10, Tp. HCM) và 1 cơ sở đào tạo tại Huyện Dĩ An, Tỉnh
Bình Dương.
- Chiến lược: Chú trọng phát triển đào tạo sau đại học là chiến lược phát triển của
Trường nhằm đào tạo đội ngũ chuyên gia, các nhà khoa học đóng vai trị quan trọng
vào q trình nghiên cứu phát triển khoa học cơng nghệ, đóng góp tăng trưởng
nguồn tài nguyên tri thức - tăng cường tiềm lực phát triển kinh tế và xã hội cho đất
nước. Các chương trình đào tạo sau đại học của Trường không chỉ ổn định về đào
tạo chuyên ngành mà cịn được đổi mới về nội dung, chương trình, phương pháp đào
tạo, đặc biệt theo định hướng gắn kết đào tạo với nghiên cứu khoa học, đa dạng hóa
chương trình, phương thức đào tạo.


7

- Lĩnh vực hoạt động: Quản lý giáo dục
- Địa chỉ: 268 Lý Thường Kiệt, phường 14, quận 10, Thành phố Hồ Chí Minh
- Trang web: pgs.hcmut.edu.vn
- Email:

2. Chức năng, nhiệm vụ của Phòng Đào Tạo – Sau Đại Học
Chức năng: Triển khai công tác tổ chức, quản lý đào tạo và bồi dưỡng SĐH của
Trường (kể cả các chương trình liên kết đào tạo SĐH với nước ngồi).
Nhiệm vụ: Chịu trách nhiệm trước Hiệu trưởng về quản lý chất lượng đào tạo SĐH; phối
hợp với các Khoa quản lý ngành, Khoa chuyên môn, các Bộ môn trong công tác tổ chức
và quản lý đào tạo SĐH. Đối với cơng tác đào tạo SĐH, Phịng ĐTSĐH có nhiệm vụ như
sau:
1. Phối hợp với các Khoa đề xuất phương hướng, kế hoạch phát triển, quy mô đào tạo SĐH
(thạc sĩ, tiến sĩ, bồi dưỡng SĐH, ...) cho các chuyên ngành đào tạo.
2. Hỗ trợ các khoa xây dựng chương trình đào tạo SĐH.
3. Thực hiện nhiệm vụ tuyển sinh và bồi dưỡng SĐH; phối hợp với các đơn vị liên quan
trong công tác tuyển chọn đào tạo SĐH ở nước ngoài.
4. Phối hợp với các khoa lập kế hoạch giảng dạy, lập thời khóa biểu; tổ chức giảng dạy,
kiểm tra theo dõi tiến độ và chất lượng đào tạo các lớp SĐH của trường.
5. Phối hợp với các khoa, phòng, ban chức năng, tổ chức và quản lý các chương trình phối
hợp đào tạo SĐH với nước ngồi, các đề án, dự án đào tạo SĐH sử dụng ngân sách nhà
nước, thơng tin về SĐH trong và ngồi nước.
6. Chủ trì việc soạn thảo quy chế, quy định học vụ, qui trình liên quan đến đào tạo SĐH và
trình Hội đồng học vụ SĐH xem xét và góp ý. Trên cơ sở góp ý của Hội đồng học vụ
SĐH, Phịng đào tạo SĐH trình Hiệu trưởng ra quyêt định ban hành quy chế, quy định
học vụ, qui trình liên quan đến đào tạo SĐH và kịp thời đề xuất những vấn đề cần điều
chỉnh, bổ sung.
7. Phối hợp với các bộ phận chức năng khác của Trường theo dõi và giám sát việc thực hiện
các quy chế, quy định, qui trình này.
8. Tập hợp, thống kê, xử lý và lưu trữ thông tin về học vụ SĐH. Chịu trách nhiệm thống kê
và xác nhận khối lượng giảng dạy lý thuyết, thực hành thí nghiệm cho bậc SĐH.


8


9. Thực hiện công việc quản lý, bồi dưỡng SĐH: tổ chức đăng ký nhập học, đăng ký môn
học; lập danh sách lớp; lập lịch thi học kỳ; quản lý điểm thi, hồ sơ học tập của học viên;
phối hợp với khoa quản lý ngành xét tư cách học viên được nhận đề tài, được bảo vệ luận
văn thạc sĩ; trình Hiệu trưởng ra quyết định giao đề tài, phân công phản biện, thành lập
Hội đồng bảo vệ luận văn thạc sĩ; lập hồ sơ Hội đồng bảo vệ luận văn thạc sĩ; cấp bảng
điểm tích lũy học kỳ, bảng điểm tồn khóa, chứng nhận hồn thành mơn học; trình Hiệu
trưởng ra quyết định tốt nghiệp cao học; lập hồ sơ cấp bằng thạc sĩ; tổ chức cấp phát và
quản lý văn bằng thạc sĩ do trường đào tạo; trình Hiệu trưởng xem xét và quyết định
những trường hợp bảo lưu kết quả tuyển sinh, chuyển cơ sở đào tạo, chuyển khóa đào
tạo, ngừng học, tiếp tục học, gia hạn thời gian học tập, cho thôi học; tham mưu Hiệu
trưởng trình Đại học Quốc gia Tp. Hồ Chí Minh xem xét quyết định những vấn đề học
vụ cao học quá thời hạn đào tạo.
10. Thực hiện các công việc học vụ nghiên cứu sinh: tổ chức đăng ký nhập học, đăng ký
mơn học, đăng ký bộ mơn đào tạo; trình Hiệu trưởng ra quyết định công nhận cán bộ
hướng dẫn và đề tài luận án tiến sĩ của nghiên cứu sinh, quyết định về chuyên đề tiến sĩ;
cấp bảng điểm mơn học; chứng nhận hồn thành mơn học; trình Hiệu trưởng ra quyết
định thành lập các hội đồng đánh giá chuyên đề tiến sĩ, đánh giá luận án tiến sĩ cấp khoa
và cấp trường; thực hiện các thủ tục liên quan đến phản biện độc lập LATS, tổ chức hội
đồng chấm luận án tiến sĩ cấp trường; trình Hiệu trưởng xem xét quyết định việc chuyển
cơ sở đào tạo, điều chỉnh, thay đổi tên đề tài luận án tiến sĩ, bổ sung hoặc thay đổi cán bộ
hướng dẫn, gia hạn học tập, bảo vệ luận án tiến sĩ sau khi hết thời hạn đào tạo, trả nghiên
cứu sinh về cơ quan hoặc địa phương.
11. Tổ chức và quản lý các lớp chuyển đổi, bổ túc kiến thức và ôn tập phục vụ tuyển sinh
SĐH.
12. Phối hợp với các đơn vị đề xuất điều kiện cần thiết cho việc giảng dạy, học tập, nghiên
cứu của học viên SĐH và nghiên cứu sinh.
13. Cung cấp các thông tin liên quan đến đào tạo SĐH cho Ban Đảm bảo chất lượng để phục
vụ công tác đánh giá, đảm bảo chất lượng đào tạo SĐH.
14. Đề xuất với Hiệu trưởng chính sách sử dụng các nguồn kinh phí đào tạo SĐH.
15. Quản lý hồ sơ gốc và danh sách học viên các hệ đào tạo SĐH.



9

Chương 2: Nội dung thực tập

1. Tìm hiểu trường và tổng quan nơi làm việc
Thời gian : Tuần đầu tiên
Nội dung : Giới thiệu về trường, nghiệp vụ tổng quát
Được nghe chị Tổ trưởng tổ quản lý đào tạo Sau đại học giới thiệu về trường cũng
như các hoạt động thường ngày của Phịng Đào Tạo Sau Đại Học
Ngồi ra cịn được giới thiệu về các vị trí khác của Phịng, mỗi vị trí đảm nhiệm
một chức năng khác nhau
Kết quả : Hiểu thêm về trường, quá trình thành lập và phát triển; hiểu tổng quan về
nghiệp vụ của Phòng Đào Tạo Sau Đại Học; và cuối cùng là biết, làm quen với các vị trí
khác trong Phịng
2. Nghiên cứu kỹ thuật
2.1. Tìm hiểu Hệ CSDL Oracle
Thời gian : 1 tuần
Nội dung : Tìm hiểu về CSDL Phịng Đào Tạo sử dụng để quản lý hệ thống
Trong thời gian này, chị Tổ trưởng đã hướng dẫn em tìm hiểu về CSDL của
Phòng Đào Tạo Sau Đại Học, bao gồm các Table, Procedure,…
Trong q trình tìm hiểu, em sử dụng cơng cụ Oracle SQL Developer(phần mềm
do Oracle phát triển) để thao tác với CSDL của Phòng
Thực hiện : Thực hành với công cụ Oracle SQL Developer
Kết quả : Làm quen với Oracle, thao tác tìm kiếm, truy xuất dữ liệu từ các bảng
Khó khăn: Do lần đầu tiếp xúc với Oracle, nên gặp một vài trở ngại trong việc cài đặt
Oracle(bị xung đột phiên bản), cũng như giao diện Oracle SQL Developer chưa quen
sử dụng vì trước đó thường sử dụng SQL Server, MySQL,…



10

2.2.

Tìm hiểu Flutter
Thời gian : 1 tuần
Nội dung : Tìm hiểu về Flutter – framework của Google để viết các ứng dụng di động
- Tổng quan về Flutter
Flutter là một bộ công cụ phát triển phần mềm giao diện người dùng mã nguồn
mở do Google tạo ra. Nó được sử dụng để phát triển các ứng dụng đa nền tảng


11

cho Android, iOS, Linux, Mac, Windows, Google Fuchsia, nền tảng Web và web
từ một cơ sở mã duy nhất
Ngày phát hành đầu tiên: 5/2017

-

Điểm mạnh:
1) Thời gian phát triển nhanh hơn

-

Giống như nhiều cross-platform framework khác, Flutter cũng giúp phát triển ứng
dụng nhanh hơn. Sử dụng single code-base của Flutter, bạn có thể khởi chạy ứng
dụng của mình trên nhiều nền tảng.


-

Điều này có nghĩa là bạn chỉ cần viết code một lần thay vì viết code riêng cho
từng hệ điều hành. Do đó, phát triển Flutter tiết kiệm nỗ lực phát triển và cực kỳ
hiệu quả về chi phí.

-

Nếu bạn là chủ doanh nghiệp, việc thuê các lập trình viên phổ biến có thể giúp
bạn tiết kiệm các nguồn lực như thời gian và quỹ lương vốn rất quan trọng đối với
một công ty quy mô vừa hoặc một công ty khởi nghiệp. Việc sửa và theo dõi các
lỗi trong mã cũng đỡ vất vả hơn, vì các thay đổi được phản ánh trên mọi nền tảng
cùng một lúc.
2) Tự do tùy chỉnh và kết xuất nhanh hơn

-

Kiến trúc phân lớp của Flutter có thể giúp bạn tự do tùy chỉnh các thành phần giao
diện người dùng đến mức bạn cảm thấy như mình đang kiểm sốt mọi pixel trên
màn hình. Khơng giống như hầu hết các nền tảng, UI của Flutter không cần các
thành phần giao diện người dùng dành riêng cho từng nền tảng

-

Tất cả những gì Flutter cần là một bức tranh vẽ trên đó. Nó là đơn giản và hiệu
quả. Cách tiếp cận giúp nhất quán giao diện người dùng trên nhiều nền tảng.


12


3) Tính năng hot reload
-

Tính năng hot-reload của Flutter là một tính năng mang tính cách mạng giúp nó
khác biệt với tất cả các đối thủ cạnh tranh. Sử dụng hot reload, các nhà phát triển
hiện có thể thay đổi mã và ngay lập tức nhìn thấy chúng trong thời gian chạy
trong bản xem trước ứng dụng. Không cần phải biên dịch lại code mỗi lần. Điều
này cho phép các nhà phát triển tự do thử nghiệm với các giao diện người dùng
khác nhau trong khi xây dựng ứng dụng.
4) Tương đương với Hiệu suất ứng dụng gốc

-

UX tốt là yếu tố quan trọng nhất góp phần tạo nên thành cơng cho ứng dụng của
bạn. Hiệu suất kém có thể ảnh hưởng nghiêm trọng đến trải nghiệm ứng dụng của
user. Các ứng dụng di động được phát triển bằng Flutter không thể phân biệt được
với các ứng dụng được tạo bằng mã gốc. Trên thực tế, các ứng dụng Flutter có thể
hoạt động tốt hơn trong các tình huống giao diện người dùng phức tạp.

-

Lý do chính đằng sau điều này là Flutter không dựa trên bất kỳ code trung gian
nào hoặc cầu nối JavaScript. Thay vào đó, nó được tích hợp trực tiếp vào mã máy.
Điều này giúp loại bỏ bất kỳ lỗi hiệu suất có thể xảy ra thường gặp trong q trình
giải thích.
5) Tài liệu tốt và một cộng đồng mạnh

-

Do có những ưu điểm vượt trội so với nhiều framework khác, Flutter đã thu hút

được sự chú ý của nhiều lập trình viên trên thế giới. Điều này đã tạo ra một cộng
đồng tích cực, những người có thể cung cấp hỗ trợ cho bất kỳ ai đang cố gắng sử
dụng Flutter. Flutter cũng cung cấp tài liệu chuyên sâu dưới dạng blog và hướng
dẫn thông qua cổng thơng tin chính thức của họ.

-

Điểm yếu

-

Bộ render UI được nhóm phát triển gần như viết lại, khơng liên quan tới UI có sẵn
của Framework native, dẫn đến memory sử dụng khá nhiều. Hơn nữa, các UI
không đi chung với OS, mà được phát triển riêng, nghĩa là cùng 1 phiên bản
Flutter khi tạo ra ứng dụng cho iOS thì iOS 8.x -> 12.x đều y chang nhau, tương
tự như với Android. Nhưng UI của Android thì tất nhiên khác với iOS.

-

Phải học thêm ngôn ngữ DART: lập trình viên biết về DART khơng nhiều, cũng
có rủi ro là học xong DART sẽ dính liền ln với DART ở mảng phát triển ứng
dụng mobile.

-

Mơ hình dữ liệu mới: bloc pattern, DART Streaming; nếu đã quen với Redux khi
làm phát triển React Native, bạn sẽ mất thời gian để học thêm mơ hình dữ liệu
trong Flutter, mặc dù nó khơng khó.



13

-

Là con cưng của Google, tuy nhiên hãng dính nhìu phốt với thói quen “quăng con
giữa chợ” nên cũng cần cân nhắc. Tuy nhiên, mình nhận thấy Flutter rất tốt, tốt
hơn nhiều so với những cái mà Google từng làm ra như Angular.

Thực hiện :
- Cài đặt Flutter
- Chạy 1 vài Project mẫu để thấy được các điểm mạnh

Kết quả :
2.3.

Làm quen với Flutter
Cài đặt Flutter
Biết được cách tạo Project đơn giản

Lập trình Flutter
Nội dung: Các kiến thức cơ bản về Flutter để xây dựng một ứng dụng di động
Dart – ngơn ngữ chính của Flutter
-

Dart là ngơn ngữ lập trình đa mục đích ban đầu được phát triển bởi Google và sau
đó được Ecma (ECMA-408) phê chuẩn làm tiêu chuẩn. Nó được sử dụng để xây


14


dựng các ứng dụng web, server, máy tính để bàn và thiết bị di động. Dart là một
ngôn ngữ hướng đối tượng, được xác định theo lớp, với cơ chế garbage-collected,
sử dụng cú pháp kiểu C để dịch mã tùy ý sang
Những ưu điểm của Dart
✓

Năng suất Cú pháp Dart rõ ràng và súc tích, cơng cụ của nó đơn giản nhưng
mạnh mẽ. Type-safe giúp bạn xác định sớm các lỗi tinh tế. Dart có các thư
viện cốt lõi và một hệ sinh thái gồm hàng ngàn package.

✓

Nhanh Dart cung cấp tối ưu hóa việc biên dịch trước thời hạn để có được
dự đốn hiệu suất cao và khởi động nhanh trên các thiết bị di động và web.

✓

Di động Dart biên dịch thành mã ARM và x86, để các ứng dụng di động
của Dart có thể chạy tự nhiên trên iOS, Android và hơn thế nữa. Đối với các
ứng dụng web, chuyển mã từ Dart sang JavaScript.

✓

Dễ gần Dart quen thuộc với nhiều nhà phát triển hiện có, nhờ vào cú pháp
và định hướng đối tượng không gây ngạc nhiên của nó. Nếu bạn đã biết C
++, C # hoặc Java, bạn có thể làm việc hiệu quả với Dart chỉ sau vài ngày.

✓

Reactive Dart rất phù hợp với lập trình Reactive, với sự hỗ trợ để quản lý

các đối tượng tồn tại trong thời gian ngắn, chẳng hạn như các widget UI,
thông qua phân bổ đối tượng nhanh và GC. Dart hỗ trợ lập trình khơng đồng
bộ thơng qua các tính năng ngơn ngữ và API sử dụng các đối tượng Future
và Stream.


15

Kiến trúc ứng dụng Flutter và một số core quan trọng:

❖ Widget:
Khái niệm cốt lõi nhất trong Flutter framework đó là Trong Flutter, mọi thứ
đều là widget. Widget (tiện tích) là thành phần giao diện cơ bản nhất tạo nên toàn bộ
giao diện người dùng của ứng dụng.
Trong Flutter, bản thân chính ứng dụng đã là một widget. Mỗi ứng dụng chính là
một top-level widget và nó bao gồm một hoặc nhiều các widget con, mỗi widget này
lại có thể bao gồm một hoặc nhiều widget con khác. Nhờ sự kết hợp linh hoạt này
chúng ta có thể tạo ra bất kì ứng dụng phức tạp nào.

❖ Layout:


16

Single Child Widgets
Các widget layout loại này chỉ có duy nhất một widget con và thường có chức
năng bố trí nhất định.
Multiple Child Widgets
Loại widget layout này sẽ cho phép có nhiều hơn một widget con. Ví
dụ Row widget cho phép bố trí các widget con theo chiều ngang thành một hàng trong

khi Column widget cho phép bố trí các widget con theo chiều dọc thành một cột.
Một số widget layout dạng này được sử dụng phổ biến
•
•
•
•
•

Row
Column
ListView
GridView
Expanded
❖ State:

Quản lý State(trạng thái) trong Flutter là một việc rất quan trọng trong xây dựng
ứng dụng di động
Hiện nay, có khá nhiều cách quản lý State trong Flutter, tùy mục đích sử dụng để
chọn lựa cách quản lý State phù hợp cho ứng dụng
Ở đợt thực tập này, em chủ yếu sử dụng 2 thư viện hỗ trợ quản lý State chính là
Provider và Bloc. Chi tiết em sẽ mô tả ở phần tổ chức ứng dụng
❖ Thư viện bên ngoài
Chúng ta hồn tồn có thể sử dụng các thư viện bên ngoài để hỗ trợ xây dựng ứng
dụng. Các thư viện này được viết bởi các người dùng khác và chúng ta hồn tồn
có thể chỉnh sửa lại cho phù hợp với nhu cầu của chúng ta
Thực hiện :
-

Viết một ứng dụng quản lý danh sách công việc đơn giản, cài đặt và debug ứng
dụng



17

Kết quả :
-

Biết được cú pháp ngôn ngữ Dart
Hiểu được sơ bộ về vòng đời ứng dụng Flutter
Biết được cách xây dựng UI cơ bản cho ứng dụng Flutter

3. Thực hiện project
Sau gần 1 tháng được tìm hiểu về trường, nghiệp vụ cũng như tìm hiểu sơ bộ về Flutter,
em đã có kiến thức cơ bản để hướng đến đề tài xây dựng. Trong thời gian tiếp theo tiến
hành thực hiện project. Và do thời gian thực tập có hạn nên em chỉ chọn ra một số chức
năng chính.
Chi tiết thực hiện project:
- Giai đoạn 1: Xây dựng UI cho ứng dụng(2 tuần)
+ Đăng nhập thông tin học viên
+ Xem Thời Khóa Biểu của học viên


18

+ Xem điểm thi, thơng tin khóa luận,…
+ Xem chương trình đào tạo của các ngành
+ Đăng ký mơn học
+ Xem thơng tin đóng học phí
+ Xem thơng tin lịch thi môn học
+ Tạo task cho bản thân(tự thêm)

- Giai đoạn 2: Tạo class Model, viết API lấy data từ CSDL Oracle của hệ thống
+Viết API cho ứng dụng di động
- Do CSDL Oracle và hệ thống website đã được đẩy lên server riêng của trường nên để
lấy data cho ứng dụng di động bắt buộc phải viết app services riêng để xử lý. Ở project
này, em sử dụng NodeJs để viết API services cho ứng dụng di động.
- Tổng quan về NodeJS:
+ Node.js là một JavaScript runtime được build dựa trên Chrome’s V8 JavaScript engine.
Node.js sử dụng mơ hình event-driven, non-blocking I/O khiến nó trở nên nhẹ và hiệu
quả. Nhờ Nodejs mà việc xây dựng các ứng dụng Web trở nên đơn giản và dễ dàng hơn
rất nhiều.
+ Ưu điểm:
•
•
•
•
•

Có tốc độ xử lý nhanh nhờ cơ chế xử lý bất đồng bộ (non-blocking). Bạn có thể dễ dàng
xử lý hàng ngàn kết nối trong khoảng thời gian ngắn nhất.
Nhận và xử lý nhiều kết nối chỉ với một single-thread. Nhờ đó, hệ thống xử lý sẽ sử dụng
ít lượng RAM nhất và giúp quá trình xử Nodejs lý nhanh hơn rất nhiều.
Có khả năng xử lý nhiều Request/s cùng một lúc trong thời gian ngắn nhất.
Có khả năng xử lý hàng ngàn Process cho hiệu suất đạt mức tối ưu nhất.
Phù hợp để xây dựng những ứng dụng thời gian thực như các ứng dụng chat, mạng xã
hội …
+ Nhược điểm: Nodejs gây hao tốn tài nguyên và thời gian. Nodejs được viết bằng C++
và JavaScript nên khi xử lý cần phải trải qua một quá trình biên dịch. Nếu bạn cần xử lý
những ứng dụng tốn tài ngun CPU thì khơng nên sử dụng Nodejs.



19

- API lấy thông tin TKB của học viên:

- Test API với Postman(app test API phổ biến):


20

- Sử dụng thư viện Dio của Flutter để kết nối với API:
Dio là một ứng dụng HTTP client mạnh mẽ cho Dart, hỗ trợ Interceptors, Global
configuration, FormData, Request Cancel, File download, Timeout, v.v.
Docs về Dio Flutter: />

21

- Tạo Model cho project:


22

- Giai đoạn 3: Kết nối UI vs data, kết hợp quản lý State sử dụng Provider và Bloc
- Tổng quan Provider và Bloc:
+ Provider là 1 wrapper(vỏ bọc) cho Widget để giúp chúng được tái sử dụng dễ dàng
hơn. Có thể hiểu nơm na rằng, khi ta wrap Widget bằng Provider thì các Widget con bên
trong hồn tồn có thể truy cập vào Provider này để lấy dữ liệu. Để linh hoạt hơn,
Provider thường sử dụng kết hợp với ChangeNotifier(thơng báo thay đổi dữ liệu tới
Widget mỗi khi có cập nhật).
+ Bloc là 1 hệ thống quản lý state cho Flutter được đề nghị bởi Google developers. Nó
giúp quản lý state và luồng dữ liệu trong ứng dụng của bạn dưới dạng Streams. Một số

thành phần quan trọng của Bloc: Events(sự kiện, có thể là khi click button,…), States,
Streams,… Bloc được xây dựng cơ bản trên RxDart.
+ Có thể kết hợp đồng thời cả hai Provider và Bloc để quản lý State
Ví dụ:


23

Sử dụng Provider + ChangeNotifier để xử lý khi xem chương trình đào tạo các ngành
Cao học, mỗi khi click chọn học kỳ thì sẽ thơng báo cập nhật cho Widget render lại dữ
liệu

Sử dụng Bloc(RxDart) để 2 Widget luôn lắng nghe sự thay đổi dữ liệu và cập nhật trạng
thái bên dưới; đồng thời nút Login cũng lắng nghe, nếu 2 trường dữ liệu khơng đúng thì
sẽ nhận về kết quả là bool dưới dạng Stream và bị disable


24

- Giai đoạn 4: Ở giai đoạn này chủ yếu là test ứng dụng, kiểm tra sự tương thích của ứng
dụng. Trong quá trình test, tiến hành fix một số logic về data, UI để ứng dụng tương
thích hơn.

Định dạng số tiền để dễ nhìn hơn

Thêm icon Reload để User click vào trong trường hợp bị lỗi khi kết nối API lấy dữ liệu

4. Tìm hiểu hệ thống Website hiện tại
1. Tổng quan về hệ thống của Phòng Đào Tạo Sau Đại Học



25

Website của Sau đại học

Website cho Học Viên tra cứu thông tin