xây dựng WEBSITE quản lý cuộc thi ONLINE

ĐẠ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
WEBSITE QUẢN LÍ CUỘC THI ONLINE
Giảng viên hướng dẫn:
ThS. Trần Anh Dũng
Lớp: SE122.M11.PMCL
Sinh viên thực hiện:
1. Phạm Hoàng Phượng Trinh

18521537

2. Nguyễn Phạm Minh Nhật

18521196

Tp Hồ Chí Minh, ngày 29 tháng 12 năm 2021

1


LỜI CẢM ƠN
Đầu tiên, nhóm tác giả gửi lời cảm ơn chân thành đến tập thể quý thầy cô trường
Đại học Công nghệ thông tin – Đại học Quốc gia Tp Hồ Chí Minh đã giúp cho nhóm tác
giả có những kiến thức cơ bản làm nền tảng để thực hiện đề tài này.
Đặc biệt, nhóm tác giả xin gửi lời cảm ơn và lòng biết ơn sâu sắc nhất tới thầy
Trần Anh Dũng đã trực tiếp hướng dẫn tận tình, sửa chữa và đóng góp nhiều ý kiến q
báu giúp nhóm tác giả hồn thành tốt báo cáo mơn học của mình.
Trong thời gian một kỳ thực hiện đề tài, nhóm tác giả đã vận dụng những kiến

thức nền tảng đã tích lũy đồng thời kết hợp với việc học hỏi và nghiên cứu những kiến
thức mới. Từ đó, nhóm tác giả vận dụng tối đa những gì đã thu thập được để hoàn thành
một báo cáo đồ án tốt nhất. Tuy nhiên, trong q trình thực hiện, nhóm tác giả khơng
tránh khỏi những thiếu sót. Chính vì vậy, nhóm tác giả rất mong nhận được những sự góp
ý từ phía các thầy cơ nhằm hồn thiện những kiến thức mà nhóm tác giả đã học tập và là
hành trang để nhóm tác giả thực hiện tiếp các đề tài khác trong tương lai.

2


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

…………………………………………………………………………………………..
…………………………………………………………………………………………..
…………………………………………………………………………………………..
…………………………………………………………………………………………..
…………………………………………………………………………………………..
…………………………………………………………………………………………..
…………………………………………………………………………………………..

3


…………………………………………………………………………………………..
………………………………………………………………………

Mục lục

4


Chương 1. GIỚI THIỆU CHUNG
1.1. Lý do chọn đề tài
Ngày nay, khi công nghệ ngày một phát triển và thể hiện được tầm quan trọng trong đời
sống thường nhật của con người. Mọi lĩnh vực trong cuộc sống đều trở nên thuận lợi hơn
khi được ứng dụng công nghệ thông tin, giáo dục là một trong những mảng thừa hưởng
được sự tiến bộ này. Với các phương pháp học tập truyền thống, học sinh sinh viên và
ngay cả những người đi làm phải tới trường lớp tức là chúng ta cần có thời gian biểu cố
định, cụ thể cho việc học tập. Điều này đôi khi gây ra những phiền tối, bất tiện nhất
định. Thơng qua mạng internet, việc học tập trở nên đơn giản hơn rất nhiều. Chúng ta có
thể học mọi lúc, mọi nơi theo nhu cầu của bản thân mình. Trước đây việc học online khá
nhàm chán vì người dạy khơng thể tương tác một cách trực tiếp với học viên, cịn những

người học thì dễ rơi vào tình cảnh chán nản, thiếu động lực do khơng thể thi đua hay giao
tiếp nhiều được với bạn bè. Để giải quyết được vấn đề đó, nhiều cơng cụ hỗ trợ đã ra đời,
cách phổ biến nhất là tạo ra những bộ câu hỏi ngắn như một hình thức đánh giá nhanh
giúp người dạy có thể tương tác, đo lường về kiến thức hiện tại của học viên cũng như
tạo ra các cuộc cạnh tranh cho học viên.
Kết luận: Chính vì những lý do trên, nhóm em quyết định xây dựng một website giúp
quản lý các cuộc thi online hỗ trợ việc tạo, chia sẻ các câu hỏi cũng như giúp tổ chức và
tham gia cuộc thi một cách dễ dàng, nhanh chóng.

1.2. Đối tượng nghiên cứu
– Các cơng nghệ:
+ GraphQL
+ Socket.io
+ Docker
+ JavaScript
+ Node.js
+ React.js
+ MongoDB
– Đối tượng trong phạm vi đề tài hướng đến:
5


+ Học sinh, sinh viên
+ Giáo viên, các tổ chức giáo dục

1.3. Phạm vi nghiên cứu
– Ứng dụng website được xây dựng theo MERN Stack: MongoDB, Express.js, React.js,
Node.js.
– Ứng dụng sử dụng Socket.io để bảo đảm được thời gian thực tế trong các cuộc thi,
ngồi ra ứng dụng cịn sử dụng GraphQL để tăng sự linh hoạt trong truy vấn ở phía client.

1.4. Phương pháp nghiên cứu
Nhóm đã sử dụng các phương pháp nghiên cứu:
– Phương pháp đọc tài liệu.
– Phương pháp phân tích các ứng dụng tương tự hiện có.

1.5. Bố cục
Báo cáo gồm có 5 chương:
Chương 1 giới thiệu về đề tài, đề cập đến đối tượng phạm vi và phương pháp
nghiên cứu. Cuối chương 1 là phần bố cục của báo cáo.
Chương 2 trình bày các nền tảng, các cơng nghệ được sử dụng trong q trình xây
dựng và phát triển ứng dụng.
Chương 3 trình bày chi tiết quy trình xây dựng hệ thống, từ xác định và phân tích
u cầu bài tốn cho đến xây dựng CSDL, cuối cùng là xây dựng giao diện cho úng dụng.
Chương 4 kết luận, rút ra các ưu nhược điểm của ứng dụng và đề ra hướng phát
triển trong tương lai.

6


Chương 2. KIẾN THỨC NỀN TẢNG
2.1. Giới thiệu về Docker
2.1.1. Định nghĩa
Docker là một nền tảng mở dành cho các lập trình viên, quản trị hệ thống dùng để
xây dựng, vận chuyển và chạy các ứng dụng một cách dễ dàng trên nền tảng ảo hóa.
Docker đưa ra một giải pháp mới cho vấn đề ảo hóa, thay vì tạo ra các máy ảo con
chạy độc lập kiểu hypervisors (tạo phần cứng ảo và cài đặt hệ điều hành lên đó), các ứng
dụng sẽ được đóng gói lại thành các Container riêng lẻ. Các Container này chạy chung
trên nhân hệ điều hành qua LXC (Linux Containers), chia sẻ chung tài nguyên của máy
mẹ, do đó, hoạt động nhẹ và nhanh hơn các máy ảo dạng hypervisors.

2.1.2. Ưu điểm
– Tiện lợi: giúp giảm tải sự phức tạp khi cài đặt các loại công nghệ cũng như đồng bộ
các phiên bản của những cơng nghệ đó.
– Dễ dàng sử dụng: dễ dàng cho các lập trình viên, quản trị hệ thống,.. sử dụng vì
Docker sử lợi thế của container để xây dựng hoặc kiểm tra các ứng dụng một cách nhanh
chóng.
– Khả năng di động: môi trường phát triển được dựng lên bằng docker có thể chuyển từ
người này sang người khác mà khơng làm thay đổi cấu hình ở trong.

2.2. Giới thiệu về Node.js
2.2.1. Khái niệm
NodeJS là một nền tảng được xây dựng trên V8 JavaScript Engine – trình
thơng dịch thực thi mã JavaScript, giúp xây dựng các ứng dụng web một cách đơn
giản và dễ dàng mở rộng.
2.2.2. Ưu điểm
– Đặc điểm nổi bật của Node.js là nó nhận và xử lý nhiều kết nối chỉ với một singlethread. Điều này giúp hệ thống tốn ít RAM nhất và chạy nhanh nhất khi không phải tạo
thread mới cho mỗi truy vấn.

7


– JSON API Với cơ chế event-driven, non-blocking I/O(Input/Output) và mơ hình kết
hợp với JavaScript là sự lựa chọn tuyệt vời cho các dịch vụ webs làm bằng JSON.
– Ứng dụng trên 1 trang( Single page Application) Nếu chúng ta định viết 1 ứng dụng thể
hiện trên 1 trang thì Node.js rất phù hợp để làm. Với khả năng xử lý nhiều request đồng
thời thời gian phản hồi nhanh. Các ứng dụng định viết khơng muốn nó tải lại trang, gồm
rất nhiều request từ người dùng cần sự hoạt động nhanh để thể hiện sự chuyên nghiệp thì
NodeJS sẽ là sự lựa chọn.
– Shelling tools unix Node.js sẽ tận dụng tối đa Unix để hoạt động. Tức là Node.js có thể
xử lý hàng nghìn Process và trả ra 1 luồng khiến cho hiệu xuất hoạt động đạt mức tối đa

nhất và tuyệt vời nhất.
– Streamming Data (Luồng dữ liệu) Các web thông thường gửi HTTP request và nhận
phản hồi lại (Luồng dữ liệu). Giả xử sẽ cần xử lý 1 luồng giữ liệu cực lớn, Node.js sẽ xây
dựng các Proxy phân vùng các luồng dữ liệu để đảm bảo tối đa hoạt động cho các luồng
dữ liệu khác.
– Ứng dụng web thời gian thực với sự ra đời của các ứng dụng di động & HTML 5 nên
Node.js rất hiệu quả khi xây dựng những ứng dụng thời gian thực (real-time applications)
như ứng dụng chat, các dịch vụ mạng xã hội như Facebook, Twitter,…
Kết luận: Với những tính năng ưu việt của mình, Node.js vẫn, sẽ và đang là một trong
những platform phổ biến nhất ngày nay, được các lập trình viên rất ưa chuộng, và sử
dụng rộng rãi trên toàn thế giới.

2.3. Giới thiệu về Express.js
2.3.1. Khái niệm
Express.js là một framework nhỏ nhưng linh hoạt được xây dựng trên nền tảng của
Node.js. Nó cung cấp các tính năng mạnh mẽ để phát triển web hoặc mobile.
2.3.2. Ưu điểm
– Express.js hỗ trợ JavaScript. Mà JavaScript lại là một ngôn ngữ được sử dụng rộng rãi,
rất dễ học và cũng được hỗ trợ ở mọi nơi. Do đó, nếu chúng ta đã biết JavaScript thì việc
lập trình bằng Express.js sẽ thực sự dễ dàng.
– Express.js có thể giảm một nửa thời gian viết mã mà vẫn giúp chúng ta xây dựng các
ứng dụng web hiệu quả. Nó khơng chỉ giảm thời gian mà còn giảm nỗ lực cần thiết để
xây dựng các ứng dụng web với sự trợ giúp của các tính năng khác nhau của nó.
8


– Express.js là một ứng dụng web miễn phí và mã nguồn mở cung cấp nhiều tính năng
tuyệt vời.

2.4. Giới thiệu về React.js

2.4.1. Khái niệm
React là một thư viện JavaScript nhằm đơn giản hóa việc phát triển giao diện
người dùng.
Được phát triển bởi Facebook và bản release đầu tiên trên thế giới vào nằm 2013
và được sử dụng để viết ra Facebook, Instagram và được sự ủng hộ sử dụng của rất nhiều
công ty khác trên thế giới.
Mục tiêu của React chính là đơn giản để phát triển. Tất cả trạng thái đều được tập
trung tại một thời điểm, bằng cách chia giao diện người dùng thành tập hợp các thành
phần (components).
React được sử dụng để xây dựng single-page web applications.
2.4.2. Ưu điểm
– React.js 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. React.js cũng tính tốn những thay đổi nào
cần cập nhật len DOM và chỉ thực hiện chúng. Điều này giúp React.js tránh những thao
tác cần trên DOM mà nhiều chi phí.
– React.js giúp việc viết các đoạn code JavaScrip dễ dàng hơn vì nó dung cú pháp đặc
biệt là JSX (JavaScript mở rộng) cho phép chúng ta trộn giữa code HTML và JavaScript.
Chúng 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 React.js. 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.
– React.js 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 JavaScript.

2.5. Giới thiệu về MongoDB
2.5.1. Khái niệm
MongoDB là một dạng phần mềm cơ sở dữ liệu sử dụng mã nguồn mở NoSQL.
Nó có thể hỗ trợ trên nhiều nền tảng khác nhau và được thiết kế với mục đích hướng đến
9

đối tượng. MongoDB hoạt động dựa vào các khái niệm Collection và Document. Đồng
thời, nó có hiệu suất cao cùng với tính khả dụng tốt và dễ dàng mở rộng.
Các Collection trong MongoDB có cấu trúc cực kỳ linh hoạt. Điều này cho phép
dữ liệu không cần thiết phải tuân theo bất kỳ một dạng cấu trúc nào. Vì thế, MongoDB có
thể lưu trữ những dữ liệu có cấu trúc đa dạng và phức tạp. Dữ liệu trong MongoDB được
lưu bằng định dạng kiểu JSON.
2.5.2. Ưu điểm
– MongoDB sử dụng lưu trữ dưới dạng Document JSON nên mỗi một collection sẽ có
các kích cỡ và document khác nhau.
– Tuy cấu trúc của dữ liệu linh hoạt nhưng đối tượng của nó được xác định rất rõ ràng.
– Dễ dàng mở rộng.
– Phù hợp với các ứng dụng realtime.

2.6. Giới thiệu về chuỗi JSON
2.6.1. Khái niệm
JSON là chữ viết tắt của Javascript Object Notation, đây là một dạng dữ liệu tuân
theo một quy luật nhất định mà hầu hết các ngôn ngữ lập trình hiện nay đều có thể đọc
được, có thể sử dụng lưu nó vào một file, một record trong CSDL rất dễ dàng. JSON có
định dạng đơn giản, dễ dàng sử dụng và truy vấn hơn XML rất nhiều nên tính ứng dụng
của nó hiện nay rất là phổ biến.
JSON là định dạng trao đổi dữ liệu văn bản dung lượng nhẹ. Cú pháp của JSON
rất đơn giản là mỗi thơng tin dữ liệu sẽ có 2 phần đó là key và value, điều này tương ứng
trong CSDL là tên field và giá trị của nó ở một record nào đó.
2.6.2. Cấu trúc
Chuỗi JSON được bao lại bởi dấu ngoặc nhọn {}.
Các key, value của JSON bắt buộc phải đặt trong dấu nháy kép (").
Nếu có nhiều dữ liệu (nhiều cặp key => value) thì ta dùng dấu phẩy (,) để ngăn cách.
Các key của JSON nên đặt chữ cái không dấu hoặc số, dấu _ và không có khoảng trắng,
ký tự đầu tiên khơng nên đặt là số.

10


2.7. Giới thiệu về Socket.io
2.7.1. Khái niệm
Socket.io là một module trong Node.js được nhà sáng chế tạo ra và phát triển từ
năm 2010. Mục đích lớn nhất của Socket io là để tạo môi trường giao tiếp thuận lợi trên
Internet giúp trả về các giá trị thực ngay tại thời điểm giao tiếp giữa các bên với nhau
(thường là giữa server và client).
Việc giao tiếp 2 chiều giữa máy khách và máy chủ được thực hiện bởi socket io
khi và chỉ khi máy khách có module này trong trình duyệt và máy chủ cũng đã tích hợp
sẵn gói socket io. Các ứng dụng sử dụng socket io thường đòi hỏi tốc độ phản hồi ngay
lập tức. Một số ví dụ điển hình như xổ số, trực tiếp bóng đá, chat…
2.7.2. Ưu điểm
– Bảo mật cao: Socket io được xây dựng dựa trên Engine.IO. Nó sẽ khởi chạy phương
thức long-polling trước nhất để kết nối. Sau đó nó mới sử dụng các phương thức giao tiếp
tốt hơn như là Websocket. Vì được thiết lập chặt chẽ như vậy nên khi socket io xuất hiện
nó sẽ tự động tạo những kết nối bảo mật như là: proxy và cân bằng tải hoặc là tường lửa
cá nhân và phần mềm chống virus.
– Kết nối tự động tới server: trong quá trình khởi chạy bị mất kết nối giữa client và
server thì socket io sẽ tự động gắn kết nối mãi mãi cho đến khi nào server phản hồi lại.
Đây là tính năng có thể tùy chỉnh được nên bạn có quyền chọn khơng kết nối tự động đến
bất kỳ server nào mà mình muốn.
– Mã hóa nhị phân: Socket io có thể hỗ trợ mã hóa nhị phân như ArrayBuffer và Blob
trên trình duyệt hoặc là ArrayBuffer và Buffer trong Node.js.
– Cho phép tạo kênh và phòng: cho phép tạo ra mối quan hệ giữa các phần hoặc các
module riêng lẻ bằng cách tạo ra những kênh riêng biệt khác nhau. Ngoài việc tạo kênh,
Socket.io còn hỗ trợ tạo phòng cho các clients tham gia với mục đích gửi thơng báo đến
một nhóm người dùng được kết nối với 1 số thiết bị nào đó.

2.8. Giới thiệu về GraphQL
2.8.1. Khái niệm
GraphQL là một ngôn ngữ truy vấn API và runtime để thực hiện các truy vấn với
dữ liệu hiện có của bạn. Một trong những điều khiến GraphQL “nổi đình nổi đám” trong
thời gian gần đây chính là việc GraphQL chỉ cung cấp đúng những gì client cần –
11


không hơn – không kém, giúp cho việc phát triển các API của bạn dễ dàng hơn và cung
cấp các cơng cụ mạnh mẽ cho các lập trình viên.
Hiểu một cách ngắn gọn hơn: GraphQL là một bộ cú pháp mô tả cách lấy dữ liệu
của bạn. Thông thường, GraphQL sẽ được sử dụng để load data từ một server và cung
cấp cho client.
2.8.2. Ưu điểm
– GraphQL schema tự động tạo ra một nguồn đáng tin cậy trong ứng dụng GraphQL.
– Chỉ với một request, client có thể có được nhiều thông tin họ cần làm giảm thiểu số
lượng requests.
– Hỗ trợ tối đa trong việc kiểm soát và xử lý data type từ đó hạn chế sự sai lệch trong
giao tiếp giữa server và client.
– GraphQL giúp ứng dụng của bạn có thể phát triển thêm API mà khơng làm ảnh hưởng
lên các truy vấn đã có.
– GraphQL khơng yêu cầu một kiến trúc ứng dụng cụ thể mà có thể hoạt động như một
Rest API và có thể làm việc với các cơng cụ API hiện có.
– Tài liệu để học về GraphQL có sẵn và rất chi tiết, dễ dàng học, tiếp thu.

12


Chương 3. XÂY DỰNG HỆ THỐNG
3.1. Xây dựng kiến trúc hệ thống

3.1.1. Xác định yêu cầu hệ thống
Từ dữ liệu thu thập được trong q trình khảo sát, có thể xác định được ứng dụng
gồm những chức năng chính sau đây:
– Phần dành cho người dùng có tài khoản:
+ Đăng nhập.
+ Tạo/quản lý bộ câu hỏi.
+ Tìm kiếm bộ câu hỏi.
+ Thêm bộ câu hỏi vào danh sách yêu thích
+ Tham gia cuộc thi.
+ Quản lý thông tin cá nhân.
+ Tạo cuộc thi.
+ Xem thống kê kết quả cuộc thi.
– Phần dành cho người chưa có tài khoản:
+ Đăng ký.
+ Tìm kiếm bộ câu hỏi.
+ Tham gia cuộc thi.

3.1.2. Phân tích u cầu hệ thống
3.1.2.1. Phần người dùng chưa có tài khoản
– Đăng ký:
Website TooNizz cho phép người dùng đăng ký tài khoản để dễ dàng tạo, lưu trữ
và xem lại kết quả các cuộc thi.
– Tìm kiếm các bộ câu hỏi:

13


Người dùng có thể tìm kiếm các bộ câu hỏi có chủ đề hoặc nội dung liên quan đến
từ khóa tìm kiếm bằng cách nhập từ khóa vào “ơ tìm kiếm”, website sẽ trả về những bộ
câu hỏi phù hợp nhất với nhu cầu của người dùng.

– Sắp xếp các bộ câu hỏi:
Bên cạnh tìm kiếm, người dùng cũng có thể sắp xếp các bộ câu hỏi theo mốc thời
gian, độ phổ biến để cho website cho ra kết quả chính xác hơn.
– Lọc các bộ câu hỏi theo chủ đề (tag):
Tương tự như sắp xếp, người dùng cũng có thể tìm kiếm các bộ câu hỏi của một
chủ đề nhất định bằng cách lọc bộ câu hỏi theo tag để có thể khám phá nhiều hơn những
bộ câu hỏi sẵn có liên quan đến chủ đề mình u thích.
– Xem chi tiết bộ câu hỏi:
Khi người dùng click vào một bộ câu hỏi bất kỳ, hệ thống sẽ hiển thị thơng tin chi
tiết của bộ câu hỏi đó bao gồm tên bộ câu hỏi, người tạo, ngày cập nhật gần nhất, chủ đề
liên quan, tổng số lượt chơi, tổng số lượt thích và nội dung chi tiết kèm đáp án của từng
câu hỏi trong bộ.
– Tham gia cuộc thi:
Người dùng có thể tham gia cuộc thi do một người dùng khác tạo sẵn bằng cách
nhập mã code phòng thi mà người đó cung cấp.

3.1.2.2. Phần người dùng đã có tài khoản
Người dùng đã có tài khoản có thể sử dụng đầy đủ các tính năng như người dùng chưa có
tài khoản, cùng với các tính năng riêng biệt sau đây:
– Đăng nhập:
Người dùng sử dụng tài khoản đã đăng ký để đăng nhập vào website. Có 2 hình
thức đăng nhập: sử dụng email và mật khẩu đã đăng ký hoặc sử dụng tài khoản Google.
Sau khi đăng nhập, người dùng có thể sử dụng đầy đủ các chức năng của website.
– Cập nhật thông tin tài khoản:
Người dùng sau khi đăng ký tài khoản thành cơng có thể cập nhật lại thơng tin tài
khoản của mình theo mong muốn.
– Thay đổi mật khẩu

14

Người dùng sau khi đăng ký thành cơng có thể thay đổi mật khẩu bất cứ lúc nào để
đảm bảo an toàn cho tài khoản.
– Cập nhật địa chỉ email mới
Người dùng nếu có nhu cầu thay đổi email có thể tiến hành cập nhật email mới.
Khi đó hệ thống sẽ gửi một mã xác thực OTP đến email mới của khách hàng. Khách hàng
chỉ cần nhập vào đúng mã OTP đó thì email mới sẽ được hệ thống cập nhật.
– Tạo cuộc thi
Người dùng đã có tài khoản trên website có thể tạo cuộc thi từ một bộ câu hỏi, sau
đó chia sẻ mã code phịng thi cho những người chơi khác vào tham gia.
– Tạo/quản lý bộ câu hỏi
Người dùng có đã có tài khoản có thể tự tạo những bộ câu hỏi của riêng mình thay
vì chỉ sử dụng những bộ câu hỏi có sẵn trên hệ thống. Với những bộ câu hỏi tự tạo, người
dùng có toàn quyền cập nhật nội dung cũng như chỉnh sửa các cài đặt hoặc xóa bộ câu
hỏi nếu muốn. Khi tạo, người dùng có thể thêm thủ cơng nội dung của từng câu hỏi hoặc
sử dụng tính năng import từ file excel theo template được cung cấp sẵn trên hệ thống.
– Thêm bộ câu hỏi vào danh sách yêu thích
Người dùng có thể thêm bất kỳ bộ câu hỏi nào vào danh sách yêu thích để thuận
tiện sử dụng hơn cho những lần sau hoặc đơn giản cho mục đích lưu trữ.
– Xem thống kê kết quả cuộc thi
Người dùng có thể xem lại báo cáo thống kê kết quả sau cuộc thi đối với các cuộc
thi mà người đó đã tổ chức và export ra file excel nếu cần thiết.

15


3.2. Phân tích thiết kế hệ thống
3.2.1. Sơ đồ use case
3.2.1.1. Sơ đồ các use case

16


3.2.1.2. Danh sách các Actor
ST
T
1
2

Tên Actor

Ý nghĩa/Ghi chú

User có tài
khoản
User chưa
có tài khoản

Người sử dụng phần mềm đã có tài khoản
Người sử dụng phần mềm chưa có tài khoản

3.2.1.3. Mơ tả chi tiết các use case
3.2.1.3.1. Use case Đăng nhập
Tên Use case
Mơ tả
Tác nhân
Tiền điều kiện
Hậu điều kiện
Dịng sự kiện chính

Dịng sự kiện phụ

Dịng sự kiện ngoại
lệ

Đăng nhập
Người dùng đăng nhập vào website để sử dụng đầy đủ các tính
năng của website
User có tài khoản
• Người dùng có tài khoản
• Có kết nối mạng internet khi thực hiện đăng nhập
• Thơng báo người dùng đăng nhập thành cơng
• Hệ thống ghi nhận hoạt động đăng nhập
1. Người dùng truy cập vào website
2. Người dùng chọn vào nút đăng nhập
3. Người dùng nhập tài khoản, mật khẩu và nhấn nút đăng nhập
4. Hệ thống xác thực thông tin đăng nhập thành cơng và cho
phép người dùng sử dụng đầy đủ tính năng của tài khoản
1. Người dùng chọn phương thức đăng nhập bằng tài khoản
Google
2. Trang web chuyển sang màn hình đăng nhập của Google
3. Người dùng nhập tài khoản Goolge và chọn đăng nhập
4. Google xác thực thông tin đăng nhập thành công và cho phép
người dùng tiếp tục sử dung trang web
1. Hệ thống xác thực thông tin đăng nhập không thành công và
hiển thị thông báo.

3.2.1.3.2. Use case Đăng kí
Tên Use case
Mơ tả

Tác nhân
Tiền điều kiện

Đăng kí
Người dùng đăng kí tài khoản
User chưa có tài khoản
• Khơng được trùng với email đã tồn tại trong hệ thống
17


Hậu điều kiện

Dịng sự kiện chính

Dịng sự kiện phụ
Dịng sự kiện ngoại
lệ

• Email phải thực sự tồn tại
• Có kết nối mạng internet khi thực hiện đăng kí
• Thơng báo người dùng đăng kí thành cơng
• Hệ thống gửi email xác thực về email vừa được dùng để đăng
ký
1. Người dùng truy cập vào website
2. Người dùng nhấn vào nút đăng kí
3. Người dùng nhập tên, email, mật khẩu và nhấn nút đăng kí
4. Hệ thống ghi nhận thơng tin đăng kí thành cơng và hiển thị
màn hình đăng nhập
Khơng có
1. Hệ thống báo email đã tồn tại trong hệ thống

3.2.1.3.3. Use case Tạo/quản lý bộ câu hỏi
Tên Use case
Mô tả
Tác nhân
Tiền điều kiện
Hậu điều kiện
Dịng sự kiện chính

Dịng sự kiện phụ
Dòng sự kiện ngoại
lệ

Tạo và quản lý bộ câu hỏi
Người dùng có thể thực hiện quản lý các bộ câu hỏi trên
website bằng cách tìm kiếm, xem, thêm, xóa, cập nhật bộ câu
hỏi
User có tài khoản
• Người dùng đã đăng nhập vào hệ thống
• Có kết nối mạng internet khi thực hiện
Khơng có
1. Người dùng đăng nhập vào hệ thống
2. Người dùng xem được tất cả sản phẩm ở mục Bộ Câu Hỏi và
có thể thêm, xóa, sửa bộ câu hỏi
3. Đăng xuất người dùng khỏi hệ thống
Khơng có
Khơng có

3.2.1.3.4. Use case Tìm kiếm bộ câu hỏi
Tên Use case

Mơ tả
Tác nhân

Tìm kiếm bộ câu hỏi
Người dùng có thể tìm kiếm các bộ câu hỏi trên hệ thống bằng
cách nhập từ khóa tìm kiếm hoặc sử dụng bộ lọc.
User có tài khoản, User chưa có tài khoản
18


Tiền điều kiện
Hậu điều kiện
Dịng sự kiện
chính
Dịng sự kiện phụ
Dịng sự kiện
ngoại lệ

• Người dung truy cập vào Website
• Có kết nối mạng internet khi thực hiện
• Hệ thống trả về những bộ câu hỏi phù hợp với yêu cầu tìm kiếm
của người dùng
1. Người dùng truy cập vào website
2. Người dùng chọn vào thanh tìm kiếm
3. Người dùng nhập từ khóa cần tìm
4. Người dùng thấy được những bộ câu hỏi cần tìm theo từ khóa
1. Người dùng truy cập vào website
2. Người dùng sử dụng bộ lọc để tìm kiếm
3. Người dùng thấy được những sản phẩm cần tìm
Khơng có

3.2.1.3.5. Use case Tham gia cuộc thi
Tên Use case
Mơ tả
Tác nhân
Tiền điều kiện
Hậu điều kiện
Dịng sự kiện
chính
Dịng sự kiện phụ
Dòng sự kiện
ngoại lệ

Tham gia cuộc thi
Người dùng tham gia cuộc thi để trả lời các câu hỏi
User có tài khoản, User chưa có tài khoản
• Người dung truy cập vào Website
• Có kết nối mạng internet khi thực hiện
Khơng có
1. Người dùng truy cập vào website
2. Người dùng chọn vào một sản phẩm bất kỳ
Khơng có
Khơng có

3.2.1.3.6. Use case Quản lý thông tin cá nhân
Tên Use case
Mô tả
Tác nhân
Tiền điều kiện
Hậu điều kiện

Dịng sự kiện

Quản lý thơng tin cá nhân
Người dùng có thể xem, chỉnh sửa thơng tin cá nhân của tài khoản
User có tài khoản
• Người dung phải đăng nhập vào website
• Có kết nối mạng internet khi thực hiện
• Hệ thống ghi nhận và cập nhật thơng tin của người dùng ngay
lập tức
1. Người dùng chọn vào tài khoản
19


chính

Dịng sự kiện phụ
Dịng sự kiện
ngoại lệ

2. Người dùng chỉnh sửa thông tin cá nhân
3. Người dùng nhấn vào nút Cập nhập
4. Người dùng xác nhận
5. Hệ thống thông báo người dùng đã cập nhật thơng tin thành
cơng
Khơng có
Khơng có

3.2.1.3.7. Use case Tạo cuộc thi
Tên Use case
Mô tả

Tác nhân
Tiền điều kiện
Hậu điều kiện
Dịng sự kiện
chính
Dịng sự kiện phụ
Dịng sự kiện
ngoại lệ

Tạo cuộc thi
Người dùng tạo ra các cuộc thi
User có tài khoản
• Truy cập vào Website
• Có kết nối mạng internet khi thực hiện
• Hệ thống tạo ra các phịng thi với các mã phòng khác nhau
1. Người dùng truy cập vào website
2. Người dùng chọn vào bộ câu hỏi muốn tạo cuộc thi
3. Người dùng chọn chế độ thi
Không có
Khơng có

3.2.1.3.8. Use case Xem thống kê kết quả cuộc thi
Tên Use case
Mơ tả
Tác nhân
Tiền điều kiện

Hậu điều kiện
Dịng sự kiện
chính

Xem thống kê kết quả cuộc thi
Người dùng có thể xem lại thống kê của cuộc thi sau khi cuộc thi
kết thúc
User có tài khoản
• Người dùng đã đăng nhập
• Có thực hiện tổ chức các cuộc thi trước đó
• Có kết nối mạng internet khi thực hiện
Khơng có
1. Người dùng truy cập vào website
2. Người dùng chọn vào phần Báo cáo
20


Dòng sự kiện phụ
Dòng sự kiện
ngoại lệ

3. Người dùng nhấn vào phần báo cáo mà mình muốn xem
Khơng có
Khơng có

3.2.2. Sơ đồ lớp
3.2.2.1. Tổng quan sơ đồ lớp

21


3.2.2.2. Mơ tả chi tiết
3.2.2.2.1. Lớp User

STT
1
2
3
4
5
6

Tên thuộc tính
id
name
email
password
avatar
collection

Loại
string
string
string
string
string
Array<string>

Ràng buộc
Private
Private
Private
Private

Private
Private

Ý nghĩa/ghi chú
Mã người dùng
Tên người dùng
Email của người dùng
Mật khẩu của người dùng
Ảnh đại diện của người dùng
Bộ sưu tập những bộ câu hỏi
yêu thích

STT Tên phương thức Kiểu trả về
1
logIn()
bool
2
logout()
void

Ràng buộc
Public
Public

Ý nghĩa/ghi chú
Đăng nhập
Đăng xuất
22

3

editInfo()

bool

Public

Chỉnh sửa thơng tin cá nhân

3.2.2.2.2. Lớp QuestionSet

STT
1
2
3
4
5
6
7

Tên thuộc tính
id
userId
name
tag
cover
isPublic
likes

Loại
string
string
string
Array<string>
string
bool
Array<string>

Ràng
buộc
Private
Private
Private
Private
Private
Private
Private

Ý nghĩa/ghi chú
Mã bộ câu hỏi
Mã của người tạo ra bộ câu hỏi
Tên bộ câu hỏi
Chủ đề bộ câu hỏi
Ảnh bộ câu hỏi
Trạng thái bộ câu hỏi
Số lượt thích của bộ câu hỏi
23

8
STT
1
2
3

played
Tên phương thức
Create()
Update()
Delete()

int
Kiểu trả về
bool
bool
bool

Private
Ràng buộc
Public
Public
Public

Số lượt chơi của bộ câu hỏi
Ý nghĩa/ghi chú
Tạo mới bộ câu hỏi
Chỉnh sửa bộ câu hỏi
Xóa bộ câu hỏi

24


3.2.2.2.3. Lớp Question

STT
1
2
3
4

Tên thuộc tính
id
questionSetId
content
image

Loại
string
string
string
string

Ràng
buộc
Private
Private
Private
Private

Ý nghĩa/ghi chú
Mã câu hỏi
Mã bộ câu hỏi
Tên câu hỏi
Hình của câu hỏi
25