Xây dựng website học 2 toán tiếng anh cho học sinh cấp 01 bằng công nghệ mern stack

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT
THÀNH PHỐ HỒ CHÍ MINH

ĐỒ ÁN TỐT NGHIỆP
NGÀNH CƠNG NGHỆ THƠNG TIN

XÂY DỰNG WEBSITE HỌC 2TỐN &
TIẾNG ANH CHO HỌC SINH CẤP 01 BẰNG
CÔNG NGHỆ MERN STACK

GVHD: TS. NGUYỄN THÀNH SƠN
SVTH: TRẦN THỊ LIÊN
SVTH: NGUYỄN HOÀI NAM

SKL 0 0 7 1 0 1

Tp. Hồ Chí Minh, tháng 07/2020


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HỒ CHÍ MINH
KHOA CÔNG NGHỆ THÔNG TIN
BỘ MÔN HỆ THỐNG THÔNG TIN

TRẦN THỊ LIÊN – 16110376
NGUYỄN HOÀI NAM – 16110393
Đề Tài:

XÂY DỰNG WEBSITE HỌC 2TOÁN &
TIẾNG ANH CHO HỌC SINH CẤP 01
BẰNG CƠNG NGHỆ MERN STACK

KHĨA LUẬN TỐT NGHIỆP KỸ SƯ CNTT
GIÁO VIÊN HƯỚNG DẪN
TS. NGUYỄN THÀNH SƠN

KHÓA 2016 - 2020

1


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HỒ CHÍ MINH
KHOA CÔNG NGHỆ THÔNG TIN
BỘ MÔN HỆ THỐNG THÔNG TIN

TRẦN THỊ LIÊN – 16110376
NGUYỄN HOÀI NAM – 16110393
Đề Tài:

XÂY DỰNG WEBSITE HỌC TOÁN &
TIẾNG ANH CHO HỌC SINH CẤP 01
BẰNG CƠNG NGHỆ MERN STACK
KHĨA LUẬN TỐT NGHIỆP KỸ SƯ CNTT
GIÁO VIÊN HƯỚNG DẪN
TS. NGUYỄN THÀNH SƠN

KHÓA 2016 - 2020

2


ĐH SƯ PHẠM KỸ THUẬT TP.HCM CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh Phúc

KHOA CNTT

*******

*******

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN
Họ và tên Sinh viên 1 : TRẦN THỊ LIÊN.

MSSV 1: 16110376

Họ và tên Sinh viên 2 : NGUYỄN HOÀI NAM

MSSV 2: 16110393

Ngành: Công nghệ Thông tin
Tên đề tài: XÂY DỰNG WEBSITE HỌC TOÁN & TIẾNG ANH CHO HỌC SINH CẤP 01
BẰNG CÔNG NGHỆ MERN STACK
Họ và tên Giáo viên hướng dẫn: ………………………………………………..
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
2. Ưu điểm:
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………

Khuyết điểm :
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
4. Đề nghị cho bảo vệ hay không ? ……………………………………………………….
5. Đánh giá loại : ……………………………………………………………………………
6. Điểm : ……………………………………………………………………………………
Tp. Hồ Chí Minh, ngày tháng năm 2020
Giáo viên hướng dẫn
(Ký & ghi rõ họ tên)

3


ĐH SƯ PHẠM KỸ THUẬT TP.HCM CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

KHOA CNTT

Độc lập – Tự do – Hạnh Phúc

*******

*******

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN
Họ và tên Sinh viên 1 : TRẦN THỊ LIÊN.

MSSV 1: 16110376

Họ và tên Sinh viên 2 : NGUYỄN HOÀI NAM

MSSV 2: 16110393

Ngành: Công nghệ Thông tin
Tên đề tài: XÂY DỰNG WEBSITE HỌC TOÁN & TIẾNG ANH CHO HỌC SINH CẤP 01
BẰNG CÔNG NGHỆ MERN STACK
Họ và tên Giáo viên phản biện: ………………………………………………….
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
2. Ưu điểm:
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
3. Khuyết điểm :
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
4. Đề nghị cho bảo vệ hay không ? …………………………………………………………
5. Đánh giá loại : ……………………………………………………………………………
6. Điểm : ……………………………………………………………………………………
Tp. Hồ Chí Minh, ngày tháng năm 2020
Giáo viên phản biện
(Ký & ghi rõ họ tên)
4


LỜI CẢM ƠN

Q trình thực hiện khóa luận tốt nghiệp là giai đoạn quan trọng nhất
trong quãng đời mỗi sinh viên. Khóa luận tốt nghiệp là tiền đề nhằm trang bị
cho chúng em những kỹ năng nghiên cứu, những kiến thức quý báu trước khi
bước vào những công việc thực tế.
Trước hết, nhóm chúng em bao gồm Trần Thị Liên và Nguyễn Hoài
Nam xin chân thành cảm ơn quý Thầy, Cơ khoa Cơng nghệ Thơng tin đã tận
tình chỉ dạy và trang bị cho chúng em những kiến thức cần thiết trong suốt
thời gian ngồi trên ghế giảng đường, làm nền tảng cho chúng em có thể hồn
thành được khóa luận này.
Chúng em xin trân trọng cảm ơn thầy Nguyễn Thành Sơn đã tận tình
giúp đỡ, định hướng cách tư duy và cách làm việc khoa học, hiệu quả. Đó là
những góp ý hết sức q báu khơng chỉ trong q trình thực hiện khóa luận
này mà cịn là hành trang tiếp bước cho chúng em trong quá trình học tập và
lập nghiệp sau này.
Và cuối cùng, xin gửi lời cảm ơn đến gia đình, bạn bè, tập thể lớp
161101, những người luôn sẵn sàng sẻ chia và giúp đỡ trong học tập và cuộc
sống. Mong rằng, chúng ta sẽ mãi mãi gắn bó với nhau.
Xin chúc những điều tốt đẹp nhất sẽ luôn đồng hành cùng mọi người.

5


ĐẠI HỌC SƯ PHẠM KỸ THUẬT

CỘNG HÒA XÃ HỘI CHỦ NGHĨA

TPHCM

VIỆT NAM

KHOA CÔNG NGHỆ THÔNG

Độc lập – Tự do – Hạnh phúc

TIN

*********

*********
ĐỀ CƯƠNG KHÓA LUẬN TỐT NGHIỆP
Họ và tên sinh viên 1: Trần Thị Liên

MSSV: 16110376

Họ và tên sinh viên 2: Nguyễn Hồi Nam

MSSV: 16110393

Ngành: Cơng nghệ thơng tin
Tên đề tài: XÂY DỰNG WEBSITE HỌC TOÁN & TIẾNG ANH CHO HỌC
SINH CẤP 01 BẰNG CÔNG NGHỆ MERN STACK
Giáo viên hướng dẫn: ……………………………….
Nhiệm vụ khóa luận:
-

Tìm hiểu và vận dụng được cơng nghệ MernStack, bao gồm tìm hiểu và vận
dụng:
+ MongoDB
+ ExpressJS

+ ReactJS
+ NodeJS

-

Xây dựng được các chức năng cơ bản của một website học tập: xem nội dung
bài học, làm kiểm tra, trao đổi, đăng nhập, đăng xuất, …

Đề cương chi tiết:
1. Phần mở đầu
1.1. Tính cấp thiết của đề tài
1.2. Mục đích của đề tài
1.3. Cách tiếp cận và phương pháp nghiên cứu
• Đối tượng nghiên cứu
6


• Phạm vi nghiên cứu
1.4. Kết quả dự kiến đạt được
2. Phần nội dung
2.1. Chương 1: Cơ sở lí thuyết
2.1.1. Tìm hiểu MernStack
• Tìm hiểu MongoDB
• Tìm hiểu ExpressJS
• Tìm hiểu ReactJS
• Tìm hiểu NodeJS
2.2. Chương 2: Khảo sát hiện trạng và xác định yêu cầu
2.2.1. Khảo sát hiện trạng
• Khảo sát các ứng dụng liên quan
• Nhận xét ưu nhược điểm

• Nêu kết luận
2.2.2. Xác định yêu cầu
• Nhận diện tác nhân và các chức năng
• Xác định lược đồ Usecase
• Mơ tả usecase
2.3. Chương 3: Thiết kế phần mềm
2.3.1. Thiết kế hệ thống
2.3.2. Thiết kế dữ liệu
2.4. Chương 4: Thiết kế giao diện
2.4.1. Giao diện Admin
2.4.2. Giao diện người dùng
2.5. Chương 5: Cài đặt và kiểm thử
2.5.1. Cài đặt
7


• Môi trường thử nghiệm và cài đặt
2.5.2. Kiểm thử
3. Phần kết luận
3.1. Những kết quả đạt được
3.2. Ưu điểm
3.3. Hạn chế
3.4. Hướng phát triển
4. Tài liệu tham khảo
KẾ HOẠCH THỰC HIỆN

STT

THỜI GIAN

CÔNG VIỆC

PHỤ TRÁCH

GHI
CHÚ

1

03/2020

Khảo sát hiện trạng và
phân

Liên + Nam

tích yêu cầu
2

03/2020

3

15/04/2020 – Vẽ và đặc tả usecase
20/04/2020

Nam

4

15/04/2020 – Vẽ sequence diagram
20/04/2020

Nam

5

20/04/2020 – Thiết kế cơ sở dữ liệu
25/04/2020

Nam

6

7

25/04/2020 –
05/2020

Tìm hiểu MernStack

Thiết kế giao diện

05/2020 –

Xử lý đăng nhập Admin

06/2020

và

Liên + Nam

Liên + Nam

Nam

User
8

05/2020 –
06/2020

Xử lý đăng ký User

Nam

8


9

05/2020 –

Xử lý nhớ đăng nhập

06/2020

Admin

Nam

và User
10

05/2020 –

Xử lý đăng xuất User và

Nam

06/2020
Admin
05/2020 –

11

12

13

14

15

16

17

Xử lý trang chủ User

Liên

06/2020
05/2020 –

Xử lý quản lý học sinh

Nam

06/2020
05/2020 –

Xử lý quản lý câu hỏi

Nam

06/2020
05/2020 –

Xử lý quản lý đề thi

Nam

06/2020
05/2020 –

Xử lý quản lý tin tức

Liên

06/2020
05/2020 –

Xử lý quản lý nội dung

06/2020

bài học

05/2020 –

Xử lý quản lý kết quả thi

Nam

Nam

06/2020
06/2020

18

Xử lý gọi APIs cho chức
năng xem tin tức, xem

Liên

nội dung bài học, xem bài
học tiêu biểu, bài học nổi

bật

19

27/06/2020 Chỉnh sửa giao diện lần
–

Liên

cuối

01/07/2020
20

01/07/2020 Kiểm thử

Liên

–
10/07/2020

9


21

11/07/2020

Viết báo cáo

Liên

–
15/07/2020

22

16/07/2020 Quay video demo

Nam

–
19/07/2020
TP.HCM, ngày 19 tháng 07 năm 2020.

Ý kiến của giáo viên hướng dẫn

Người viết đề cương

Trần Thị Liên
TS. Nguyễn Thành Sơn

10


Mục lục
Phần 1: MỞ ĐẦU............................................................................................................................ 15
1.

Tính cấp thiết của đề tài ...................................................................................................... 15

2.

Mục đích của đề tài.............................................................................................................. 15

3.

Cách tiếp cận và phương pháp nghiên cứu......................................................................... 15

4.

Kết quả dự kiến đạt được .................................................................................................... 16

Phần 2: NỘI DUNG ........................................................................................................................ 17
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT ............................................................................................... 17
1.1.

MERNSTACK ................................................................................................................. 17

1.1.1.

MernStack là gì? ...................................................................................................... 17

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU ........................................ 21
2.1. KHẢO SÁT HIỆN TRẠNG ................................................................................................ 21
2.1.1. Tienganh123 ( ) .............................................................. 21
2.1.2.

Luyenthi123 ( ) ......................................................... 23

2.1.3.

Kết luận .................................................................................................................... 24

2.2. XÁC ĐỊNH YÊU CẦU ................................................................................................................ 24
2.2.1. Nhận diện tác nhân và các chức năng trong sơ đồ usecase........................................... 24
2.2.2. Lược đồ usecase ............................................................................................................. 25
2.2.3. Mô tả usecase ................................................................................................................. 25
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM ......................................................................................... 29
3.1.

THIẾT KẾ HỆ THỐNG.................................................................................................. 29
THIẾT KẾ DỮ LIỆU .................................................................................................. 32

3.2.
3.2.1.

Mơ hình ERD ........................................................................................................... 32

3.2.2.

Mơ hình cơ sở dữ liệu............................................................................................... 33

CHƯƠNG 4: THIẾT KẾ GIAO DIỆN .......................................................................................... 43
4.1.

THIẾT KẾ GIAO DIỆN ADMIN ................................................................................... 43

4.1.1.

Giao diện màn hình đăng nhập................................................................................ 43

4.1.2.

Giao diện màn hình trang chủ Admin ..................................................................... 44

4.1.3.

Giao diện quản lý ..................................................................................................... 45

4.1.4.

Giao diện thêm ......................................................................................................... 46

4.1.5.

Giao diện sửa............................................................................................................ 48

4.1.6.

Giao diện xóa............................................................................................................ 49

4.2.

THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG ....................................................................... 50

4.2.1.

Giao diện màn hình chính ........................................................................................ 50

4.2.2.

Giao diện nội dung bài học ...................................................................................... 53
11


4.2.3.

Giao diện kiểm tra................................................................................................... 54

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ ....................................................................................... 57
5.1. CÀI ĐẶT............................................................................................................................... 57
5.1.1.

Hướng dẫn tạo project ............................................................................................. 57

5.1.2.

Tạo project react js .................................................................................................. 58

5.2.

KIỂM THỬ ...................................................................................................................... 59

PHẨN KẾT LUẬN ......................................................................................................................... 62
1.

Những kết quả đạt được...................................................................................................... 62

2.

Hạn chế ................................................................................................................................ 62

3.

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

TÀI LIỆU THAM KHẢO .............................................................................................................. 64
HƯỚNG DẪN SỬ DỤNG ............................................................................................................... 65

12


DANH MỤC BẢNG BIỂU
Bảng 1Nhận diện tác nhân và các chức năng trong sơ đồ usecase ................................................ 24
Bảng 2 Usecase đăng nhập .............................................................................................................. 25
Bảng 3 Usecase đăng ký .................................................................................................................. 26
Bảng 4 Usecase đăng xuất ............................................................................................................... 27
Bảng 5 Usecase thêm câu hỏi .......................................................................................................... 27
Bảng 6 Usecase sửa câu hỏi............................................................................................................. 27
Bảng 7 Usecase xóa câu hỏi............................................................................................................. 28
Bảng 8 ExamContentSchema ......................................................................................................... 34
Bảng 9 ExamSchema ...................................................................................................................... 35
Bảng 10 LessionContentSchema..................................................................................................... 35
Bảng 11 MemberSchema ................................................................................................................ 36
Bảng 12 NewsSchema ..................................................................................................................... 37
Bảng 13 QuestionsSchema .............................................................................................................. 38
Bảng 14 ResultSchema .................................................................................................................... 39
Bảng 15 GameSchema .................................................................................................................... 41
Bảng 16 ForumSchema ................................................................................................................... 42

Bảng 17 . Danh sách xử lý đăng nhập ............................................................................................ 43
Bảng 18 Danh sách xử lý giao diện trang chủ Admin .................................................................... 44
Bảng 19 Danh sách xử lý chức năng quản lý câu hỏi ..................................................................... 46
Bảng 20 Danh sách xử lý Thêm câu hỏi ......................................................................................... 47
Bảng 21 Danh sách xử lý Sửa câu hỏi............................................................................................. 48
Bảng 22 Danh sách xử lý Xóa câu hỏi ............................................................................................ 49
Bảng 23 Danh sách xử lý giao diện chính của người dùng............................................................. 51
Bảng 24 Danh sách xử lý nội dung bài học..................................................................................... 54
Bảng 25 Danh sách xử lý chức năng kiểm tra ................................................................................ 56
Bảng 26 Kiểm thử ........................................................................................................................... 59

13


DANH MỤC HÌNH ẢNH
Hình 1 Giao diện website tienganh123 ........................................................................................... 21
Hình 2 Giao diện website Luyenthi123........................................................................................... 23
Hình 3 Lược đồ Usecase.................................................................................................................. 25
Hình 4 Sơ đồ sequence diagram đăng nhập ................................................................................... 29
Hình 5 Sơ đồ sequence diagram đăng ký ....................................................................................... 29
Hình 6 Sơ đồ sequence diagram đăng xuất .................................................................................... 30
Hình 7 Sơ đồ sequence diagram thêm câu hỏi ............................................................................... 30
Hình 8 Sơ đồ sequence diagram sửa câu hỏi .................................................................................. 31
Hình 9 Sơ đồ sequence diagram xóa câu hỏi .................................................................................. 31
Hình 10 Mơ hình ERD .................................................................................................................... 32
Hình 11 Giao diện đăng nhập Admin ............................................................................................. 43
Hình 12 Giao diện trang chủ Admin .............................................................................................. 44
Hình 13 Giao diện quản lý câu hỏi ................................................................................................. 45
Hình 14 Giao diện thêm câu hỏi ..................................................................................................... 46
Hình 15 Giao diện sửa câu hỏi ........................................................................................................ 48

Hình 16 Giao diện xóa câu hỏi ........................................................................................................ 49
Hình 17 Giao diện chính của người dùng ....................................................................................... 50
Hình 18 Giao diện chính của người dùng (tt) ................................................................................. 50
Hình 19 Giao diện chính của người dùng (tt) ................................................................................. 51
Hình 20 Giao diện nội dung bài học ............................................................................................... 53
Hình 21 Giao diện nội dung bài học (tt) ......................................................................................... 53
Hình 22 Giao diện kiểm tra ............................................................................................................ 54
Hình 23 Giao diện kiểm tra (tt) ...................................................................................................... 55
Hình 24 Đăng nhập trang Admin ................................................................................................... 65
Hình 25 Thực hiện chức năng thêm - xóa - sửa.............................................................................. 66

14


Phần 1: MỞ ĐẦU
1. Tính cấp thiết của đề tài
Trong cuộc sống tất bật hiện nay, mọi việc đều được đơn giản và tối
ưu hóa thời gian thơng qua việc ứng dụng công nghệ thông tin vào xử lý các
công việc hàng ngày. Theo thời gian, ngày càng có nhiều công nghệ mới thuộc
lĩnh vực công nghệ thông tin ra đời, và việc cập nhật, tiếp thu công nghệ mới
để tối ưu công việc là đều cấp thiết nếu không muốn bị tuột hậu so với lượng
kiến thức khổng lồ của ngành.
Bên cạnh cơng nghệ phát triển thì nhu cầu học tập online của học sinh,
sinh viên cũng ngày càng gia tăng. Các Website học tập lần lượt mọc lên như
nấm, nhưng thực tế rằng, các Website học tập được tạo nên đa số đều hướng
về các đối tượng là người lớn, học sinh cấp 02, cấp 03, sinh viên,… Nhưng
đối với thực tế hiện nay, các em cấp 01 cũng đang có nhu cầu học tập thêm
rất nhiều, và các em cũng đã được tiếp cận công nghệ từ rất sớm.
Chính vì thế mà nhóm đã chọn đề tài “Xây dựng Website học toán &
tiếng anh cho học sinh cấp 01 bằng công nghệ Mern Stack”, nhằm để học hỏi

công nghệ mới đang rất được ưa chuộng là MernStack để có thể nâng cao kiến
thức chuyên ngành và ứng dụng chúng vào thực tiễn khi ra trường, đồng thời
cung cấp cho các em học sinh cấp 01 một nơi để học tập, rèn luyện thêm kiến
thức.
2. Mục đích của đề tài
Đề tài ra đời với mục đích giúp sinh viên tổng hợp lại các kiến thức đã
tiếp thu được trong q trình học, đồng thời có cái nhìn tổng quan về lập trình.
Là cơ hội để sinh viên tìm hiểu các công nghệ mới nhất và ứng dụng
chúng vào thưc tiễn.
Xây dựng website giáo dục dành cho trẻ em, tạo sân chơi mới cho trẻ
em phát triển, học hỏi.
3. Cách tiếp cận và phương pháp nghiên cứu
• Đối tượng nghiên cứu:
-

Tìm hiểu MernStack: định nghĩa MernStack và các thành phần.
15


• Phạm vi nghiên cứu: Với bài luận văn này, nhóm em sẽ tập trung tìm
hiểu và thực hiện các nội dung sau:
-

Tìm hiểu các nội dung, kiến thức về MernStack

-

Sau khi tìm hiểu, nhóm sẽ tập trung vận dụng những kiến thức đã
tìm hiểu để xây dựng website học tập toán và tiếng anh cho học sinh
cấp 01.

4. Kết quả dự kiến đạt được
• Hiểu rõ kiến thức về MernStack: định nghĩa và các thành phần.
• Xây dựng thành cơng website học tập tốn và tiếng anh cho học sinh
cấp 01

16


Phần 2: NỘI DUNG
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1.

MERNSTACK

1.1.1. MernStack là gì?

Mern Stack là bộ combo open source các cơng nghệ liên quan đến
JavaScript: MongoDB, ExpressJS, React/React Native, NodeJS.
Mern: là viết tắt của 04 công cụ: M – MongoDB, E – ExpressJS, R –
ReactJS, N – NodeJS.
Stack: một chương trình hồn thiện khơng chỉ có code, mà cịn phải có
nền tảng hệ điều hành và những phần mềm đi kèm (web server, cơ sở dữ liệu).
Người ta gom những thứ này lại với nhau tạo thành technical stack.
❖ MongoDB:
▪ MongoDB là một cơ sở dữ liệu mã nguồn mở và là cơ sở
dữ liệu NoSQL hàng đầu, được hàng triệu người sử dụng.
MongoDB được viết bằng C++.
▪ Ngoài ra, MongoDB là một cơ sở dữ liệu đa nền tảng, hoạt
động trên các khái niệm Collection và Document, nó cung

cấp hiệu suất cao, tính khả dụng cao và khả năng mở rộng
dễ dàng.
▪ Một số thuật ngữ thường gặp trong MongoDB:
o Database: là một Ô chứa dữ liệu ở mức vật lý
(physical), mỗi database sẽ có nhiều collection và
được thiết lập lưu trữ ở một nơi trong máy chủ máy
tính. Một máy chủ MongoDB thường có thể tạo nhiều
cơ sở dữ liệu.
o Collection: là nhóm các tài liệu (document), nó tương
đương với một bảng (table) trong CSDL thông
thường nên mỗi collection sẽ thuộc về một database
17


duy nhất. Tuy nhiên nó có một sực khác biệt đó là nó
khơng có ràng buộc Relationship như các hệ quản trị
CSDL khác nên việc truy xuất rất nhanh, chính vì thế
mỗi collection có thể chứa nhiều thể loại khác nhau
không giống như table trong hệ quản trị mysql là các
field cố định.
o Document: có cấu trúc tương tự như kiểu dữ liệu
JSON, nghĩa là sẽ có các cặp (key => giá trị) nên nó
có tính năng động rất lớn. Document ta có thể hiểu nó
giống như các record dữ liệu trong MYSQL, tuy
nhiên nó có sự khác biệt là các cặp (key => value) có
thể khơng giống nhau ở mỗi document.
❖ ExpressJS:
▪ Express.js là một trong những framework phổ biến nhất
trong Node.js, nó là một framework đơn giản nhưng đủ
mạnh để giúp chúng ta tiếp cận cũng như phát triển website

dựa trên framwork này.
▪ Xây dựng trên nền tảng của Nodejs. Nó cung cấp các tính
năng mạnh mẽ để phát triển web hoặc mobile.
▪ Router là một Object (khác với Routing), nó là một
instance riêng của middleware và routes. Chính vì nó là
một instance của middleware và route nên nó có các chức
năng của cả hai. Chúng ta có thể gọi nó là một miniapplication.
▪ Các Application dùng ExpressJS làm core đều có phần
Router được tích hợp sẵn trong đó.
▪ Router hoạt động như một middleware nên chúng ta có thể
dùng nó như một arguments. Hoặc dùng nó như một
arguments cho route khác.
18


❖ ReactJS:
▪

Hiện nay các Web Dev đang nổi lên mô hình web singlepage. Web single-page là tất cả các thao tác xử lý của trang
web đều được diễn ra trên cùng một trang. Việc này giúp
nâng cao trải nghiệm người dùng, các thao tác xử lý của
người dùng và animation,... đều được thực hiện một cách
nhanh chóng và mượt mà. So với web single-page thì các
web cũ xử lý dữ liệu khá lâu do phải phụ thuộc khá nhiều
vào khả năng xử lý của server nên thường xuyên load trang
mới hay nhưng trang nhiều logic sẽ khiến một số chức năng
không được như ý muốn và dễ sinh ra Bug làm giảm trải
nghiệm người dùng. Từ đó web single-page ra đời và các
ngôn ngữ phát triển single-page ngày càng phát triển.
Trong số đó ReactJS đang là một thư viện mạnh nhất về

phát triển single-page hiện nay.

▪ React.JS là một thư viện Javascript dùng để xây dựng giao
diện người dùng do FaceBook tạo ra.
▪ Cho phép những nhà phát triển web tạo ra giao diện người
dung nhanh chóng. Phần Views của Reactjs thường được
hiển thị bằng việc chủ yếu dung các component mà chứa
các component cụ thể hoặc các thẻ HTML.
❖ NodeJS:
▪ NodeJS là một hệ thống phần mềm được thiết kế để viết các
ứng dụng internet có khả năng mở rộng, đặc biệt là máy chủ
web. Chương trình được viết bằng JavaScript, sử dụng kỹ
thuật điều khiển theo sự kiện, nhập/ xuất khơng đồng bộ để
tối thiểu tổng chi phí và tối đa khả năng mở rộng. NodeJS
bao gồm có V8 JavaScript Engine của Google, libUV và
vài thư viện khác NodeJS.
19


▪ NodeJS có thể chạy trên nhiều nền tảng hệ điều hành khác
nhau từ Window cho tới Linux, OSX nên đó cũng là một
lợi thế. NodeJS cung cấp các thư viện phong phú ở dạng
JavaScript Module khác nhau giúp đơn giản hóa việc lập
trình và giảm thời gian ở mức thấp nhất. NodeJS được xây
dựng và chạy trên V8 Engine. V8 Engine dựa trên C++. Vì
vậy, cuối cùng trái tim của NodeJS chính là C++.
▪ Ý tưởng chính của NodeJS là sử dụng non – blocking,
hướng sự vào ra dữ liệu thông qua các tác vụ thời gian thực
một cách nhanh chóng. Bởi vì NodeJS có khả năng mở
rộng nhanh chóng, khả năng xử lý một số lượng lớn các

kết nối đồng thời bằng thông lượng cao. Nếu như các ứng
dụng web truyền thống, các request tajora một luồng xử lý
yêu cầu mới và chiếm RAM của hệ thống thì việc tài
nguyên của hệ thống sẽ được sử dụng không hiệu quả.
Chính vì lẽ đó giải pháp mà NodeJS đưa ra là sử dụng
luồng đơn (Single – Threaded), kết hợp với non – blocking
I/O để thực thi các request, cho phép hỗ trợ hang chục ngàn
kết nối đồng thời.

20


CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU
2.1. KHẢO SÁT HIỆN TRẠNG
2.1.1. Tienganh123 ( )
❖ Các giao diện chính

Hình 1 Giao diện website tienganh123

❖ Những tính năng chính
• Đăng nhập, đăng ký
• Đăng nhập qua facebook, gmail, yahoo
• Học tập theo nội dung từng lớp
• Học tập qua video
• Học tập qua trị chơi
• Rèn luyện kỹ năng
21


• Làm kiểm tra

• Thi đấu
❖ Ưu điểm
• Giao diện dễ thương
• Đảm bảo đầy đủ chức năng cơ bản của một website học tập
• Nhiều chức năng sáng tạo hỗ trợ việc học tập khơng nhàm chán
• Dễ sử dụng
❖ Khuyết điểm
• Giao diện dàn trãi khơng làm nổi bật được chức năng chính của
website

22


2.1.2. Luyenthi123 ( )
❖ Các giao diện chính

Hình 2 Giao diện website Luyenthi123

❖ Những tính năng chính
• Đăng nhập, đăng ký
• Học tập theo lớp
• Làm kiểm tra
• Thi đấu
• Diễn đàn trao đổi
23


❖ Ưu điểm
• Đảm bảo đầy đủ chức năng cơ bản của một website học tập
• Giao diện đơn giản, dễ nhìn

❖ Khuyết điểm
• Diễn đàn trao đổi những vấn đề không liên quan học tập, câu
từ không phù hợp
2.1.3. Kết luận
Thơng qua những trang web đã khảo sát, có thể rút ra các chức năng cần
thiết phải có của một website học tập. Bên cạnh đó, những ưu điểm và hạn chế
của các trang web đã khảo sát cũng giúp nhóm rút ra những lưu ý cần thiết để
có thể áp dụng vào website của mình một cách hồn thiện hơn.
2.2. XÁC ĐỊNH YÊU CẦU
2.2.1. Nhận diện tác nhân và các chức năng trong sơ đồ usecase
Bảng 1Nhận diện tác nhân và các chức năng trong sơ đồ usecase

Tác nhân

Chức năng

Người dùng

Đăng ký tài khoản.
Đăng nhập / Đăng xuất ( với tài khoản đã đăng ký)
Học tập
Kiểm tra
Xem tin tức giáo dục

Người quản lý

Thêm, xóa, sửa user
Thêm, xóa, sửa câu hỏi
Thêm, xóa, sửa đề thi
Thêm, xóa, sửa tin tức

Thêm, xóa, sửa nội dung bài học
Thêm, xóa, sửa kết quả thi
Đăng nhập, đăng xuất

24