Tìm hiểu về recommendation system và xây dựng ứng dụng minh họa

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

BÁO CÁO MƠN HỌC
Đề tài: Tìm hiểu về Recommendation System
và xây dựng ứng dụng minh họa

ĐỒ ÁN 1 – SE122.N11

Giảng viên hướng dẫn: Ths. Huỳnh Hồ Thị Mộng Trinh
Sinh viên thực hiện:
1.

Nguyễn Thị Phương Thảo

19520280

2.

Đinh Trần Văn Minh

19520715

TP. Hồ Chí Minh, tháng 10 năm 2022
1


LỜI CẢM ƠN
Lời đầu tiên, chúng em xin chân thành cảm ơn sự hướng dẫn tận tình của cơ Huỳnh

Hồ Thị Mộng Trinh – giảng viên hướng dẫn môn Đồ án 1 đã hỗ trợ những thông tin
cần thiết và giải đáp những thắc mắc cho nhóm trong suốt quá trình thực hiện đề tài.
Đồng thời, nhóm em cũng muốn gửi lời cảm ơn đến các anh chị khóa trên, đặc biệt
là các anh chị trong khoa đã chia sẻ những kinh nghiệm quý báu về môn học cùng
những kiến thức liên quan.
Vì kiến thức của chúng em vẫn cịn hạn hẹp nên khơng thể tránh khỏi những thiếu
sót trong q trình thực hiện đồ án. Vì vậy, nhóm chúng em ln mong đợi nhận được
những ý kiến đóng góp q báu từ phía giảng viên để qua đó có thể rút kinh nghiệm,
tự sửa chữa, hoàn thiện bản thân mình trên tinh thần nghiêm túc, tự giác học hỏi. Một
lần nữa nhóm chúng em xin chân thành cảm ơn cơ.

Nhóm nghiên cứu

2


NHẬN XÉT CỦA GIẢNG VIÊN

3


MỤC LỤC
Chương 1. TỔNG QUAN ĐỀ TÀI..........................................................................1
1.1.

Thực trạng..................................................................................................1

1.2.

Mục tiêu......................................................................................................1

1.3.

Phạm vi.......................................................................................................1

Chương 2. CƠ SỞ LÝ THUYẾT VÀ CÔNG NGHỆ............................................2
2.1.

Cơ sở lý thuyết...........................................................................................2

2.1.1.

Phân loại.............................................................................................2

2.1.2.

Content-based Recommendation Systems...........................................3

2.1.3.

Neighborhood-based Collaborative Filtering.....................................4

2.2.

Công nghệ..................................................................................................7

2.2.1.

TypeScript...........................................................................................7

2.2.2.

Python.................................................................................................8

2.2.3.

NodeJS.................................................................................................8

2.2.4.

ReactJS................................................................................................9

2.2.5.

Redux & Redux-Saga..........................................................................9

2.2.6.

MUI...................................................................................................11

2.2.7.

NestJS................................................................................................11

2.2.8.

MongoDB..........................................................................................12

2.3.

Kiến trúc hệ thống....................................................................................12

Chương 3. PHÂN TÍCH THIẾT KẾ ỨNG DỤNG.............................................14
3.1.

Yêu cầu nghiệp vụ....................................................................................14

3.1.1.

Danh sách các yêu cầu......................................................................14

3.1.2.

Danh sách biểu mẫu và quy định......................................................14

3.2.

Use-case...................................................................................................16

3.2.1.

Sơ đồ Use-case..................................................................................16

3.2.2.

Danh sách đối tượng sử dụng Use-case............................................17

3.2.3.

Danh sách Use-case..........................................................................18

3.2.4.

Đặc tả Use-case................................................................................18

3.3.

Activity.....................................................................................................25

3.3.1.

Danh sách Activity............................................................................25

3.3.2.

Sơ đồ Activity....................................................................................26
4


3.4.

Sequence Diagram....................................................................................29

3.4.1.

Fetch User Recommendations...........................................................29

3.4.2.

Swipes và Matches............................................................................30

3.5.

Thiết kế cơ sở dữ liệu...............................................................................30

3.6.

Thiết kế giao diện.....................................................................................31

Đăng nhập........................................................................................................31
Chương 4. TỔNG KẾT..........................................................................................32
4.1.

Kết quả.....................................................................................................32

4.2.

Hạn chế.....................................................................................................32

4.3.

Hướng phát triển.......................................................................................32

Chương 5. BẢNG PHÂN CÔNG CÔNG VIỆC..................................................33
TÀI LIỆU THAM KHẢO.....................................................................................34

5


DANH MỤC HÌNH ẢNH

Hình 2.1-1: Phân loại Recommendation....................................................................9
Hình 2.1-2: Mơ tả thuật tốn Content-based Recommendation...............................11
Hình 2.1-3: Ví dụ User-user Collaborative Filtering...............................................12
Hình 2.2-1: Typescript.............................................................................................15
Hình 2.2-2: Python...................................................................................................15
Hình 2.2-3: NodeJS..................................................................................................15
Hình 2.2-4: ReactJS..................................................................................................16
Hình 2.2-5: Flow của Redux....................................................................................17
Hình 2.2-6: Flow của Redux-saga............................................................................18
Hình 2.2-7: MUI.......................................................................................................18
Hình 2.2-8: Nest.......................................................................................................19
Hình 2.2-9: MongoDB.............................................................................................19
Hình 3.2-1: Sơ đồ Use-case......................................................................................24
Hình 3.3-1: Sơ đồ Activity Đăng nhập.....................................................................34
Hình 3.3-2: Sơ đồ Activity Đăng ký........................................................................35
Hình 3.3-3: Sơ đồ Activity Quản lý thơng tin cá nhân.............................................36
Hình 3.4-1: Sequence Diagram Fetch User Recommendation................................37
Hình 3.4-2: Sequence Diagram Swipes và Matches................................................37
Hình 3.5-1: Sơ đồ cơ sở dữ liệu...............................................................................37

6


DANH MỤC BẢNG BIỂU
Bảng 3.1.1-1: Danh sách các yêu cầu nghiệp vụ......................................................21
Bảng 3.1.2-1: Biểu mẫu yêu cầu Thêm thông tin cá nhân.......................................21
Bảng 3.1.2-2: Biểu mẫu yêu cầu Tùy chọn đề xuất.................................................22
Bảng 3.1.2-2: Biểu mẫu yêu cầu Xem đề xuất người dùng khác có vị trí gần mình23
Bảng 3.1.2-2: Biểu mẫu u cầu Nhận thơng báo khi hợp vói người dùng khác....23
Bảng 3.2.2-1: Danh sách đối tượng sử dụng Use-case.............................................25

Bảng 3.2.3-1: Danh sách Use-case...........................................................................25
Bảng 3.2.4-1: Đặc tả Use-case Đăng nhập...............................................................26
Bảng 3.2.4-2: Đặc tả Use-case Đăng ký...................................................................28
Bảng 3.2.4-3: Đặc tả Use-case Quản lý thông tin cá nhân.......................................29
Bảng 3.2.4-4: Đặc tả Use-case Quản lý đối tượng yêu thích...................................30
Bảng 3.2.4-5: Đặc tả Use-case Quản lý chỉ số cơ thể..............................................31
Bảng 3.2.4-6: Đặc tả Use-case Quản lý thực phẩm.................................................32
Bảng 3.3.1-1: Danh sách Activity............................................................................33

7


Chương 1. TỔNG QUAN ĐỀ TÀI
1.1. Thực trạng
Cuộc sống hiện đại, chúng ta bị cuốn theo vòng xoay của đồng tiền mà khơng có
thời gian quan tâm đến chuyện tình cảm. Vì vậy, việc tìm kiếm đến những ứng dụng
hẹn hò online của nhiều người đang được dần phổ biến và trở nên rộng rãi. Chỉ cần có
bên mình một chiếc laptop hay chiếc smartphone là có thể truy cập, kết bạn được
ngay. Thông qua các ứng dụng này, bạn có thể thể hiện cá tính của bản thân. Đồng
thời tìm kiếm được nhiều người giống với những tiêu chí mà mình đã đề ra. Tuy
nhiên, đây cũng là mơi trường ẩn chứa nhiều mối nguy hại cần phải đề cao cảnh giác.
Hiểu được điều đó, ứng dụng kết bạn Finder đã được nhóm chọn làm đề tài để nghiên
cứu và phát triển.
Ứng dụng hệ thống Recommendation System, tính năng đề xuất kết bạn, giúp
người dùng dễ dàng tìm kiếm bạn bè phù hợp dựa trên các dữ liệu tương tác của họ.
Những người xuất hiện trong danh sách những gợi ý này có thể là những người bạn
xung quanh, có chung sở thích, cơng việc và độ tuổi phù hợp.
1.2. Mục tiêu
-

Xây dựng kho dữ liệu các thực phẩm và công thức nấu ăn với các nội dung
dinh dưỡng, hình ảnh,…

-

Xây dựng các chức năng giúp tính tốn dinh dưỡng cần thiết cho mỗi người
dùng tùy theo mục tiêu và mong muốn cá nhân.

-

Xây dựng các chức năng hỗ trợ theo dõi, quản lý việc xây dựng bữa ăn dinh
dưỡng cho người dùng.

1.3. Phạm vi
-

Những cá nhân khơng có nhiều kinh nghiệm cũng như kiến thức về thực phẩm
và dinh dưỡng, mong muốn tìm hiểu và trang bị thêm cho mình kiến thức.

-

Những cá nhân/tổ chức quan tâm lĩnh vực thực phẩm và dinh dưỡng, mong
muốn nâng cao chế độ dinh dưỡng, sức khỏe của mình.

-

Những cá nhân/tổ chức muốn có một cơng cụ giúp dễ dàng tìm kiếm mọi thông
tin liên quan đến thực phẩm và dinh dưỡng.

-

Những cá nhân/tổ chức chưa hài lịng về các cơng cụ hỗ trợ tìm kiếm và lưu trữ
thơng tin thực phẩm đang sử dụng.
1


2


Chương 2. CƠ SỞ LÝ THUYẾT VÀ CÔNG NGHỆ
2.1. Cơ sở lý thuyết Recommendation System
Recommender System là một trong những ứng dụng phổ biến nhất của khoa học dữ
liệu ngày nay. Chúng được sử dụng để dự đoán "rating" hoặc "preference" mà người
dùng sẽ dành cho một mặt hàng. Hầu hết mọi công ty công nghệ lớn đều đã áp dụng
chúng dưới một số hình thức.
 Amazon sử dụng nó để đề xuất sản phẩm cho khách hàng
 Netflix sử dụng gợi ý phim cho người dùng
 YouTube sử dụng nó để đề xuất các video và quyết định video sẽ phát tiếp
theo trên chế độ tự động phát
 Facebook sử dụng nó để gợi ý kết bạn, đề xuất các trang để thích và mọi
người theo dõi.
2.1.1. Phân loại

Hình 2.1-1: Phân loại Recommendation

Nhìn chung, hệ thống Recommender System có thể được chia thành 4 loại chính:
 Simple Recommenders: Đưa ra các đề xuất tổng quát cho mọi người dùng,
dựa trên mức độ phổ biến và/hoặc thể loại phim. Ý tưởng cơ bản đằng sau
hệ thống này là những bộ phim nổi tiếng hơn và được giới phê bình đánh giá
cao hơn sẽ có xác suất được khán giả bình thường thích cao hơn.

3


 Content-based Recommenders: Đề xuất các mặt hàng/phim tương tự dựa
trên một mặt hàng/phim cụ thể. Hệ thống này sử dụng siê dữ liệu mục,
chẳng hạn như thể loại, đạo diễn, mô tả, diễn viên, v.v. cho phim, để đưa ra
các đề xuất này. Ý tưởng chung đằng sau các hệ thống giới thiệu này là nếu
một người thích một mặt hàng cụ thể, họ cũng sẽ thích một mặt hàng tương
tự với nó. Và để khuyến nghị điều đó, nó sẽ sử dụng siêu dữ liệu mục trước
đây của người dùng. Một ví dụ điển hình có thể là YouTube, nơi dựa trên
lịch sử của bạn, nó gợi ý cho bạn những video mới mà bạn có thể xem.
 Collaborative filtering Recommenders: Những hệ thống này được sử dụng
rộng rãi và chúng cố gắng dự đoán “ratings” hoặc “preference” mà người
dùng sẽ đưa ra một mặt hàng dựa trên xếp hạng trước đây và sở thích của
những người dùng khác. Bộ lọc cộng tác không yêu cầu siêu dữ liệu mục
giống như các bộ lọc dựa trên nội dung của nó.
 Hybrid Recommenders: Hybrid Filtering là sự kết hợp của hai giải thuật
Content-based Filtering và Collabrative Filtering: Hybrid Fitering được sử
dụng mềm dẻo khi hệ thống Collabrative Filtering không có các hành vi
(ratings), khi đó hệ thống sẽ sử dụng Content-based Filtering và ngược lại,
khi Content-based Filtering khơng có các feature cần thiết trong việc đánh
giá thì hệ thống sẽ sử dụng Collaborative Fitering để thay thế.
2.1.2. Content-based Recommendation Systems

Đối với phương pháp content-based, hệ thống sẽ đánh giá các đặc tính của items
được recommended. Nó sẽ gợi ý các item dựa trên hồ sơ (profiles) của người dùng
hoặc dựa vào nội dung, thuộc tính (attributes) của những item tương tự như item mà
người dùng đã chọn trong quá khứ. Ví dụ: một người rất thích ăn cam, vậy thì hệ
thống gợi ý một loại trái cây tương tự với cam, ở đây là bưởi để đề xuất. Cách tiếp cận
này yêu cầu việc sắp xếp các items vào từng nhóm hoặc đi tìm các đặc trưng của từng

item.

4


Hình 2.1- 2: Mơ tả thuật tốn Content-based Recommendation
2.1.3. Neighborhood-based Collaborative Filtering

Ý tưởng cơ bản của Neighborhood-Based Collaborative Filtering là xác định mức
độ quan tâm của một user tới một item dựa trên các users khác gần giống với user này.
Việc gần giống nhau giữa các users có thể được xác định thông qua mức độ quan tâm
của các users này tới các items khác mà hệ thống đã biết. Ví dụ, A, B đều thích phim
CCC, tức đều rate bộ phim này 5 sao. Ta đã biết A cũng thích một phim AAA, vậy
nhiều khả năng B cũng thích bộ phim này.
Neighborhood-based Collaborative Filtering trả lời 2 câu hỏi:
 Làm thế nào xác định được sự giống nhau giữa hai users?
 Khi đã xác định được các users gần giống nhau (similar users) rồi, làm thế
nào dự đoán được mức độ quan tâm của một user lên một item?
Việc xác định mức độ quan tâm của mỗi user tới một item dựa trên mức độ quan
tâm của similar users tới item đó cịn được gọi là User-user collaborative filtering. Có
một hướng tiếp cận khác được cho là làm việc hiệu quả hơn là Item-item collaborative
filtering. Trong hướng tiếp cận này, thay vì xác định user similarities, hệ thống sẽ xác
5


định item similarities. Từ đó, hệ thống gợi ý những items gần giống với những items
mà user có mức độ quan tâm cao.
Thuật tốn
Cơng việc quan trọng nhất phải làm trước tiên trong User-user Collaborative
Filtering là phải xác định được sự giống nhau (similarity) giữa hai users. Dữ liệu duy

nhất chúng ta có là Utility matrix Y , vậy nên sự giống nhau này phải được xác định
dựa trên các cột tương ứng với hai users trong ma trận này. Xét ví dụ:

Hình 2.1-3: Ví dụ User-user Collaborative Filtering

Một cách trực quan, hành vi của u 0 giống với u 1 hơn là u 2, u 3, u 4 , u 5, u 6. Từ đó
có thể dự đốn rằng u 0 sẽ quan tâm tới i2 vì u 1 cũng quan tâm tới item này.
Giả sử có các users từ u 0 đến u 6 và các items từ i 0 đến i 4  trong đó các số trong
mỗi ơ vuông thể hiện số sao mà mỗi user đã rated cho item với giá trị cao hơn thể
hiện mức độ quan tâm cao hơn. Các dấu hỏi chấm là các giá trị mà hệ thống cần phải
đi tìm. Đặt mức độ giống nhau của hai users ui, uj là ¿(ui, uj). Vì vậy, một similiarity
function tốt cần đảm bảo:
¿( u 0 ,u 1)> ¿(u 0 , u i) , ∀i>1

Để đo similarity giữa hai users, cách thường làm là xây dựng feature vector cho
mỗi user rồi áp dụng một hàm có khả năng đo similarity giữa hai vectors đó. Chú ý
rằng việc xây dựng feature vector này khác với việc xây dựng item profiles như trong
Content-based Recommendation Systems. Các vectors này được xây dựng trực tiếp
dựa trên Utility matrix chứ khơng dùng dữ liệu ngồi như item profiles. Với mỗi user,
thông tin duy nhất chúng ta biết là các ratings mà user đó đã thực hiện, tức cột tương
ứng với user đó trong Utility matrix. Tuy nhiên, khó khăn là các cột này thường có rất
6


nhiều mising ratings vì mỗi user thường chỉ rated một số lượng rất nhỏ các items.
Cách khắc phục là bằng cách nào đó, ta giúp hệ thống điền các giá trị này sao cho việc
điền không làm ảnh hưởng nhiều tới sự giống nhau giữa hai vector. Việc điền này chỉ
phục vụ cho việc tính similarity chứ khơng phải là suy luận ra giá trị cuối cùng.
Vậy mỗi dấu ‘?’ nên được thay bởi giá trị nào để hạn chế việc sai lệch quá nhiều?
Một lựa chọn có thể nghĩ tới là thay các dấu ‘?’ bằng giá trị ‘0’. Điều này khơng thực

sự tốt vì giá trị ‘0’ tương ứng với mức độ quan tâm thấp nhất. Một giá trị an tồn hơn
là 2.5 vì nó là trung bình cộng của 0, mức thấp nhất, và 5, mức cao nhất. Tuy nhiên,
giá trị này có hạn chế đối với những users dễ tính hoặc khó tính. Với các users dễ tính,
thích tương ứng với 5 sao, khơng thích có thể ít sao hơn, 3 sao chẳng hạn. Việc chọn
giá trị 2.5 sẽ khiến cho các items còn lại là quá negative đối với user đó. Điều ngược
lại xảy ra với những user khó tính hơn khi chỉ cho 3 sao cho các items họ thích và ít
sao hơn cho những items họ khơng thích.
Một giá trị khả dĩ hơn cho việc này là trung bình cộng của các ratings mà user
tương ứng đã thực hiện. Việc này sẽ tránh được việc users q khó tính hoặc dễ tính,
tức lúc nào cũng có những items mà một user thích hơn so với những items khác.
Chuẩn hoá dữ liệu
Giá trị cao tương ứng với các user dễ tính và ngược lại. Khi đó, nếu tiếp tục trừ từ
mỗi rating đi giá trị này và thay các giá trị chưa biết bằng 0, ta sẽ được normalized
utility matrix có thể thắc mắc tại sao bước chuẩn hoá này lại quan trọng, câu trả lời ở
ngay đây:
Việc trừ đi trung bình cộng của mỗi cột khiến trong trong mỗi cột có những giá trị
dương và âm. Những giá trị dương tương ứng với việc user thích item, những giá trị
âm tương ứng với việc user khơng thích item. Những giá trị bằng 0 tương ứng với việc
chưa xác định được liệu user có thích item hay khơng.
Về mặt kỹ thuật, số chiều của utility matrix là rất lớn với hàng triệu users và items,
nếu lưu toàn bộ các giá trị này trong một ma trận thì khả năng cao là sẽ khơng đủ bộ
nhớ. Quan sát thấy rằng vì số lượng ratings biết trước thường là một số rất nhỏ so với
kích thước của utility matrix, sẽ tốt hơn nếu chúng ta lưu ma trận này dưới dạng
sparse matrix, tức chỉ lưu các giá trị khác khơng và vị trí của chúng. Vì vậy, tốt hơn
hết, các dấu ‘?’ nên được thay bằng giá trị ‘0’, tức chưa xác định liệu user có thích
7


item hay không. Việc này không những tối ưu bộ nhớ mà việc tính tốn similarity
matrix sau này cũng hiệu quả hơn.

Cosine similarity
Đây là hàm được sử dụng nhiều nhất, và cũng quen thuộc với các nhất. Nếu các
không nhớ cơng thức tính coscos của góc giữa hai vector u 1,u 2 trong chương trình
phổ thơng, thì dưới đây là cơng thức:
cosin e similarity (u 1 ,u 2 )=cos (u 1, u 2)=

uT 1 u 2
¿∨u 1∨¿ 2.∨¿ u2∨¿ 2

Trong đó u 1,2 là vectors tương ứng với users 1, 2 đã được chuẩn hố như ở trên.
Có một tin vui là python có hàm hỗ trợ tính toán hàm số này một cách hiệu quả.
Độ similarity của hai vector là 1 số trong đoạn [-1, 1]. Giá trị bằng 1 thể hiện hai
vector tồn tồn similar nhau. Hàm số coscos của một góc bằng 1 nghĩa là góc giữa
hai vector bằng 0, tức một vector bằng tích của một số dương với vector cịn lại. Giá
trị cos bằng -1 hể hiện hai vector này hồn toàn trái ngược nhau. Điều này cũng hợp
lý, tức khi hành vi của hai users là hồn tồn ngược nhau thi similarity giữa hai vector
đó là thấp nhất.
Rating prediction:
Công thức phổ biến được sử dụng để dự đoán rating của u cho i là:
yi

❑ , u=∑uj ∈ N ( u , i ) yi ,ujsim(u , uj)

trong đó  N (u , i) là tập hợp kk users trong neighborhood (tức có similarity cao nhất)
của uu mà đã rated i.
Việc hệ thống quyết định recommend items nào cho mỗi user có thể được xác định
bằng nhiều cách khác nhau. Có thể sắp xếp unrated items theo thứ tự tự lớn đến bé của
các predicted ratings, hoặc chỉ chọn các items có normalized predicted ratings dương tương ứng với việc user này có nhiều khả năng thích hơn.
2.2. Cơng nghệ
2.2.1. TypeScript

8


Hình 2.2- 4: Typescript

-

TypeScript bổ sung các cú pháp cho JavaScript nhằm hỗ trợ sự tích hợp chặt
chẽ hơn với trình soạn thảo, nhằm bắt các lỗi có thể xảy ra ngay từ rất sớm.

-

Code TypeScript được chuyển đổi sang JavaScript, để code chạy được ở bất cứ
đâu mà JavaScript có thể chạy: trình duyệt, NodeJS hoặc trong các ứng dụng,…

-

TypeScript hiểu được JavaScript code và sử dụng kỹ thuật tự động xác định
kiểu dữ liệu để hỗ trợ việc lập trình tuyệt vời hơn và khơng cần phải viết thêm
các nhiều đoạn code.
2.2.2. Python

Hình 2.2- 5: Python

Python là một ngơn ngữ lập trình được sử dụng rộng rãi trong các ứng dụng
web, phát triển phần mềm, khoa học dữ liệu và máy học (ML). Các nhà phát
triển sử dụng Python vì nó hiệu quả, dễ học và có thể chạy trên nhiều nền tảng
khác nhau. Phần mềm Python được tải xuống miễn phí, tích hợp tốt với tất cả
các loại hệ thống và tăng tốc độ phát triển.

2.2.3. NodeJS

Hình 2.2- 6: NodeJS

9


NodeJS là một nền tảng dựa vào Chrome Javascript runtime để xây dựng các
ứng dụng nhanh, có độ lớn. NodeJS sử dụng các phần phát sinh các sự kiện
(event-driven), mô hình non-blocking I/O để tạo ra các ứng dụng nhẹ và hiệu
quả cho các ứng dụng về dữ liệu thời gian thực chạy trên các thiết bị phân tán.
2.2.4. ReactJS

Hình 2.2- 7: ReactJS

ReactJS là một thư viện JavaScript đang nổi lên trong những năm gần đây với
xu hướng Single Page Application. Trong khi những framework khác cố gắng
hướng đến một mơ hình MVC hồn thiện thì React nổi bật với sự đơn giản và
dễ dàng phối hợp với những thư viện JavaScript khác. Nếu như AngularJS là
một Framework cho phép nhúng code JavaScript trong code html thông qua các
attribute như ng-model, ng-repeat...thì với React là một library cho phép nhúng
code html trong code javascript nhờ vào JSX, bạn có thể dễ dàng lồng các đoạn
HTML vào trong JavaScript. Tích hợp giữa JavaScript và HTML vào trong JSX
làm cho các component dễ hiểu hơn.
2.2.5. Redux & Redux-Saga

-

Redux:
o Là một thư viện JavaScript giúp tạo ra thành một lớp quản lý trạng thái

của ứng dụng. Được dựa trên nền tảng tư tưởng của ngôn ngữ Elm kiến
trúc Flux do Facebook giới thiệu, do vậy Redux thường là bộ đơi kết hợp
hồn hảo với React (ReactJS và React Native).
o Nguyên lý của Redux: Redux được xây dựng dựa trên 3 nguyên lý.
 Trạng thái (state) của toàn bộ ứng dụng được lưu trong trong 1
store duy nhất là 1 Object mơ hình tree.
10


 Chỉ có 1 cách duy nhất để thay đổi trạng thái (state) đó là tạo ra
một action (là 1 object mơ tả những gì xảy ra).

 Để chỉ rõ trạng thái (state) tree được thay đổi bởi 1 action bạn
phải viết pure reducers.

Hình 2.2- 8: Flow của Redux

-

Redux-Saga:
o Là một thư viện redux middleware, giúp quản lý những side effect trong
ứng dụng redux trở nên đơn giản hơn. Bằng việc sử dụng tối đa tính
năng Generators (function*) của ES6, nó cho phép ta viết async code
nhìn giống như là synchronos.
o Đối với logic của saga, ta cung cấp một hàm cho saga, chính hàm này là
hàm đứng ra xem xét các action trước khi vào store, nếu là action quan
tâm thì nó sẽ thực thi hàm sẽ được thực thi, nếu bạn biết khái niệm hook
thì hàm cung cấp cho saga chính là hàm hook. Điều đặc biệt của hàm
hook này nó là một generator function, trong generator function này có
yield và mỗi khi yield ta sẽ trả về một plain object. Object trả về đó được

gọi Effect object. effect object này đơn giản chỉ là một object bình
thường nhưng chứa thông tin đặc biệt dùng để chỉ dẫn middleware của
Redux thực thi các hoạt động khác ví dụ như gọi một hàm async khác

11


hay put một action tới store. Để tạo ra effect object đề cập ở trên thì ta
gọi hàm từ thư viện của saga là redux-saga/effects.

Hình 2.2- 9: Flow của Redux-saga

2.2.6. MUI

Hình 2.2- 10: MUI

-

Là một thư viện mã nguồn mở gồm các React Component được thực hiện bởi
Google’s Material Design. Thư viện bao gồm một bộ các component được xây
dựng sẵn, dễ hiểu và có thể sử dụng ngay lập tức.

-

Component trong MUI đã được thiết kế với diện mạo đẹp đẽ. Bên cạnh đó, MUI
cịn cung cấp một bộ các tùy chỉnh để người dùng có thể dễ dàng tự tạo ra các
component theo ý của mình dựa trên khn mẫu đã có của thư viện.
2.2.7. NestJS

12

Hình 2.2-11: Nest

-

Nest (Nest JS) là framework để xây dựng các ứng dụng phía máy chủ Node.js
efficient (hiệu quả), scalable (có thể mở rộng). Nó sử dụng JavaScript lũy tiến,
được xây dựng với và hỗ trợ đầy đủ TypeScript (nhưng vẫn cho phép các nhà
phát triển mã hóa bằng JavaScript thuần túy) và kết hợp các yếu tố của OOP
(Lập trình hướng đối tượng), FP (Lập trình chức năng) và FRP (Lập trình phản
ứng chức năng).
2.2.8. MongoDB

Hình 2.2- 12: MongoDB

-

Là một nền tảng mã nguồn mở, cung cấp NoSQL document-oriented database.
MongoDB không được thiết kế dựa trên cấu trúc dữ liệu dạng bảng mà thay vào
đó cung cấp một định dạng khác để có thể lưu trữ và truy vấn dữ liệu. Định
dạng này được gọi là BSON (tương tự với JSON).

2.3. Kiến trúc hệ thống
Phần mềm được xây dựng theo kiến trúc Client – Server 3 lớp
-

Client: gửi yêu cầu, dữ liệu và kết quả từ lớp ứng dụng.

-

Server ứng dụng: thực hiện các yêu cầu xử lý dữ liệu được gửi từ phía Client.

-

Server có sở dữ liệu: lưu trữ dữ liệu cho lớp ứng dụng, cung cấp các dịch vụ cho
các máy tính và chương trình trong lớp ứng dụng. Thường sử dụng các hệ quản
trị cơ sở dữ liệu để thực hiện các dịch vụ.
13