khóa luận tìm hiểu flutter và thuật toán recommendation, xây dựng ứng dụng minh họa

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

HUỲNH HẠ VY – 16521470
ĐỖ NGỌC BÍCH TRÂM – 16521273

KHĨA LUẬN TỐT NGHIỆP

Tìm hiểu Flutter và thuật toán Recommendation, xây dựng
ứng dụng minh họa
Research on Several Recommendation Algorithms and Build Illustrative
Application with Flutter

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

GIẢNG VIÊN HƯỚNG DẪN
THS. TRẦN ANH DŨNG
TS. NGUYỄN ĐÌNH HIỂN

TP. HỒ CHÍ MINH, 2021
ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH


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

HUỲNH HẠ VY – 16521470
ĐỖ NGỌC BÍCH TRÂM – 16521273

KHĨA LUẬN TỐT NGHIỆP

Tìm hiểu Flutter và thuật tốn Recommendation, xây dựng
ứng dụng minh họa
Research on Several Recommendation Algorithms and Build Illustrative
Application with Flutter

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

GIẢNG VIÊN HƯỚNG DẪN
THS. TRẦN ANH DŨNG
TS. NGUYỄN ĐÌNH HIỂN

TP. HỒ CHÍ MINH, 2021
DANH SÁCH HỘI ĐỒNG BẢO VỆ KHÓA LUẬN


Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số ………………
…… ngày ……………….. của Hiệu trưởng Trường Đại học Công nghệ Thông tin.
1. …………………………………………. – Chủ tịch.
2. …………………………………………. – Thư ký.
3. …………………………………………. – Ủy viên.
4. …………………………………………. – Ủy viên.
ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH
CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ

Độc Lập - Tự Do - Hạnh Phúc

THÔNG TIN

TP. HCM, ngày tháng năm 2021

NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP
(CỦA CÁN BỘ HƯỚNG DẪN)
Tên khóa luận:
Tìm hiểu Flutter và thuật tốn Recommendation, xây dựng ứng dụng minh họa
Nhóm sinh viên thực hiện: Cán bộ hướng dẫn: HUỲNH HẠ VY 16521470
THS. TRẦN ANH DŨNG ĐỖ NGỌC BÍCH TRÂM 16521273 TS. NGUYỄN
ĐÌNH HIỂN Đánh giá Khóa luận:
1. Về cuốn báo cáo:
Số trang Số chương Số bảng số liệu Số hình vẽ Số tài liệu
tham khảo Sản phẩm
Một số nhận xét về hình thức cuốn báo cáo:
•
•
2. Về nội dung nghiên cứu:


•
•
3. Về chương trình ứng dụng:
•
•
4. Về thái độ làm việc của sinh viên:
•
•
Đánh giá chung:
Điểm từng sinh viên:
HUỲNH HẠ VY: ………../10
ĐỖ NGỌC BÍCH TRÂM: ………../10

Người nhận xét (Ký và ghi rõ họ tên)

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH
TRƯỜNG ĐẠI HỌC

TRẦN ANH DŨNG NGUYỄN ĐÌNH HIỂN
CƠNG NGHỆ THƠNG TIN
CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc Lập – Tự Do – Hạnh Phúc

TP. HCM, ngày tháng năm 2021

NHẬN XÉT KHĨA LUẬN TỐT NGHIỆP
(CỦA CÁN BỘ PHẢN BIỆN)
Tên khóa luận:


Tìm hiểu Flutter và thuật tốn Recommendation, xây dựng ứng dụng minh
họa Nhóm sinh viên thực hiện: Cán bộ phản biện: HUỲNH HẠ VY
16521470
ĐỖ NGỌC BÍCH TRÂM

Đánh giá Khóa luận:
16521273

1. Về cuốn báo cáo:
Số trang Số chương Số bảng số liệu Số hình vẽ Số tài
liệu tham khảo Sản phẩm
Một số nhận xét về hình thức cuốn báo cáo:

2. Về nội dung nghiên cứu:
3. Về chương trình ứng dụng:
4. Về thái độ làm việc của sinh viên:
Đánh giá chung:
Điểm từng sinh viên:
HUỲNH HẠ VY: ………../10
ĐỖ NGỌC BÍCH TRÂM: ………../10

Người nhận xét
(Ký và ghi rõ họ tên)

LỜI CẢM ƠN
Sau quá trình học tập và rèn luyện tại khoa Công nghệ phần mềm trường Đại
học Công nghệ Thông tin – ĐHQG TP.HCM chúng em đã được trang bị các kiến
thức cơ bản, các kỹ năng thực tế để có thể hồn thành Khóa luận tốt nghiệp của
mình.
Chúng em xin gửi lời cảm ơn chân thành đến thầy Trần Anh Dũng và thầy


Nguyễn Đình Hiển đã quan tâm hướng dẫn truyền đạt những kiến thức và kinh
nghiệm cho chúng em trong suốt thời gian học tập bộ mơn Khóa luận tốt nghiệp.
Cuối cùng, chúng em xin gửi lời cảm ơn đến tất cả thầy cô trong khoa và bạn
bè đã luôn bên cạnh, chỉ bảo, truyền đạt và động viên chúng em.
Trong q trình làm bài tập mơn khơng tránh khỏi được những sai sót, chúng
em mong nhận được sự góp ý của quý thầy và các bạn để được hoàn thiện hơn.
Chúng em xin chân thành cảm ơn.

Thành phố Hồ Chí Minh, tháng năm 2021
Sinh viên

HUỲNH HẠ VY

ĐỖ NGỌC BÍCH TRÂM

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH

Độc Lập - Tự Do - Hạnh Phúc

TRƯỜNG ĐẠI HỌC
CƠNG NGHỆ THƠNG TIN
CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM

TP. HCM, ngày….. tháng ….. năm 2021


ĐỀ CƯƠNG CHI TIẾT
Tên đề tài: Tìm hiểu Flutter và thuật toán Recommendation, xây dựng ứng
dụng minh họa
Cán bộ hướng dẫn:
TS. Nguyễn Đình Hiển
Ths. Trần Anh Dũng
Thời gian thực hiện: Từ ngày 14/8/2020 đến ngày 10/01/2020
Sinh viên thực hiện:
1. Huỳnh Hạ Vy – 16521470
2. Đỗ Ngọc Bích Trâm – 16521273
Nội dung đề tài:
1. Mục tiêu của đề tài:
1.1 Bối cảnh chọn đề tài
Ngày nay, công nghệ thông tin ngày một phát triển, kéo theo đó là sự
bùng nổ của các thiết bị điện tử, đặc biệt là điện thoại thông minh và máy

tính. Nếu như trước đây việc sở hữu một chiếc điện thoại thơng minh hay
máy tính khá khó khăn thì ngày nay do sự cạnh tranh gay gắt giữa các thương
hiệu khiến giá thành những thiết bị này rẻ hơn và việc sở hữu chúng trở nên
dễ dàng hơn. Vì thế nhu cầu phát triển ứng dụng cho các thiết bị này càng
ngày càng tăng cao.


Để tiếp cận đến nhiều người dùng, các nhà phát triển ứng dụng mong
muốn ứng dụng của họ chạy được trên nhiều nền tảng đặc biệt là Android,
iOS, Windows, MacOS và web. Thay vì phải tìm hiểu nhiều ngơn ngữ, cơng
nghệ khác nhau ứng với từng nền tảng thì hiện nay trên thị trường có nhiều
cơng cụ hỗ trợ lập trình đa nền tảng như Flutter, React Native, Ionic, … giúp
các nhà phát triển ứng dụng tiết kiệm thời gian, chi phí dành cho q trình
phát triển ứng dụng.
Trong số đó có Flutter mặc dù là cơng cụ ra đời muộn nhất nhưng có tốc
độ phát triển vượt trội và nhiều ưu điểm so với các công nghệ đi trước, nhiều
công ty công nghệ lớn sử dụng Flutter để phát triển sản phẩm của mình như
Google, Alibaba, Tencent, … Ứng dụng xây dựng với Flutter hoạt động với
hiệu năng mạnh mẽ và hiếm có vấn đề về mặt tương thích, ngồi ra đây cịn là
cơng cụ mã nguồn mở nên ngày càng nhiều lập trình viên và cơng ty quan
tâm đến cơng nghệ mới này.
Đây là lý do nhóm chọn đề tài khóa luận tốt nghiệp là “Tìm hiểu Flutter
và xây dựng ứng dụng minh họa”. Ngoài ra, trong thời điểm dịch tồn cầu
COVID 19 đang diễn ra, thơng qua các kiến thức đã tìm hiểu, tích lũy được
nhóm nhận thấy từ việc mua hàng qua mạng chỉ với thủ tục đăng ký mua sắm
đơn giản nhưng đem lại nhiều lợi ích: tiết kiệm và chủ động về thời gian,
tránh những nơi đông người và tránh khỏi những phiền phức khó chịu. Vậy
nên việc mua bán hàng qua mạng đang rất được mọi người quan tâm. Trên cơ
sở các kiến thức được học trong nhà trường và quá trình tìm hiểu các website
trong thực tế, nhóm đã quyết định tích hợp thêm hệ thống hỗ trợ gợi ý sản

phẩm vào ứng dụng hiện tại nhằm hỗ trợ khách hàng đến mức tối đa, tăng trải
nghiệm khách hàng đối với ứng dụng - Khách hàng chỉ cần các thao tác đơn
giản trên điện thoại di động là có thể đặt hàng được ngay.
1.2 Tính mới, khác biệt về chức năng của đề tài so với một số ứng
dụng hiện nay


− Điểm mới nổi bật của đề tài
Các trang thương mại điện tử, trang mua bán laptop hiện nay đa số đều
có ý tưởng và phương thức hoạt động tương đồng ở hầu hết các khâu như:
loại hàng hóa, vận chuyển, thanh tốn, độ tin cậy… và khơng có gì khác biệt
để tạo ra giá trị vượt trội cho khách hàng ngoại trừ ưu thế về giá (rẻ).
+ Sau quá trình khảo sát, lắng nghe ý kiến người dùng, giải pháp mà
nhóm đề ra để tăng lượt truy cập và thời gian sử dụng của người dùng
đối với ứng dụng của mình là nhóm đã đưa thêm các bài viết tin tức,
những câu chuyện liên quan đến laptop, công nghệ mới và những
video liên quan về các sản phẩm laptop tại trang thơng tin sản phẩm,
điều đó sẽ giúp người dùng vừa giải trí bổ ích có thêm kiến thức, vừa
trở thành người tiêu dùng thông minh hơn và từ đó gắn bó với ứng
dụng của mình hơn.
+ Đồng thời hệ thống gợi ý sản phẩm sẽ lấy dữ liệu những vấn đề mà
người dùng quan tâm từ đó đưa ra các sản phẩm, bài viết gợi ý trong
trang chủ khi người dùng vừa mở ứng dụng.
+ Ngoài ra, app cịn ứng dụng cơng nghệ Flutter vào việc xây dựng giao
diện ứng dụng, từ đó giao diện trở nên trực quan, thu hút người dùng
hơn
− Tính khác biệt, cải thiện về chức năng
Chọn lọc các chức năng tiện dụng nhất của top các app thương mại điện
tử lớn hiện nay để đưa vào ứng dụng ứng dụng của mình:
+ Tiki: Giỏ hàng chỉ có thể chọn mua tất cả hoặc xóa bớt (mua lại lần

sau). Điều này đã làm dẫn đến sự hạn chế thoải mái lựa chọn và mua
sắm của người dùng.
→ Ứng dụng thực hiện có thêm chức năng chọn và bỏ chọn trong phần giỏ
hàng, những hàng chưa được chọn sẽ lưu lại trong giỏ hàng để mua
sau


và tiến hành thanh tốn những món chọn cho người dùng (một số ứng
dụng cũng đã làm điều này là Lazada, Shopee).
+ Shopee, Tiki, Sendo: lượng sản phẩm bán trên ứng dụng quá nhiều gây
ra hiện tượng giao diện trở nên rối mắt với quá nhiều tính năng, sản
phẩm; Notification và banner quảng cáo các mặt hàng khác được push
liên tục gây phiền nhiễu cho khách hàng nếu khách chỉ mong muốn
mua laptop. Ngoài ra, thực tế trên thị trường chưa xây dựng ứng dụng
di động mua bán chuyên biệt cho laptop trong khi đây là một thị
trường màu mỡ và cần được khai thác.
Điều này làm người dùng phải thao tác tìm kiếm trên màn hình dẫn đến
làm giảm tính tiện dụng của app đối với người mua hàng. Ngồi ra, nếu được
recommend q nhiều sản phẩm khơng mong muốn so với nhu cầu đang cần
mua laptop sẽ gây trải nghiệm không tốt cho người dùng
→ Ứng dụng Eshop cho phép người dùng được thực hiện trải nghiệm mua
sắm đúng với nhu cầu mua laptop và phụ kiện, không gây rối mắt với
quá nhiều thể loại sản phẩm và nhiều tính năng khơng cần thiết, giúp
người dùng dễ theo dõi, sau này có thể mở rộng sang bán đồ điện tử,
linh kiện máy tính, phụ kiện.
Sau bước chọn các sản phẩm trong giỏ hàng là phần điền địa chỉ nhận hàng:
Nếu chưa xác nhận đặt đơn hàng thì Tiki và Sendo không lưu địa chỉ mà
người dùng đã từng nhập, trường hợp khách hàng quay về chỉnh sửa đơn giỏ
hàng của mình rồi lại sang phần nhập địa chỉ thì phải nhập lại. Điều này làm
mất thời gian của người dùng và làm giảm tính tiện dụng của app đối với

người mua hàng.
→ Ứng dụng Eshop sẽ mặc định chọn địa chỉ được xét ưu tiên, hoặc người
dùng có thể chọn địa chỉ trong danh sách đã được lưu hay tạo mới tại
trang chọn (Ứng dụng đã làm được điều này là Shopee.)


Về việc gợi ý sản phẩm cho người dùng:
Các ứng dụng thương mại điện tử hiện nay đa số gợi ý sản phẩm cho
người dùng dựa trên sản phẩm bán chạy nhất, sản phẩm mới nhất chung cho
tất cả các người dùng. Việc này có thể hiệu quả tốt trong thời gian đầu nhưng
về lâu thì chưa tốt (các sản phẩm bán chạy nhất được gợi ý nên được mua
nhiều hơn và tiếp tục dẫn đầu danh sách).
→ Nhóm sẽ áp dụng gợi ý sản phẩm cho từng người dùng khác nhau dựa
trên lịch sử mua hàng, đánh giá của họ đối với sản phẩm. Điều này
giúp tỉ lệ mua hàng của người dùng cao hơn, cải thiện doanh thu của
người bán và người mua có thể mua được sản phẩm ưng ý.
1.3 Mục đích của đề tài
Ứng dụng được mua bán Laptop và phụ kiện đi kèm được thực hiện dựa
trên các mục đích cụ thể sau:
Thứ nhất là nghiên cứu các cơng nghệ lập trình như: lập trình ứng dụng
với ngôn ngữ Dart và Flutter để xây dựng Front end; lập trình với ngơn ngữ
Elixir và framework Phoenix để xây dựng Back end cho ứng dụng; lập trình
với React JS để xây dựng trang admin cho ứng dụng. Ngồi ra, thực hiện
nghiên cứu và tìm hiểu phương pháp crawl data với Node JS để thu thập dữ
liệu thực tế cho nghiên cứu, xây dựng hệ thống gợi ý sản phẩm. Nghiên cứu
và hiện thực hóa các thuật tốn gợi ý sản phẩm, cụ thể là Content-based và
Collaborative. Có thể áp dụng trong ứng dụng trong việc gợi ý sản phẩm cũng
như những dự án khác sau này.
Thứ hai là phát triển ứng dụng có tính thực tiễn cao, có khả năng triển
khai ứng dụng vào thực tế, giúp những người có nhu cầu mua laptop và phụ

kiện có thể thao tác dễ dàng và tiện lợi.
Nhóm hy vọng dựa trên nền tảng lý thuyết đã được thầy cô truyền thụ
lại, kết hợp với sự tìm hiểu cơng nghệ của nhóm, luận văn tốt nghiệp của
nhóm sẽ đạt được mục đích như mong đợi.


1.4 Ý nghĩa của đề tài
Trước hết, đề tài ''Tìm hiểu Flutter và xây dựng ứng dụng minh họa'' là
một ứng dụng được xây dựng như một đề tài thể hiện việc áp dụng những
kiến thức quý báu đã được các thầy cô của trường Đại học Công nghệ Thông
tin – Đại học Quốc gia thành phố Hồ Chí Minh đã nhiệt tình truyền thụ lại
cho chúng em. Và đặc biệt là sự theo dõi và quan tâm giúp đỡ của thầy Trần
Anh Dũng trong suốt thời gian nhóm chúng em thực hiện đề tài này.
Thứ hai là những kinh nghiệm q báu mà nhóm có được trong q
trình thực hiện đề tài sẽ là hành trang tuyệt vời giúp ích rất nhiều cho công
việc sau này của mỗi thành viên trong nhóm.
1.5 Nhiệm vụ của đề tài
− Tìm hiểu các hoạt động kinh doanh sản phẩm laptop và phụ kiện trong
thực tế.
− Tìm hiểu cách thức xây dựng một ứng dụng đa nền tảng với Flutter
− Xây dựng thành cơng ứng dụng có tích hợp hệ thống hỗ trợ gợi ý sản
phẩm. Hệ thống gợi ý sản phẩm đạt hiệu năng cao: phản hồi nhanh, độ
chính xác cao.
− Hệ thống tối ưu hóa lợi nhuận đối với những khách hàng mới − Hệ
thống có khả năng ứng dụng và triển khai vào thực tiễn nhanh chóng
− Áp dụng và triển khai tốt các kiến thức đã nghiên cứu và học hỏi vào
hiện thức hóa ứng dụng
2. Phạm vi nghiên cứu:
− Xây dựng mobile app trên nền tảng Android và iOS với sự hỗ trợ của
Flutter

− Xây dựng app hướng đến các đổi tượng thường mua sắm online, có nhu
cầu mua Laptop và phụ kiện đi kèm
− Tìm hiểu về hệ thống gợi ý sản phẩm đối với 2 phương pháp: Content
based method, Collaborative filtering method dựa trên các khía cạnh: ý
tưởng, phương thức thực hiện và ưu, nhược điểm.
− Triển khai, đánh giá độ chính xác của từng phương pháp dựa trên dữ
liệu thực nghiệm.
− Áp dụng hệ thống gợi ý vào ứng dụng để gợi ý sản phẩm đến người
dùng các sản phẩm phù hợp nhất
3. Đối tượng nghiên cứu:
− Các công cụ và thư viện của Flutter
− Hệ thống recommendation system cho sản phẩm.
− Các công nghệ phù hợp hỗ trợ xây dựng ứng dụng minh họa: phương
pháp crawl data thu thập dữ liệu người dùng thực tế với sự hỗ trợ của
Node JS, ngơn ngữ lập trình Elixir và framework Phoenix, ...
− Những cá nhân có nhu cầu mua sắm online Laptop và các thiết bị phụ
kiện đi kèm trên nền tảng ứng dụng di dộng.
4. Phương pháp thực hiện:
− Làm việc nhóm hai thành viên, lên kế hoạch và thực hiện bằng cách
trao đổi trực tiếp hoặc gián tiếp qua các kênh chat online, quản lí task
cơng việc thơng qua trello
− Tham khảo các ứng dụng tương tự: shopee, tiki, lazada, ...
− Tham khảo ý kiến của giảng viên hướng dẫn để được định hướng đúng,
đạt kết quả tốt nhất.


− Thu thập phản hồi của người dùng để hoàn thiện, cải tiến ứng
dụng. 5. Kết quả mong đợi:

− Hiểu được các kiến thức liên quan đến Flutter.
− Biết cách sử dụng các cơng cụ hỗ trợ lập trình đa nền tảng với
Flutter. − Biết được các kỹ thuật lập trình với Flutter.
− Biết cách sử dụng các cơng nghệ hỗ trợ để xây dựng ứng dụng minh
họa. − Có khả năng dùng Flutter để xây dựng các ứng dụng đa nền tảng.
− Hoàn thành ứng dụng mua bán Laptop và thiết bị đi kèm với giao diện
trực quan, hoạt động tốt trên cả hai nền tảng Android và iOS.
− Đẩy mạnh tích hợp tính năng gợi ý, giới thiệu sản phẩm phù hợp - tạo
điều kiện thuận lợi nhất cho khách hàng.
− Ứng dụng có giao diện đẹp, dễ sử dụng tâm lý thoải mái cuốn hút khách
hàng khi sử dụng
− Tạo được sự liên kết logic giữa các màn hình để khách hàng có thể
chuyển màn hình một cách nhanh nhất và thuận tiện nhất.
− Đảm bảo tính bảo mật về các thông tin nhạy cảm của khách hàng tạo
cảm giác an toàn cho khách hàng.
− Đối với nhà quản trị có thể cập nhật, thêm xóa sửa đổi thông tin liên
quan đến mặt hàng và các vấn đề khác. Nhận và trả lời ý kiến về phía
khách hàng.
Kế hoạch thực hiện: nhóm chia kế hoạch thực hiện theo 8 giai đoạn cụ
thể Giai đoạn Thời gian Công việc


1. Khảo sát,
nghiên cứu

14/8/2020 20/8/2020

− Lựa chọn đề tài
− Phát biểu bài tốn
− Khảo sát các ứng dụng

tương tự
− Tìm hiểu cơng nghệ sử
dụng

2. Phân tích hệ
thống

21/8/2020 10/9/2020

− Phân tích, xác định
chức năng
− Đặc tả chức năng
− Vẽ lưu đồ
− Xây dựng CSDL, API
− Thiết kế wire-frames

3. Phát triển ứng

11/9/2020 -

− Tìm hiểu Flutter và ngơn

dụng

10/10/2020

ngữ Dart và ứng dụng
vào
việc xây dựng giao diện
ứng dụng

− Tìm hiểu ngơn ngữ Elixir
và framework phoenix vào
việc hiện thực hóa ứng
dụng theo các tính năng
cơ bản đã phân tích trước
đó
− Kết hợp song song kiểm
thử với hiện thức hóa sản
phẩm
- hạn chế bug phát sinh từ


giai đoạn đầu

4. Nghiên cứu và

11/10/202

ứng dụng crawl

0-

data trên các

20/10/202

trang web thực

0

tế

− Nghiên cứu phương
pháp crawl data, xử lí data
và
import data vào database
− Sử dụng data đã thu
thập được vào nghiên cứu
recommendation

5. Nghiên cứu,

21/10/202

− Nghiên cứu hệ thống

phân tích và ứng

0-

dụng phương

10/11/202

phương pháp Content-

pháp Content

0

based Filtering

based Filtering
trong hệ thống
recommendation
system

recommendation system

− Hiện thực hóa, tích hợp
hệ thống recommendation
system vào ứng dụng


6. Nghiên cứu,
phân tích và ứng

0-

dụng phương

30/11/202

pháp

− Nghiên cứu hệ thống

11/11/202

recommendation system

phương pháp

0

Conllaborative Filtering

Collaborative

− Hiện thực hóa, tích hợp

Filtering trong

hệ thống recommendation

hệ thống

system vào ứng dụng

recommendation
system
7. Kiểm thử và
sửa lỗi ứng dụng

− Thực hiện kiểm thử các

01/12/202
0-

chức năng, luồng hoạt

20/12/202

động của ứng dụng

0

− Tiến hành sửa các lỗi phần

8. Hoàn thiện báo
01/01/2021

mềm được tìm ra

cáo
10/01/2021
-

− Hồn thiện báo cáo, chuẩn
bị cho bảo vệ khóa luận


Xác nhận của CBHD

TP. HCM, ngày … tháng … năm

(Ký tên và ghi rõ họ tên)

2021 Sinh viên
(Ký tên và ghi rõ họ tên)

TRẦN ANH DŨNG

HUỲNH HẠ VY

NGUYỄN ĐÌNH HIỂN

ĐỖ NGỌC BÍCH TRÂM

MỤC LỤC
CHƯƠNG 1: GIỚI THIỆU CHUNG ........................................................................
1 1.1. Lý do chọn đề
tài............................................................................................. 1
1.2. Tính mới/ khác biệt về chức năng của đề tài so với một số ứng dụng thương
mại điện tử hiện nay. ..............................................................................................
2
1.2.1 Điểm mới nổi bật của đề tài...................................................................... 2
1.2.2 Tính khác biệt, cải thiện về chức năng...................................................... 2 1.3.
Đối tượng nghiên cứu: .................................................................................... 4 1.4.
Phạm vi nghiên cứu ........................................................................................ 4 1.5.
Phương pháp nghiên cứu ................................................................................ 5 1.6.
Bố cục của khóa luận ...................................................................................... 5
CHƯƠNG 2: KIẾN THỨC NỀN TẢNG.................................................................. 7
2.1. Tổng quan về Flutter....................................................................................... 7
2.1.1 Tổng quan và lịch sử.............................................................................. 7 2.1.2


Tổng quan về Flutter:.............................................................................. 11 2.1.3 Ưu
điểm và nhược điểm của Flutter ....................................................... 13 2.1.4 Khi
nào nên sử dụng Flutter.................................................................... 15 2.1.5 So sánh
cơ bản giữa Flutter và React Native .......................................... 15 2.1.6 So sánh chi

tiết giữa Flutter, React Native và Xamarin.......................... 16 2.2 Tổng quan về hệ
thông gợi ý ......................................................................... 21 2.2.1 Khái
niệm................................................................................................ 21 2.2.2 Các
phương pháp trong hệ thống khuyến nghị....................................... 23 a) Hệ thống
khuyến nghị theo nội dung (Content-based approach) ............ 23
b) Hệ thống khuyến nghị lọc cộng tác (Collaborative filtering).................. 25 c) Hệ
thống khuyến nghị lai (Hybrid recommender system)....................... 27 CHƯƠNG
3: XÂY DỰNG HỆ THỐNG ................................................................ 31 3.1 Xây
dựng kiến trúc hệ thống.......................................................................... 31 3.1.1 Xác
định yêu cầu hệ thống...................................................................... 31 3.1.2 Phân
tích yêu cầu hệ thống ..................................................................... 31 a) Phần ứng
dụng (khách hàng) ................................................................... 31 b) Phần Admin
(quản trị viên) ..................................................................... 34 3.1.3 Phân tích thiết
kế hệ thống...................................................................... 35 a) Sơ đồ use
case.......................................................................................... 35 b) Entity Relation
Diagram......................................................................... 47 c) Sơ đồ
lớp.................................................................................................. 48 3.1.4 Phân tích
và thiết kế CSDL..................................................................... 49 a) Bảng
PRODUCTS................................................................................... 52 b) Bảng
USERS ........................................................................................... 54 c) Bảng
USER_VIEW_PRODUCTS .......................................................... 55 d) Bảng
BRANDS........................................................................................ 56 e) Bảng
CATEGORIES............................................................................... 56 f) Bảng


FAVORITES .................................................................................. 57 g) Bảng
VOUCHERS .................................................................................. 57 h) Bảng
REVIEWS...................................................................................... 58 k) Bảng
REPLIES........................................................................................ 59 l) Bảng
ADDRESSES.................................................................................. 59 m) Bảng

ORDERS....................................................................................... 60
n) Bảng ORDER_LINES.............................................................................
61 o) Bảng CARTS...........................................................................................
62

q)

Bảng

CART_PRODUCTS ...................................................................... 62
3.2 Thiết kế giao diện...........................................................................................
63 3.2.1 Giao diện ứng dụng.................................................................................
63 a) Giao diện Onboarding.............................................................................. 63
b) Giao diện chính của ứng dụng................................................................. 65 c)
Giao diện Đăng nhập ............................................................................... 66 d)
Giao diện Đăng ký................................................................................... 67 e)
Giao diện Danh mục ................................................................................ 68 f)
Giao diện Tìm kiếm.................................................................................. 69 j)
Giao diện Danh sách sản phẩm ................................................................ 70 k)
Giao diện Tài khoản ................................................................................ 72 l)
Giao diện Thông tin sản phẩm.................................................................. 72 m)
Giao diện Giỏ hàng................................................................................. 76 n)
Giao diện Thanh toán .............................................................................. 79 o)
Giao diện Xem lịch sử đơn hàng ............................................................. 81 q)
Giao diện Danh sách yêu thích ................................................................ 82 p)
Giao diện Quản lý danh sách địa chỉ ....................................................... 83 3.2.2


Giao diện quản lý Admin (webapp React).............................................. 84 a)
Giao diện đăng nhập ................................................................................ 85 b)

Giao diện quản lý chính........................................................................... 85 c)
Giao diện quản lý đơn hàng..................................................................... 86 d)
Giao diện quản lý sản phẩm .................................................................... 87
f) Giao diện quản lý khuyến mãi.................................................................. 89 g)
Giao diện quản lý đánh giá, phản hồi ...................................................... 90
CHƯƠNG 4: ÁP DỤNG GỢI Ý SẢN PHẨM........................................................ 92
4.1 Thực nghiệm .................................................................................................. 92
4.1.1 Một số định nghĩa ................................................................................... 92 a)
Utility matrix............................................................................................ 92 b) Root
Mean Squared Error (RMSE) ......................................................... 94 4.1.2 Phương
pháp ........................................................................................... 95 a) Content-based
Recommender System ..................................................... 96 b) Neighborhood-based
Collaborative Filtering .......................................... 97 c) Matrix Factorization
Collaborative Filtering ......................................... 103 4.2 Đánh
giá ....................................................................................................... 104 4.2.1 So
sánh kết quả ..................................................................................... 104 4.2.2
Content-based Recommender System .................................................. 104
4.2.3 Neighborhood-based Collaborative Filtering và Matrix Factorization
Collaborative Filtering ...................................................................................
105
4.3 Áp dụng Neighborhood-based Collaborative Filtering................................ 105
4.4 Ứng dụng Content-based filtering ............................................................... 106
CHƯƠNG 5: KẾT LUẬN, HƯỚNG PHÁT TRIỂN ........................................... 108
5.1 Kết quả đạt được .......................................................................................... 108
5.2 Ưu điểm ....................................................................................................... 108


5.3 Nhược điểm.................................................................................................. 109
5.4 Hướng phát triển .......................................................................................... 109

DANH MỤC HÌNH VẼ

Hình 3. 1: Biểu đồ use case mức tổng quát..............................................................
35

Hình

3.

2:

Biểu

đồ

use

case

Đăng

nhập ................................................................... 36 Hình 3. 3: Biểu đồ use case
Quản lý sản phẩm........................................................ 37 Hình 3. 4: Biểu đồ use
case Quản lý đơn hàng........................................................ 37 Hình 3. 5: Biểu đồ use
case Quản lý mã khuyến mãi .............................................. 38 Hình 3. 6: Biểu đồ
use case Quản lý phản hồi, đánh giá ......................................... 39 Hình 3. 7: Biểu
đồ use case Tìm kiếm sản phẩm..................................................... 39 Hình 3. 8:
Biểu đổ use case Xem sản phẩm............................................................. 40 Hình 3.
9: Biểu đồ use case Bình luận và đánh giá.................................................. 41 Hình
3. 10: Biểu đồ use case Đặt mua hàng ............................................................ 41

Hình 3. 11: Biểu đồ use case Theo dõi đơn hàng ....................................................
42

Hình

3.

12:

Biểu

đồ

use

case

Quản

lý

sản

phẩm

u

thích...................................... 43 Hình 3. 13: Biểu đồ use case Quản lý địa chỉ giao
hàng

.........................................

43

Hình

3.

14:

Biểu

đồ

Entity

Relation......................................................................... 48 Hình 3. 15: Biểu đồ
lớp............................................................................................ 48 Hình 3. 16: Giao
diện Onboarding........................................................................... 65 Hình 3. 17:
Giao diện chính của ứng dụng .............................................................. 66 Hình 3.
18: Giao diện Đăng nhập ............................................................................ 67 Hình
3. 19: Giao diện Đăng ký ................................................................................ 68
Hình 3. 20: Giao diện Danh mục .............................................................................
69 Hình 3. 21: Giao diện Tìm kiếm..............................................................................
70

Hình

3.

22:

Giao

diện

Danh

sách

sản

phẩm............................................................. 71 Hình 3. 23: Giao diện Tài
khoản.............................................................................. 72 Hình 3. 24: Giao diện
Thơng tin sản phẩm.............................................................. 76 Hình 3. 25: Giao


diện Giỏ hàng ............................................................................... 77 Hình 3. 26:
Giao diện Giỏ hàng đang có sản phẩm ................................................. 78 Hình 3.
27: Giao diện Chọn voucher ....................................................................... 79
Hình 3. 28: Giao diện Thanh tốn............................................................................
80

Hình

3.

29:

Giao

diện

Đặt

hàng

thành

cơng............................................................. 81 Hình 3. 30: Giao diện Lịch sử
order ........................................................................ 82 Hình 3. 31: Giao diện Danh
sách u thích ............................................................. 83 Hình 3. 32: Giao diện
Quản lý danh sách địa chỉ .................................................... 84 Hình 3. 33: Giao
diện Đăng nhập quản lý admin .................................................... 85 Hình 3. 34:
Giao diện Quản lý admin ...................................................................... 86 Hình 3.
35: Giao diện Danh sách đơn hàng ............................................................. 86 Hình
3. 36: Giao diện Chi tiết đơn hàng.................................................................. 87 Hình
3. 37: Giao diện Danh sách sản phẩm............................................................. 87
Hình 3. 38: Giao diện Chi tiết sản phẩm..................................................................
88 Hình 3. 39: Giao diện Tạo mới sản phẩm................................................................
88

Hình

3.

40:

Giao

diện

Xem

danh

sách

khuyến

mãi ................................................. 89 Hình 3. 41: Giao diện Thêm mã khuyến
mãi........................................................... 89 Hình 3. 42: Giao diện Danh sách đánh
giá .............................................................. 90 Hình 3. 43: Giao diện Chi tiết đánh
giá ................................................................... 90 Hình 3. 44: Giao diện Phản
hồi................................................................................ 91
Hình 4. 1: Utility matrix...........................................................................................
92

Hình

4.

2:

Cơng

thức

tính

RMSE............................................................................. 95 Hình 4. 3: Kết quả load
dữ liệu Content-based........................................................ 96 Hình 4. 4: Ví dụ
feature vector của các item ........................................................... 96 Hình 4. 5: Kết
quả dự đốn content-based............................................................... 97 Hình 4. 6:
RMSE của content-based........................................................................ 97 Hình 4.
7: Các bước neighborhood-based CF.......................................................... 99 Hình 4.
8: Ý tưởng của Matrix Factorization CF................................................... 103 Hình 4.


9: Hiển thị kết quả gợi ý trong ứng dụng.................................................. 106 Hình 4.
10: Hiển thị kết quả gợi ý trong ứng dụng................................................ 107

DANH MỤC BẢNG
Bảng 3. 1: Danh sách actors.....................................................................................
44

Bảng

3.

2:

Danh

sách

use

cases ............................................................................... 46 Bảng 3. 3: Các lớp của
sơ đổ lớp ............................................................................. 49 Bảng 3. 4: Các đối

tượng và thuộc tính của đối tượng ............................................ 52 Bảng 3. 5: Bảng
PRODUCTS.................................................................................. 54 Bảng 3. 6:
Bảng USERS.......................................................................................... 55 Bảng 3. 7:
Bảng USER_VIEW_PRODUCTS......................................................... 56 Bảng 3. 8:
Bảng BRANDS ...................................................................................... 56 Bảng 3.
9: Bảng CATEGORIES.............................................................................. 57 Bảng 3.
10: Bảng FAVORITES............................................................................... 57 Bảng 3.
11: Bảng VOUCHERS............................................................................... 58 Bảng 3.
12: Bảng REVIEWS................................................................................... 59 Bảng
3. 13: Bảng REPLIES..................................................................................... 59
Bảng 3. 14: Bảng ADDRESSES..............................................................................
60

Bảng

3.

15:

Bảng

ORDERS..................................................................................... 61 Bảng 3. 16:
Bảng ORDER_LINES.......................................................................... 62 Bảng 3.
17: Bảng CARTS........................................................................................ 62 Bảng
3. 18: Bảng CART_PRODUCT ..................................................................... 63

DANH MỤC TỪ VIẾT TẮT
Từ thường

Từ đầy đủ

Giải thích

TMĐT

Thương mại điện tử

Hình thức mua sắm online

CSDL

Cơ sở dữ liệu

Cơ sở dữ liệu cho ứng dụng

APP

Application

Ứng dụng

dùng


CHƯƠNG 1: GIỚI THIỆU CHUNG
1.1. Lý do chọn đề tài
Ngày nay, công nghệ thông tin ngày một phát triển, kéo theo đó là sự bùng
nổ của các thiết bị điện tử, đặc biệt là điện thoại thông minh và máy tính. Nếu như
trước đây việc sở hữu một chiếc điện thoại thơng minh hay máy tính khá khó khăn
thì ngày nay do sự cạnh tranh gay gắt giữa các thương hiệu khiến giá thành những

thiết bị này rẻ hơn và việc sở hữu chúng trở nên dễ dàng hơn. Vì thế nhu cầu phát
triển ứng dụng cho các thiết bị này càng ngày càng tăng cao.
Để tiếp cận đến nhiều người dùng, các nhà phát triển ứng dụng mong muốn
ứng dụng của họ chạy được trên nhiều nền tảng đặc biệt là Android, iOS, Windows,
MacOS và web. Thay vì phải tìm hiểu nhiều ngơn ngữ, cơng nghệ khác nhau ứng
với từng nền tảng thì hiện nay trên thị trường có nhiều cơng cụ hỗ trợ lập trình đa
nền tảng như Flutter, React Native, Ionic, … giúp các nhà phát triển ứng dụng tiết
kiệm thời gian, chi phí dành cho quá trình phát triển ứng dụng.
Trong số đó có Flutter mặc dù là cơng cụ ra đời muộn nhất nhưng có tốc độ phát
triển vượt trội và nhiều ưu điểm so với các công nghệ đi trước, nhiều công ty công
nghệ lớn sử dụng Flutter để phát triển sản phẩm của mình như Google, Alibaba,
Tencent,… Ứng dụng xây dựng với Flutter hoạt động với hiệu năng mạnh mẽ và
hiếm có vấn đề về mặt tương thích, ngồi ra đây cịn là cơng cụ mã nguồn mở nên
ngày càng nhiều lập trình viên và công ty quan tâm đến công nghệ mới này.
Đây là lý do nhóm chọn đề tài khóa luận tốt nghiệp là “Tìm hiểu Flutter và xây
dựng ứng dụng minh họa”. Ngoài ra, trong thời điểm dịch toàn cầu COVID-19
đang diễn ra, thơng qua các kiến thức đã tìm hiểu, tích lũy được nhóm nhận thấy từ
việc mua hàng qua mạng chỉ với thủ tục đăng ký mua sắm đơn giản nhưng đem lại
nhiều lợi ích: tiết kiệm và chủ động về thời gian, tránh những nơi đông người và
tránh khỏi những phiền phức khó chịu. Vậy nên việc mua bán hàng qua mạng đang
rất được mọi người quan tâm. Trên cơ sở các kiến thức được học trong nhà trường
1
và quá trình tìm hiểu các website trong thực tế, nhóm đã quyết định tích hợp thêm
hệ thống hỗ trợ gợi ý sản phẩm vào ứng dụng hiện tại nhằm hỗ trợ khách hàng đến