Tải bản đầy đủ (.pdf) (57 trang)

Đồ án xây dựng mạng xã hội du lịch

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (2.04 MB, 57 trang )

ĐẠ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 ĐỒ ÁN 2

XÂY DỰNG MẠNG XÃ HỘI DU LỊCH

Lớp:

SE122.N21

Giảng viên hướng dẫn:

ThS. Trần Thị Hồng Yến

Sinh viên thực hiện:

Dương Hoài Nam - 19521868
Võ Quốc Minh - 19521857

TP. Hồ Chí Minh, tháng 07 năm 2023


ĐẠ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 ĐỒ ÁN 2



XÂY DỰNG MẠNG XÃ HỘI DU LỊCH

Lớp:

SE122.N21

Giảng viên hướng dẫn:

ThS. Trần Thị Hồng Yến

Sinh viên thực hiện:

Dương Hoài Nam - 19521868
Võ Quốc Minh - 19521857

TP. Hồ Chí Minh, tháng 07 năm 2023


LỜI CẢM ƠN
Nhóm xin gửi lời cảm ơn tới cơ Trần Thị Hồng Yến, người đã trực tiếp tận
tình hướng dẫn nhóm trong suốt q trình thực hiện đồ án. Nhóm vơ cùng biết ơn sự
tận tình chỉ dẫn của cơ trong q trình nhóm thực hiện đề tài này. Bước đầu tiếp cận
các cơng nghệ mới, nhóm cịn nhiều thiếu sót về mặt kiến thức cũng như kinh nghiệm
thực tiễn nên khơng tránh khỏi nhiều sai sót. Những nhận xét, góp ý chân tình của cơ
chính là cơ sở để nhóm có thể cải tiến và hồn thiện đề tài này một cách tốt nhất. Nếu
khơng có những lời chỉ bảo tận tình của cơ thì đồ án này của nhóm rất khó để thực
hiện.
Nhóm cũng xin cảm ơn thầy cô khoa Công nghệ phần mềm đã hỗ trợ, tạo điều
kiện cho nhóm hồn thành báo cáo này. Nhóm xin chân thành cảm ơn!

TP. Hồ Chí Minh, ngày 05 tháng 07 năm 2023
Nhóm sinh viên thực hiện
Võ Quốc Minh – Dương Hoài Nam


NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.............................., ngày ........., tháng ........., năm .........

Trần Thị Hồng Yến


ĐỀ CƯƠNG CHI TIẾT
TÊN ĐỀ TÀI: XÂY DỰNG MẠNG XÃ HỘI DU LỊCH
Cán bộ hướng dẫn: ThS. Trần Thị Hồng Yến

Thời gian thực hiện: Từ ngày 27/02/2023 đến ngày 17/06/2023
Sinh viên thực hiện:
Võ Quốc Minh - 19521857
Dương Hoài Nam - 19521868
Nội dung đề tài:
1. Lý do chọn đề tài:
Ngày nay, mạng xã hội đối với người dùng Internet như là một phần tất yếu của
cuộc sống. Mạng xã hội là một hệ thống trực tuyến kết nối mọi người thông qua các tương
tác xã hội như chia sẻ thông tin, tương tác và kết nối với nhau trên nền tảng mạng. Mạng
xã hội đã trở thành một phương tiện truyền thông quan trọng cho hàng triệu người trên
khắp thế giới để tương tác và chia sẻ thông tin với nhau.
Liên quan đến lĩnh vực du lịch, mạng xã hội du lịch có thể được sử dụng như một
cơng cụ để giúp người dùng tìm kiếm thơng tin về các địa điểm du lịch, khám phá những
kinh nghiệm và lời khuyên từ những người đã từng đến các địa điểm đó, chia sẻ hình ảnh
và video của chuyến đi và tìm kiếm đối tác du lịch để cùng nhau tham gia các hoạt động
du lịch. Mạng xã hội du lịch cũng có thể được sử dụng như một phương tiện để quảng bá
các địa điểm du lịch và thu hút khách du lịch đến các địa điểm đó. Từ đó, mạng xã hội du
lịch có thể đóng vai trị quan trọng trong việc tạo ra sự phát triển cho ngành du lịch.
Nhận thấy được nhu cầu thực tiễn và lợi ích đó, nhóm quyết định thực hiện đề tài
“XÂY DỰNG MẠNG XÃ HỘI DU LỊCH” cho môn học đồ án 2 này.
2. Mục tiêu đề tài:
Xây dựng một ứng dụng mạng xã hội về du lịch, giúp mọi người, đặt biệt là những
người có đam mê du lịch có thể kết nối với nhau, chia sẻ những hình ảnh, thước phim ý
nghĩa trong chuyến hành trình của họ.


3. Phạm vi đề tài:
• Phạm vi mơi trường: Ứng dụng được xây dựng trên mơi trường web
• Phạm vi chức năng:
-


Đăng ký, đăng nhập

-

Chia sẻ nội dung, tương tác, bình luận…

-

Tìm kiếm bạn bè, bài viết…

-

Nhắn tin, trị chuyện

-

Thơng báo

4. Đối tượng sử dụng:
Người dùng mạng xã hội, những người u thích du lịch.
5. Phương pháp thực hiện:
• Khảo sát các ứng dụng tương tự
• Tìm hiểu cơng nghệ, cơ sở lý thuyết
• Phân tích thiết kế hệ thống
• Xây dựng hệ thống
• Kiểm thử và triển khai sản phẩm
6. Cơng nghệ sử dụng:
• Front-end: ReactJS
• Back-end: NodeJS

• Database: MongoDB, Neo4j
• Cơng cụ hỗ trợ: Github, VS Code, Docker, ...
7. Kết quả mong đợi:
• Hiểu và nắm vững các cơng nghệ, cơ sở lý thuyết.
• Xây dựng được một ứng dụng hồn chỉnh, có đủ các tính năng thiết yếu.
• Ứng dụng có thể được triển khai sử dụng thực tế.

Kế hoạch thực hiện:


Công việc

Thành viên 1

Thành viên 2

(Minh)

(Nam)

Thời gian
Tuần 1

-

Khảo sát các ứng dụng tương tự

Tuần 2

-


Xác định danh sách tính năng

(06/03 –12/03)

-

Soạn đề cương chi tiết

Tuần 3

-

Tìm hiểu cơng nghệ, cơ sở lý thuyết

-

Phân tích thiết kế hệ

(27/02 – 05/03)

(13/03 –19/03)
Tuần 4

-

(27/03 –02/04)
Tuần 6
(03/04 –09/04)
Tuần 7

(10/04 –16/04)
Tuần 8
(17/04 –23/04)

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

Phân tích thiết kế hệ
thống

thống.

(20/03 –26/03)
Tuần 5

-

Thiết kế giao diện

Khởi tạo và setup source back-

Khởi tạo và setup source front-

end

end

Xây dựng API đăng nhập, đăng

Xây dựng giao diện và tính năng


ký, xác thực người dùng

đăng nhập, đăng ký

Xây dựng API tạo, chỉnh sửa và

Xây dựng giao diện và tính năng

xóa bài đăng.

tạo, chỉnh sửa và xóa bài đăng.

Xây dựng API tương tác, bình

Xây dựng giao diện và tính năng

luận

tương tác, bình luận


Tuần 9
(24/04 –30/04)

Xây dựng API tìm kiếm người

Xây dựng giao diện và tính năng

dùng, bài đăng


khám phá, tìm kiếm người dùng,
bài viết

Tuần 10
(01/05 –07/05)
Tuần 11
(08/05 –14/05)

Xây dựng API quản lý hồ sơ

Xây dựng giao diện và tính năng

người dùng

quản lý hồ sơ người dùng

Xây dựng API nhắn tin, trò

Xây dựng giao diện và tính năng

chuyện

nhắn tin, trị chuyện

Xây dựng API thơng báo

Xây dựng giao diện và tính năng

Tuần 12
(15/05 –21/05)

Tuần 13

thông báo

(22/05 –28/05)
Tuần 14

-

Fix bug

(29/05 –04/06)

-

Chỉnh sửa, tối ưu các tính năng

-

Tối ưu hóa code, hiệu xuất

Tuần 15

-

Kiểm thử tồn bộ hệ thống

(05/06 –11/06)

-


Fix bug phát sinh

Tuần 16

-

Hoàn thành tài liệu báo cáo

(12/06 –17/06)

-

Chuẩn bị slide và tiến hành báo cáo


TP. Hồ Chí Minh, ngày 21 tháng 03 năm 2023
Xác nhận của CBHD

Sinh viên

Sinh viên

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

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

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

ThS. Trần Thị Hồng Yến


Võ Quốc Minh

Dương Hoài Nam


MỤC LỤC

CHƯƠNG 1: TỔNG QUAN ĐỀ TÀI ......................................................................1
1.1

Thông tin đề tài ..............................................................................................1

1.2

Lý do chọn đề tài ...........................................................................................1

1.3

Mục tiêu .........................................................................................................2

1.4

Phạm vi ..........................................................................................................2

1.5

Phương pháp thực hiện ..................................................................................2

1.6


Công nghệ sử dụng ........................................................................................2

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT ........................................................................3
2.1

Ngơn ngữ lập trình Typescript.......................................................................3

2.2

Front end ........................................................................................................4

2.2.1
2.3

ReactJS ....................................................................................................4

Back end ........................................................................................................6

2.3.1

NodeJS ....................................................................................................6

2.3.2

ExpressJS ................................................................................................7

2.3.3

Mongoose ................................................................................................8


2.4

Database .........................................................................................................9

2.4.1

MongoDB ...............................................................................................9

2.4.2

Neo4j .....................................................................................................10

CHƯƠNG 3: PHÂN TÍCH, THIẾT KẾ HỆ THỐNG ........................................12
3.1

Phân tích u cầu .........................................................................................12

3.1.1

Yêu cầu chức năng ................................................................................12

3.1.2

Yêu cầu phi chức năng..........................................................................13


3.2

Sơ đồ use case ..............................................................................................14


3.2.1

Danh sách tác nhân ...............................................................................14

3.2.2

Danh sách use case ...............................................................................14

3.3

Đặc tả use case .............................................................................................15

3.3.1

Đăng nhập .............................................................................................15

3.3.2

Đăng ký .................................................................................................16

3.3.3

Đăng bài viết .........................................................................................17

3.3.4

Chỉnh sửa bài viết .................................................................................18

3.3.5


Xóa bài viết ...........................................................................................19

3.3.6

Tìm kiếm bài viết/ bạn bè .....................................................................19

3.3.7

Bình luận ...............................................................................................20

3.3.8

Xóa bình luận ........................................................................................21

3.3.9

Thích bài viết ........................................................................................22

3.3.10

Thích bình luận ..................................................................................23

3.3.11

Nhắn tin .............................................................................................24

3.3.12

Chỉnh sửa thông tin cá nhân ..............................................................25


3.3.13

Đổi mật khẩu .....................................................................................26

3.4

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

3.4.1

Tổ chức hệ thống ..................................................................................27

3.4.2

Tổ chức services ở back end .................................................................29

CHƯƠNG 4: XÂY DỰNG ỨNG DỤNG ..............................................................31
4.1

Trang đăng nhập ..........................................................................................31

4.1.1

Giao diện ...............................................................................................31

4.1.2

Mô tả .....................................................................................................31



4.2

Trang đăng ký ..............................................................................................32

4.2.1

Giao diện ...............................................................................................32

4.2.2

Mô tả .....................................................................................................32

4.3

Trang chủ .....................................................................................................33

4.3.1

Giao diện ...............................................................................................33

4.3.2

Mô tả .....................................................................................................33

4.4

Trang chi tiết bài viết ...................................................................................34

4.4.1


Giao diện ...............................................................................................34

4.4.2

Mô tả .....................................................................................................34

4.5

Trang nhắn tin ..............................................................................................35

4.5.1

Giao diện ...............................................................................................35

4.5.2

Mô tả .....................................................................................................35

4.6

Trang đăng bài viết ......................................................................................36

4.6.1

Giao diện ...............................................................................................36

4.6.2

Mô tả .....................................................................................................36


4.7

Trang cá nhân ..............................................................................................37

4.7.1

Giao diện ...............................................................................................37

4.7.2

Mô tả .....................................................................................................37

4.8

Trang chỉnh sửa thông tin cá nhân...............................................................38

4.8.1

Giao diện ...............................................................................................38

4.8.2

Mô tả .....................................................................................................38

4.9

Trang đổi mật khẩu ......................................................................................39

4.9.1


Giao diện ...............................................................................................39

4.9.2

Mô tả .....................................................................................................39


CHƯƠNG 5: TỔNG KẾT ......................................................................................40
5.1

Đánh giá quá trình thực hiện đồ án..............................................................40

5.2

Kết quả đồ án ...............................................................................................40

5.2.1

Ưu điểm ................................................................................................40

5.2.2

Nhược điểm...........................................................................................40

5.3

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

5.4


Phân công công việc ....................................................................................41

TÀI LIỆU THAM KHẢO ......................................................................................42


DANH MỤC HÌNH
Hình 2.1 Logo Typescript ...........................................................................................3
Hình 2.2 Logo ReactJS ...............................................................................................4
Hình 2.3 Logo NodeJS ................................................................................................6
Hình 2.4 Logo ExpressJS ............................................................................................7
Hình 2.5 Logo Mongoose ...........................................................................................8
Hình 2.6 Logo MongoDB ...........................................................................................9
Hình 2.7 Logo Neo4j.................................................................................................10
Hình 3.1 Sơ đồ use case ............................................................................................14
Hình 3.2 Sơ đồ tổ chức kiến trúc hệ thống................................................................27
Hình 3.3 Sơ đồ tổ chức services ................................................................................29
Hình 4.1 Màn hình đăng nhập ...................................................................................31
Hình 4.2 Màn hình đăng ký.......................................................................................32
Hình 4.3 Màn hình trang chủ ....................................................................................33
Hình 4.4 Màn hình chi tiết bài viết ...........................................................................34
Hình 4.5 Màn hình nhắn tin ......................................................................................35
Hình 4.6 Màn hình đăng bài viết ...............................................................................36
Hình 4.7 Màn hình trang cá nhân ..............................................................................37
Hình 4.8 Màn hình chỉnh sửa thơng tin cá nhân .......................................................38
Hình 4.9 Màn hình đổi mật khẩu ..............................................................................39


DANH MỤC BẢNG
Bảng 3.1 Danh sách tác nhân ....................................................................................14

Bảng 3.2 Danh sách use case ....................................................................................14
Bảng 3.3 Đặc tả use case đăng nhập .........................................................................15
Bảng 3.4 Đặc tả use case đăng ký .............................................................................16
Bảng 3.5 Đặc tả use case đăng bài viết .....................................................................17
Bảng 3.6 Đặc tả use case chỉnh sửa bài viết .............................................................18
Bảng 3.7 Đặc tả use case xóa bài viết .......................................................................19
Bảng 3.8 Đặc tả use case tìm kiếm bài viết/ bạn bè ..................................................19
Bảng 3.9 Đặc tả use case bình luận ...........................................................................20
Bảng 3.10 Đặc tả use case xóa bình luận ..................................................................21
Bảng 3.11 Đặc tả use case thích bài viết ...................................................................22
Bảng 3.12 Đặc tả use case thích bình luận ................................................................23
Bảng 3.13 Đặc tả use case nhắn tin ...........................................................................24
Bảng 3.14 Đặc tả use case chỉnh sửa thông tin cá nhân............................................25
Bảng 3.15 Đặc tả use case đổi mật khẩu ...................................................................26
Bảng 3.16 Mô tả tổ chức kiến trúc hệ thống .............................................................27
Bảng 3.17 Mô tả tổ chức services .............................................................................29
Bảng 5.1 Bảng phân công công việc .........................................................................41


1 CHƯƠNG 1: TỔNG QUAN ĐỀ TÀI
1.1 Thông tin đề tài
Tên đề tài: Xây dựng mạng xã hội du lịch
Tên môn học: Đồ án 2
Lớp: SE122.N21
Giảng viên hướng dẫn: ThS. Trần Thị Hồng Yến
Nhóm sinh viên thực hiện:
-

Thành viên 1:
o Họ và tên: Võ Quốc Minh

o MSSV: 19521857
o Lớp sinh hoạt: KTPM2019

-

Thành viên 2:
o Họ và tên: Dương Hoài Nam
o MSSV: 19521868
o Lớp sinh hoạt: KTPM2019

1.2 Lý do chọn đề tài
Ngày nay, mạng xã hội đối với người dùng Internet như là một phần tất yếu của
cuộc sống. Mạng xã hội là một hệ thống trực tuyến kết nối mọi người thông qua các
tương tác xã hội như chia sẻ thông tin, tương tác và kết nối với nhau trên nền tảng
mạng. Mạng xã hội đã trở thành một phương tiện truyền thông quan trọng cho hàng
triệu người trên khắp thế giới để tương tác và chia sẻ thông tin với nhau.
Liên quan đến lĩnh vực du lịch, mạng xã hội du lịch có thể được sử dụng như
một cơng cụ để giúp người dùng tìm kiếm thơng tin về các địa điểm du lịch, khám
phá những kinh nghiệm và lời khuyên từ những người đã từng đến các địa điểm đó,
chia sẻ hình ảnh và video của chuyến đi và tìm kiếm đối tác du lịch để cùng nhau
tham gia các hoạt động du lịch. Mạng xã hội du lịch cũng có thể được sử dụng như
một phương tiện để quảng bá các địa điểm du lịch và thu hút khách du lịch đến các

1


địa điểm đó. Từ đó, mạng xã hội du lịch có thể đóng vai trị quan trọng trong việc tạo
ra sự phát triển cho ngành du lịch.
Nhận thấy được nhu cầu thực tiễn và lợi ích đó, nhóm quyết định thực hiện đề
tài “XÂY DỰNG MẠNG XÃ HỘI DU LỊCH” cho môn học đồ án 2 này.

1.3 Mục tiêu
Xây dựng ứng dụng mạng xã hội du lịch trên nền tảng website giúp mọi người,
đặt biệt là những người có sở thích, đam mê du lịch cho thể chia sẻ và kết nối với
nhau.
1.4 Phạm vi
-

Phạm vi môi trường: Ứng dụng được triển khai trên môi trường web

-

Phạm vi chức năng:
o Đăng ký, đăng nhập
o Chia sẻ nội dung, tương tác, bình luận…
o Tìm kiếm bạn bè, bài viết…
o Nhắn tin, trị chuyện
o Thơng báo

1.5 Phương pháp thực hiện
-

Khảo sát các ứng dụng khác trên thị trường.

-

Lựa chọn và tìm hiểu cơng nghệ, cơ sở lý thuyết.

-

Phân tích, thiết kế hệ thống.


-

Xây dựng ứng dụng.

-

Kiểm thử và triển khai sản phẩm.

1.6 Công nghệ sử dụng
-

Front end: React/Typescript

-

Back end: Node/Typescript

-

Database: MongoDB, Neo4j

-

Công cụ khác: Github, VS Code, Docker, ...

2


2 CHƯƠNG 2: CƠ SỞ LÝ THUYẾT

2.1 Ngôn ngữ lập trình Typescript

Hình 2.1 Logo Typescript
TypeScript là một ngơn ngữ lập trình mã nguồn mở và được phát triển bởi
Microsoft. Nó mở rộng cú pháp JavaScript tiêu chuẩn và cung cấp tính năng kiểu tĩnh
tăng cường cho JavaScript, làm cho việc phát triển ứng dụng web và máy chủ trở nên
mạnh mẽ hơn và đáng tin cậy hơn.
Một trong những đặc điểm chính của TypeScript là kiểu dữ liệu tĩnh.
TypeScript cho phép khai báo kiểu dữ liệu tĩnh cho biến, tham số hàm, và giá trị trả
về của hàm. Điều này giúp phát hiện và tránh lỗi trong quá trình phát triển, tăng tính
đáng tin cậy của mã và giúp cải thiện quy trình phát triển.
TypeScript hỗ trợ các tính năng mới của ECMAScript, tiêu chuẩn JavaScript,
đồng thời cho phép người dùng sử dụng mã JavaScript hiện có trong dự án TypeScript
mà không cần viết lại. Điều này giúp tận dụng lại mã nguồn và nâng cao khả năng
tương thích ngược của TypeScript.
Với sự hỗ trợ từ cộng đồng mã nguồn mở, TypeScript có tài liệu phong phú
và được cung cấp cơng cụ hỗ trợ phát triển đa dạng. TypeScript tích hợp tốt với các
công cụ phát triển phổ biến như Visual Studio Code và có thể tích hợp vào quy trình
phát triển của các dự án lớn.
Hệ thống kiểu dữ liệu mạnh mẽ của TypeScript giúp phát hiện lỗi kiểu dữ liệu
và cung cấp gợi ý hồn thành mã thơng minh, tăng hiệu suất phát triển và giảm số

3


lượng lỗi. Đồng thời, TypeScript cung cấp các tính năng mở rộng cú pháp cho
JavaScript, như modules, interfaces, generics, decorators và nhiều tính năng khác,
làm cho việc phát triển ứng dụng trở nên linh hoạt và mạnh mẽ hơn.
2.2 Front end
2.2.1 ReactJS


Hình 2.2 Logo ReactJS
ReactJS hay react là một thư viện, được viết bằng JavaScript, dùng để xây
dựng giao diện người dùng. Tính đến thời điểm hiện tại, đã có khoảng 1300 developer
và hơn 94000 trang web đang sử dụng. ReactJS được hiểu nơm na là một thư viện,
có chứa nhiều JavaScript mã nguồn và “cha đẻ” đó chính là Facebook. Mục đích
chính đó chính là mỗi website sử dụng reactJS thì phải chạy thật mượt hoặc thật
nhanh, có khả năng mở rộng cao và đơn giản thực hiện.
Về cơ bản, các tính năng của reactJS thường xuất phát từ việc tập trung các
phần mềm riêng lẻ, cho phép các developer có chức năng phá vỡ giao diện của người
dùng từ một cách phức tạp và biến nó trở thành các phần mềm đơn giản. Hiểu đơn
giản thì các render dữ liệu khơng chỉ được thực hiện ở vị trí server mà cịn ở vị trí
client khi sử dụng reactJS.
Hiện nay, reactJS thường được dùng để thiết kế bố cục cho trang web, nhưng
hạn chế đó chính là cấu trúc khó. Thay vào đó sử dụng JSX và nhúng vào các đoạn

4


HTML và javascript, bạn sẽ thấy cú pháp dễ hiểu hơn và JSX cũng có thể tối ưu các
code khi biên soạn, vừa giúp ích cho người lập trình tiện cho việc biên dịch.1
Ưu điểm của ReactJS:
-

Reactjs cực kì hiệu quả: Reactjs tạo ra cho chính nó DOM ảo – nơi mà các
component thực sự tồn tại trên đó. Điều này sẽ giúp cải thiện hiệu suất rất
nhiều. Reactjs cũng tính tốn những thay đổi nào cần cập nhật lên DOM
và chỉ thực hiện chúng. Điều này giúp Reactjs tránh những thao tác cần
trên DOM mà nhiều chi phí.


-

Reactjs giúp việc viết các đoạn code JS dễ dàng hơn: Nó dung cú pháp đặc
biệt là JSX (Javascript mở rộng) cho phép ta trộn giữa code HTML và
Javascript. Ta có thể thêm vào các đoạn HTML vào trong hàm render mà
không cần phải nối chuỗi. Đây là đặc tính thú vị của Reactjs. Nó sẽ chuyển
đổi các đoạn HTML thành các hàm khởi tạo đối tượng HTML bằng bộ biến
đổi JSX.

-

Nó có nhiều cơng cụ phát triển: Khi bạn bắt đầu Reactjs, đừng quên cài đặt
ứng dụng mở rộng của Chrome dành cho Reactjs. Nó giúp bạn debug code
dễ dàng hơn. Sau khi bạn cài đặt ứng dụng này, bạn sẽ có cái nhìn trực tiếp
vào virtual DOM như thể bạn đang xem cây DOM thông thường.

-

Render tầng server: Một trong những vấn đề với các ứng dụng đơn trang
là tối ưu SEO và thời gian tải trang. Nếu tất cả việc xây dựng và hiển thị
trang đều thực hiện ở client, thì người dùng sẽ phải chờ cho trang được
khởi tạo và hiển thị lên. Điều này thực tế là chậm. Hoặc nếu giả sử người
dùng vơ hiệu hóa Javascript thì sao? Reactjs là một thư viện component,
nó có thể vừa render ở ngồi trình duyệt sử dụng DOM và cũng có thể
render bằng các chuỗi HTML mà server trả về.

-

Làm việc với vấn đề test giao diện: Nó cực kì dễ để viết các test case giao
diện vì virtual DOM được cài đặt hoàn toàn bằng JS.


1

TongThom. ReactJS là gì? Các kiến thức tổng quan về reactJS,
truy cập ngày 19/07/2023.

5


-

Hiệu năng cao đối với các ứng dụng có dữ liệu thay đổi liên tục, dễ dàng
cho bảo trì và sửa lỗi.

Nhược điểm của ReactJS:
-

Reactjs chỉ phục vụ cho tầng View. React chỉ là View Library nó khơng
phải là một MVC framework như những framework khác. Đây chỉ là thư
viện của Facebook giúp render ra phần view. Vì thế React sẽ khơng có
phần Model và Controller, mà phải kết hợp với các thư viện khác. React
cũng sẽ khơng có 2-way binding hay là Ajax

-

React khá nặng nếu so với các framework khác React có kích thước tương
tương với Angular (Khoảng 35KB so với 39KB của Angular). Trong khi
đó Angular là một framework hồn chỉnh.2

2.3 Back end

2.3.1 NodeJS

Hình 2.3 Logo NodeJS
NodeJS là một nền tảng được xây dựng trên “V8 Javascript engine” được viết
bằng C++ và Javascript. Nền tảng này được phát triển bởi Ryan Lienhart Dahl vào
năm 2009.
Node.js ra đời khi các developer đời đầu của JavaScript mở rộng nó từ một
thứ bạn chỉ chạy được trên trình duyệt thành một thứ bạn có thể chạy trên máy của
mình dưới dạng ứng dụng độc lập.

2

Hoang Trong Hieu. ReactJS – Ưu điểm và nhược điểm, a/p/reactjsuu-diem-va-nhuoc-diem-V3m5WzexlO7, truy cập ngày 23/07/2023.

6


Giờ đây bạn có thể làm được nhiều thứ với JavaScript hơn là chỉ tương tác với
các website. Cả trình duyệt JavaScript và Node.js đều chạy trên JavaScript runtime
V8 engine. Công cụ này lấy code JavaScript của bạn và convert nó sang mã máy
(bytecode) cho việc thực thi nhanh hơn. Mã máy là loại code thấp cấp hơn để máy
tính có thể chạy mà khơng cần biên dịch nó.3
Ưu điểm của NodeJS:
-

IO hướng sự kiện không đồng bộ, cho phép xử lý nhiều yêu cầu đồng thời.

-

Sử dụng JavaScript – một ngơn ngữ lập trình dễ học.


-

Chia sẻ cùng code ở cả phía client và server.

-

NPM (Node Package Manager) và module Node đang ngày càng phát triển
mạnh mẽ.

-

Cộng đồng hỗ trợ tích cực.

-

Cho phép stream các file có kích thước lớn.

Nhược điểm của NodeJS:
-

Khơng có khả năng mở rộng, vì vậy khơng thể tận dụng lợi thế mơ hình đa
lõi trong các phần cứng cấp server hiện nay.

-

Khó thao tác với cơ sử dữ liệu quan hệ.

-


Mỗi callback sẽ đi kèm với rất nhiều callback lồng nhau khác.

-

Cần có kiến thức tốt về JavaScript.

-

Không phù hợp với các tác vụ địi hỏi nhiều CPU.

2.3.2 ExpressJS

Hình 2.4 Logo ExpressJS

3

TopDev. Node.js thực sự là gì? truy cập ngày
23/07/2023.

7


ExpressJS là một framework lập trình web nhẹ, nhanh và linh hoạt dựa trên
Node.js. Nó cung cấp một cách tiếp cận đơn giản và linh hoạt để xây dựng ứng dụng
web và API thông qua JavaScript. Với cú pháp rõ ràng và dễ hiểu, ExpressJS giúp
người phát triển nhanh chóng làm quen và bắt đầu xây dựng ứng dụng.
Một trong những điểm đáng chú ý của ExpressJS là khái niệm middleware.
Middleware được sử dụng để xử lý yêu cầu và phản hồi trong ứng dụng. Đây là các
hàm được thực thi tuần tự và có khả năng trung gian trong xử lý các yêu cầu HTTP.
Điều này cho phép người dùng thực hiện các chức năng như xác thực, ghi log, nén

dữ liệu và nhiều hơn nữa.
ExpressJS cũng cung cấp tính năng định tuyến (routing), cho phép người dùng
xác định các tuyến (routes) để xử lý các yêu cầu tới các địa chỉ URL cụ thể trong ứng
dụng. Điều này giúp quản lý và tổ chức mã ứng dụng một cách rõ ràng và dễ dàng
mở rộng.
Với ExpressJS, người dùng có thể linh hoạt cấu hình ứng dụng theo nhu cầu
của mình. Nó cho phép xác định các cài đặt chung như cổng lắng nghe và định dạng
dữ liệu trả về, và cũng cho phép mở rộng và tích hợp với các thư viện và cơng nghệ
khác.
ExpressJS có một cộng đồng phát triển đông đảo và năng động. Cộng đồng
này cung cấp nhiều tài liệu, mã nguồn và công cụ hữu ích để hỗ trợ phát triển ứng
dụng. Sự tổ chức các sự kiện và hội thảo cũng giúp thúc đẩy trao đổi kiến thức và kỹ
năng trong cộng đồng.
2.3.3 Mongoose

Hình 2.5 Logo Mongoose

8


Mongoose là một thư viện hỗ trợ MongoDB cho Node.js. Nó cung cấp một
giao diện đơn giản và mạnh mẽ để tương tác với cơ sở dữ liệu MongoDB thông qua
JavaScript. Mongoose giúp đơn giản hóa việc xây dựng ứng dụng dựa trên MongoDB
bằng cách cung cấp các công cụ và tính năng tiện ích.
Mongoose cho phép người dùng định nghĩa mơ hình dữ liệu cho các bộ sưu
tập trong MongoDB, sử dụng cú pháp JavaScript. Điều này giúp kiểm tra kiểu dữ
liệu, xác thực và quyền truy cập dữ liệu một cách dễ dàng. Mongoose tương thích
hồn tồn với MongoDB và cung cấp cách tiếp cận trực quan cho việc truy vấn và
chỉnh sửa dữ liệu.
Với Mongoose, người dùng có thể sử dụng các phương thức như find, findOne,

count và aggregate để truy vấn dữ liệu một cách linh hoạt và tiện lợi. Thư viện này
cũng hỗ trợ middleware, cho phép xử lý các hành động trước và sau khi thực hiện các
hoạt động trên cơ sở dữ liệu. Điều này giúp thực hiện các tác vụ như xác thực, mã
hóa dữ liệu và ghi log một cách dễ dàng.
Mongoose tích hợp tính năng kiểm tra hợp lệ cho dữ liệu lưu trữ trong
MongoDB, cho phép định nghĩa các quy tắc kiểm tra hợp lệ để đảm bảo tính nhất
quán và độ tin cậy của dữ liệu.
Thư viện Mongoose cũng có một cộng đồng phát triển đơng đảo và năng động.
Cộng đồng này cung cấp tài liệu phong phú, mã nguồn và hỗ trợ, giúp người dùng
giải quyết các vấn đề phát sinh và nâng cao hiệu suất phát triển.
2.4 Database
2.4.1 MongoDB

Hình 2.6 Logo MongoDB

9


MongoDB là một hệ quản trị cơ sở dữ liệu phi quan hệ (NoSQL) phổ biến. Nó
được thiết kế để xử lý dữ liệu phi cấu trúc và cung cấp tính linh hoạt cao cho việc lưu
trữ và truy vấn dữ liệu.
Với MongoDB, bạn có thể lưu trữ dữ liệu dưới dạng tài liệu JSON (BSON) có
cấu trúc linh hoạt. Điều này cho phép bạn lưu trữ các loại dữ liệu khác nhau trong
cùng một bộ sưu tập mà không cần định nghĩa cấu trúc trước. Điều này mang lại sự
linh hoạt trong việc thay đổi cấu trúc dữ liệu và thích ứng với yêu cầu ứng dụng.
MongoDB cung cấp khả năng mở rộng và khả năng chịu tải cao. Bạn có thể
mở rộng MongoDB theo chiều ngang bằng cách chia tách dữ liệu và tạo các bản sao
(replica set). Điều này giúp MongoDB xử lý lượng dữ liệu lớn và đảm bảo tính sẵn
sàng và khả năng chịu tải cao trong các ứng dụng có yêu cầu về tải nặng.
Trong MongoDB, bạn có thể sử dụng ngơn ngữ truy vấn MongoDB (MQL)

để thực hiện các truy vấn phức tạp trên dữ liệu. MQL hỗ trợ nhiều phép toán trên dữ
liệu như tìm kiếm, sắp xếp, lọc và gộp dữ liệu. Điều này cho phép bạn truy xuất và
xử lý dữ liệu một cách linh hoạt.
MongoDB cung cấp các tính năng như indexing và caching để tăng tốc độ truy
cập dữ liệu. Nó cũng hỗ trợ các truy vấn song song và tối ưu hóa truy vấn, giúp đáp
ứng nhanh chóng trong việc xử lý dữ liệu lớn.
Với MongoDB, bạn có thể dễ dàng tích hợp cơ sở dữ liệu vào ứng dụng của
mình. MongoDB cung cấp các driver cho nhiều ngơn ngữ lập trình khác nhau, giúp
bạn tương tác với cơ sở dữ liệu một cách dễ dàng và thuận tiện.
2.4.2 Neo4j

Hình 2.7 Logo Neo4j

10


×