Đồ án xây dựng website học lập trình

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

NGUYỄN TRUNG HIẾU - 19521508
NGUYỄN TIẾN DŨNG - 19521398

BÁO CÁO ĐỒ ÁN 2

XÂY DỰNG WEBSITE HỌC LẬP TRÌNH
Building a website to learn programming
GIẢNG VIÊN HƯỚNG DẪN
THS. HUỲNH TUẤN ANH

TP. HỒ CHÍ MINH, 2022


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

NGUYỄN TRUNG HIẾU - 19521508
NGUYỄN TIẾN DŨNG - 19521398

BÁO CÁO ĐỒ ÁN 2

XÂY DỰNG WEBSITE HỌC LẬP TRÌNH
Building a website to learn programming
GIẢNG VIÊN HƯỚNG DẪN
THS. HUỲNH TUẤN ANH

TP. HỒ CHÍ MINH, 2022


LỜI CẢM ƠN
Sau quá trình học tập và rèn luyện tại khoa Công nghệ Phần mềm trường Đại học
Công nghệ Thông tin – ĐHQG TP.HCM, chúng em đã được trang bị những kiến thức
và những kỹ năng cơ bản để có thể hồn thành các đồ án mơn học.
Đồ án 2 là môn học mang lại cho sinh viên cái nhìn mới trong việc áp dụng những
kiến thức đã có để giải quyết các vấn đề thực tế. Môn học cũng như là một thử thách
và cơ hội để sinh viên có thể rèn luyện và hồn thiện bản thân qua những kinh
nghiệm, kỹ năng khi làm đồ án.
Chúng em xin gửi lời cảm ơn đến thầy HUỲNH TUẤN ANH đã tận tình quan tâm,
giúp đỡ và hướng dẫn nhóm trong suốt quá trình làm đồ án. Qua những lời góp ý, chỉ
bảo của thầy mà nhóm có thể hồn thành đồ án tốt hơn.
Nhóm cũng xin cảm ơn tất cả các thầy cô, anh chị, bạn bè đã giúp đỡ, hỗ trợ trong
suốt q trình nhóm hồn thành đồ án.
Trong q trình học tập và hồn thiện đồ án cịn gặp nhiều sai sót, chúng em mong
nhận được sự góp ý của q thầy cơ và các bạn để có thể hồn thiện hơn.
Chúng em xin chân thành cảm ơn!

TP. HCM, ngày 25 tháng 12 năm 2022
Sinh viên thực hiện

Sinh viên thực hiện

NGUYỄN TIẾN DŨNG

NGUYỄN TRUNG HIẾU

MỤC LỤC
CHƯƠNG 1: GIỚI THIỆU CHUNG

1

1.

Đề tài

1

2.

Lý do chọn đề tài

1

3.

Đối tượng nghiên cứu

1

4.

Phạm vi nghiên cứu

2

5.

Phương pháp nghiên cứu

2

CHƯƠNG 2: TÌM HIỂU CÁC CƠNG NGHỆ ỨNG DỤNG TRONG ĐỀ TÀI

3

1.

Tổng quan về JavaScript

3

2.

Tổng quan về ReactJs

5

3.

Tổng quan về NodeJs

6

4.

Tổng quan về ExpressJs

8

5.

Tổng quan về MySQL

9

CHƯƠNG 3: XÂY DỰNG HỆ THỐNG
1.

Mơ hình use-case

10
10

1.1.

Sơ đồ Use-case

10

1.2.

Danh sách Actor

10

1.3.

Danh sách Use-case

11

1.4.

Đặc tả Use-case

12

1.4.1.

Đăng nhập

12

1.4.2.

Đăng xuất

13

1.4.3.

Xem thông tin cá nhân

14

1.4.4.

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

15

1.4.5.

Xem thơng tin các khóa học

15

1.4.6.

Xem chi tiết khóa học

16


2.

3.

1.4.7.

Tham gia khóa học

17

1.4.8.

Chọn/ điều chỉnh bài giảng

18

1.4.9.

Xem các khóa học của bản thân

19

1.4.10.

Xem các Blog

19

1.4.11.

Xem chi tiết blog

20

Thiết kế dữ liệu

22

2.1.

Sơ đồ lớp

22

2.2.

Mô tả bảng

22

2.3.

Chi tiết các bảng

23

Thiết kế giao diện

CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN

27
44

1.

Thành quả đạt được

44

2.

Ưu điểm và nhược điểm

44

2.1.

Ưu điểm

44

2.2.

Nhược điểm

44


CHƯƠNG 1: GIỚI THIỆU CHUNG
1.

Đề tài
-

Tên đề tài: Xây dựng hệ thống web học lập trình

-

Cơng nghệ sử dụng:

2.

-

Front-end:

-

Back-end:

Cơ sở dữ liệu: MySQL
Lý do chọn đề tài
Công nghệ thông tin đang là một trong những ngành hot và được giới trẻ quan
tâm rất nhiều, kéo theo đó là nhu cầu học công nghệ thông tin ngày càng cao.
Các bạn học sinh và người trái ngành học công nghệ thông tin rất nhiều, nhưng
vì vấn đề về chi phí, về nguồn tài liệu học tập được cung cấp một cách đầy đủ
và tồn diện thì rất khó.Hiểu được nỗi đau này, là một trong những sinh viên
học công nghệ thông tin, chúng em đã quyết định xây dựng một trang web học
lập trình thơng qua những video và bài tập lí thuyết theo hình thức trắc nghiệm,
thực hành theo hình thức coding để đem đến nguồn tài nguyên học tập bổ ích
cho mọi người.

3.

Đối tượng nghiên cứu

● Người làm đề tài:
○ Sinh viên đang học tập và nghiên cứu tại trường Đại học Cơng nghệ
Thơng tin – ĐHQG Tp. Hồ Chí Minh.
● Công nghệ, công cụ phát triển:
○ Visual Studio Code
○ Rest API

○ MySQL
● Thiết kế giao diện:
○ Phác thảo và thiết kế giao diện sử dụng công cụ Figma

SE122.N11.PMCL

Trang 1


● Đối tượng trong phạm vi đề tài hướng đến:
○ Sinh viên, học sinh có nhu cầu học lập trình
○ Những doanh nghiệp phân phối hàng hóa trong và ngồi nước.
○ Người tiêu dùng trong nước và (có thể) ngồi nước.
4.

Phạm vi nghiên cứu

● Website được nhóm xây dựng và phát triển bằng ReactJs, NodeJs trên mơi
trường web.
● Tìm hiểu ReactJs, NodeJs để áp dụng vào phần mềm hỗ trợ người dùng có cái
nhìn tổng quan về sản phẩm trước khi lựa chọn mua hàng.
5.

Phương pháp nghiên cứu

● Cách tiếp cận: Website được xây dựng dựa trên mơ hình MVC trên môi trường
đa nền tảng.
● 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 website hiện nay đã xây dựng bằng cách sử

dụng ReactJs,NodeJs (SERN stack).
○ Phương pháp thực nghiệm.

SE122.N11.PMCL

Trang 2


CHƯƠNG 2: TÌM HIỂU CÁC CƠNG NGHỆ ỨNG DỤNG TRONG ĐỀ
TÀI
1.

Tổng quan về JavaScript
1.1.

Tổng quan
JavaScript là ngơn ngữ lập trình website phổ biến hiện nay, nó được tích

hợp và nhúng vào HTML giúp website trở nên sống động hơn. JavaScript đóng
vai trị như là một phần của trang web, thực thi cho phép Client-side script từ
phía người dùng cũng như phía máy chủ (Nodejs) tạo ra các trang web động.
JavaScript là một ngơn ngữ lập trình thơng dịch với khả năng hướng đến đối
tượng. Là một trong 3 ngôn ngữ chính trong lập trình web và có mối liên hệ lẫn
nhau để xây dựng một website sống động, chuyên nghiệp:
HTML: Hỗ trợ trong việc xây dựng layout, thêm nội dung dễ dàng trên
website.
CSS: Hỗ trợ việc định dạng thiết kế, bố cục, style, màu sắc,…
JavaScript: Tạo nên những nội dung “động” trên website. Cùng tìm hiểu rõ
hơn ở phần dưới đây.
JS là viết tắt của JavaScript, khi có JS bạn sẽ hiểu đó đang nói đến

JavaScript. Nhiệm vụ của Javascript là xử lý những đối tượng HTML trên trình
duyệt. Nó có thể can thiệp với các hành động như thêm / xóa / sửa các thuộc
tính CSS và các thẻ HTML một cách dễ dàng. Hay nói cách khác, Javascript là
một ngơn ngữ lập trình trên trình duyệt ở phía client. Tuy nhiên, hiện nay với
sự xuất hiện của NodeJS đã giúp cho Javascript có thể làm việc ở backend.
Bạn thử truy cập vào một số website trên internet thì sẽ thấy có những
hiệu ứng slide, menu xổ xuống, các hình ảnh chạy qua chạy lại rất đẹp. tất cả
các chức năng này đều được xử lý bằng Javascript đấy các bạn ạ.
Trong những năm gần đây, sự xuất hiện của các framework như NodeJS
(chuyên code backend), ExpressJS (NodeJS framework), và nhiều thư viện

SE122.N11.PMCL

Trang 3


frontend khác như Angular, jQuery, ReactJS ra đời, giúp tạo ra một cơn sốt với
từ khóa Javascript Fullstack.

1.2.

Ưu điểm

Một số ưu điểm nổi bật của ngơn ngữ lập trình JS như sau:
● Chương trình rất dễ học.
● Những lỗi Javascript rất dễ để phát hiện, từ đó giúp bạn sửa lỗi một cách
nhanh chóng hơn.
● Những trình duyệt web có thể dịch thông qua HTML mà không cần sử
dụng đến một compiler.
● JS có thể hoạt động ở trên nhiều nền tảng và các trình duyệt web khác nhau.

● Được các chuyên gia đánh giá là một loại ngôn ngữ lập trình nhẹ và nhanh
hơn nhiều so với các ngơn ngữ lập trình khác.
● JS cịn có thể được gắn trên một số các element hoặc những events của các
trang web.
● Những website có sử dụng JS thì chúng sẽ giúp cho trang web đó có sự
tương tác cũng như tăng thêm nhiều trải nghiệm mới cho người dùng.
● Người dùng cũng có thể tận dụng JS với mục đích là để kiểm tra những
input thay vì cách kiểm tra thủ công thông qua hoạt động truy xuất
database.
● Giao diện của ứng dụng phong phú với nhiều thành phần như Drag and
Drop, Slider để cung cấp đến cho người dùng một Rich Interface (giao diện
giàu tính năng).
● Giúp thao tác với người dùng phía Client và tách biệt giữa các Client với
nhau.

1.3.

Nhược điểm

Bên cạnh những ưu điểm kể trên thì JS vẫn có những nhược điểm riêng tương
tự như các ngơn ngữ lập trình khác hiện nay. Cụ thể:
● JS Code Snippet khá lớn.
● JS dễ bị các hacker và scammer khai thác hơn.

SE122.N11.PMCL

Trang 4


● JS cũng khơng có khả năng đa luồng hoặc đa dạng xử lý.

● Có thể được dùng để thực thi những mã độc ở trên máy tính của người sử
dụng.
● Những thiết bị khác nhau có thể sẽ thực hiện JS khác nhau, từ đó dẫn đến
sự khơng đồng nhất.
● Vì tính bảo mật và an tồn nên các Client-Side Javascript sẽ không cho
phép đọc hoặc ghi các file.
● JS không được hỗ trợ khi bạn sử dụng ở trong tình trạng thiết bị được kết
nối mạng.

2.

Tổng quan về ReactJs
2.1.

Tổng quan
ReactJS là một thư viện JavaScript mã nguồn mở được phát triển bởi

Facebook, ra mắt vào năm 2013 với mục đích để xây dựng giao diện người
dùng. Nó được sử dụng rộng rãi để xây dựng các trang web SPA (Single Page
Application) và các ứng dụng trên nền tảng di động. Nó rất dễ sử dụng và cho
phép người dùng có thể tạo các component UI có thể tái sử dụng.
ReactJS có các tính năng hết sức nổi bật bao gồm:
● JSX: viết tắt của JavaScript extension, nó là React extension , giúp cho việc
thay đổi cây DOM dễ dàng hơn bằng HTML-style code đơn giản. Nó là
một trong những tính năng tốt và dễ sử dụng.
● Components: Một trang web được xây dựng bằng ReactJS là một sự kết
hợp nhiều component lại với nhau chứ không phải chung một Template
như bình thường. Các component cũng như các hàm JavaScript bình
thường, giúp tạo ra các code dễ dàng bằng cách tách các logic ra thành các
đoạn code độc lập có thể tái sử dụng. Chúng ta có thể sử dụng component

dưới dạng function hoặc class, ngoài ra các component cịn có state và
props.
● Virtual DOM: ReactJS tạo một thứ gọi là Virtual DOM (DOM ảo). Đúng
như tên gọi, nó là một copy của DOM thật trên trang web đó. ReactJS dùng

SE122.N11.PMCL

Trang 5


những DOM ảo đó để tìm đúng những DOM thật cần được cập nhật khi có
bất kỳ sự kiện nào làm các thành phần bên trong nó thay đổi.
● Javascript Expressions: Biểu thức JS có thể sử dụng trong file .jsx hoặc .js
bằng cách sử dụng cặp dấu ngoặc nhọn “{}”.

2.2.

Ưu điểm

● Vì ReactJS sử dụng DOM ảo để cache cấu trúc dữ liệu trong bộ nhớ và chỉ
những thay đổi cuối cùng mới được cập nhật vào trong DOM trình duyệt.
Điều này làm cho ứng dụng trở nên nhanh hơn.
● Bạn có thể tạo các component theo từng chức năng mà bạn muốn bằng cách
sử dụng tính năng react component. Các component này có thể tái sử dụng
theo nhu cầu của bạn, đồng thời việc tạo các component theo từng chức
năng cũng giúp cho việc bảo trì sau này trở nên dễ dàng hơn.
● ReactJS là một opensource, vì vậy cũng rất dễ cho những bạn mới bắt đầu
tìm hiểu nó.
● Trong những năm gần đây, ReactJS đang trở nên phổ biến hơn và được duy
trì bởi Facebook và Instagram. Ngồi ra nó cũng được sử dụng bởi các

cơng ty nổi tiếng như Apple, Netflix, …
● Facebook vẫn đang duy trì, phát triển, và cho ra những thay đổi mới. Vì thế
bạn cứ yên tâm sử dụng ReactJS cho những dự án của bạn hoặc những dự
án dành do doanh nghiệp.
● ReactJS có thể được sử dụng để xây dựng giao diện người dùng cho cả các
ứng dụng dành cho máy tính và các ứng dụng di động.
● Dễ dàng cho việc test và debug, vì hầu hết các code đều được thực hiện
bằng JavaScript chứ không phải bằng HTML.

2.3.

Nhược điểm

● Vì hầu hết code được viết dưới dạng JSX, tức là HTML và CSS là một phần
của JavaScript, nó khơng giống như những framework khác vẫn tách biệt giữa
HTML và CSS nên những bạn mới làm quen với ReactJS sẽ hơi lúng túng và
dễ nhầm lẫn giữa JSX và HTML. Tuy nhiên bạn sẽ nhanh chóng quen với cách
kết hợp này của React mà thôi.

SE122.N11.PMCL

Trang 6


● Một nhược điểm nữa của ReactJS đó là dung lượng các file của nó hơi lớn.

3.

Tổng quan về NodeJs
3.1.

Tổng quan
Nodejs là một nền tảng (Platform) phát triển độc lập được xây dựng trên V8

JavaScript Engine – trình thơng dịch thực thi mã JavaScript giúp chúng ta có
thể xây dựng được các ứng dụng web như các trang video clip, các forum và
đặc biệt là trang mạng xã hội phạm vi hẹp một cách nhanh chóng và dễ dàng
mở rộng.
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, OS X 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.
Ý tưởng chính của Node js 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ì, Node js
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 tạo ra 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à Node js đư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ợ hàng chục ngàn kết nối đồng thời.

3.2.

Ưu điểm

● 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.

SE122.N11.PMCL

Trang 7


3.3.

Nhược điểm
● 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.

4.

Tổng quan về ExpressJs
4.1.

Tổng quan
ExpressJs là một framework mã nguồn mở miễn phí cho NodeJs. ExpressJs

được sử dụng trong thiết kế và xây dựng các ứng dụng web một cách đơn giản
và nhanh chóng. Để hiểu và sử dụng ExpressJs, lập trình viên chỉ cần biết về
JavaScript, do đó việc xây dựng website sẽ càng dễ dàng hơn đối với các lập

trình viên đã biết về JavaScript trước đó
4.2.

Ưu điểm
ExpressJS sẽ giúp tổ chức kiến trúc back-end của mình. ExpressJs có thể

triển khai website với mơ hình MVC – một mơ hình web phổ biến, giúp cho
việc bảo trì tương đối dễ dàng.
Một số tính năng của ExpressJs:
 Phát triển máy chủ nhanh hơn: cung cấp cho bạn nhiều tính năng phổ
biến của Node.js dưới dạng hàm có thể dễ dàng sử dụng ở bất kỳ đâu
trong chương trình. Điều này sẽ giúp rút ngắn thời gian để viết code.
 Định tuyến: cung cấp cơ chế định tuyến cao giúp duy trì trạng thái của
trang web.
 Khuôn mẫu: cung cấp các công cụ tạo khuôn mẫu cho phép các nhà phát
triển tạo nội dung động trên các trang web bằng việc xây dựng các mẫu
HTML ở phía máy chủ.
 Gỡ lỗi: cung cấp một cơ chế có khả năng xác định chính xác phần ứng
dụng web có lỗi.

SE122.N11.PMCL

Trang 8


4.3.

Nhược điểm
ExpressJS là một framework của NodeJS nên hầu như sẽ có những
điểm yếu mà NodeJS gặp phải

5.

Tổng quan về MySQL
5.1.

Tổng quan
MySQL là một hệ thống quản trị cơ sở dữ liệu mã nguồn mở (gọi tắt là

RDBMS) hoạt động theo mơ hình client-server. Với RDBMS là viết tắt của
Relational Database Management System.
MySQL được đánh giá cao nhờ việc tích hợp với Apache và PHP. Không
chỉ vậy, việc có tính tương thích với nhiều trình duyệt, với nhiều hệ điều hành
tiêu biểu như Ubuntu, Linux, macOS, Windows càng giúp việc sử dụng
MySQL được tin tưởng và ưa chuộng nhiều hơn.

5.2.

Ưu điểm

MySQL được ưa chuộc trong các ứng dụng website nhờ một số ưu điểm sau:
 MySQL là một cơ sở dữ liệu tốc độ cao, ổn định dễ sử dụng và có thể
hoạt động được trên nhiều hệ điều hành khác nhau.
 MySQL có độ bảo mật cao, thích hợp cho các ứng dụng truy cập CSDL
trên internet.
 Có khả năng xử lý rất nhiều dữ liệu và có thể mở rộng nếu cần thiết.
 MySQL hồn tồn miễn phí sử dụng

SE122.N11.PMCL

Trang 9


CHƯƠNG 3: XÂY DỰNG HỆ THỐNG
1.

Mơ hình use-case
1.1.

Sơ đồ Use-case

1.2.

Danh sách Actor

STT

Tên Actor

Ý nghĩa / Ghi chú

1

Người dùng

Người trực tiếp sử dụng
hệ thống

1.3.

Danh sách Use-case

SE122.N11.PMCL

Trang 10


STT

Tên Use-case

Ý nghĩa / Ghi chú

1

Đăng nhập

Đăng nhập vào phần mềm 

2

Đăng xuất

Cho phép người dùng thoát khỏi tài
khoản đang sử dụng

3

Xem thông tin cá nhân

Cho phép người dùng xem lại thông
tin cá nhân đã đăng ký từ trước

4

Chỉnh sửa thông tin cá Cho phép người dùng thay đổi thông
nhân

5

tin cá nhân đã đăng ký từ trước

Xem thơng tin các khóa Xem các thơng tin về các khóa học
học

6

Xem chi tiết khóa học

Xem các thơng tin chi tiết về 1 khóa
học đã chọn

7

Tham gia khóa học

8

Chọn/

điều

chỉnh

giảng
9

Tham gia khóa học và bắt đầu học
bài Điều hướng các bài giảng có trong
khóa học

Xem các khóa học của bản Xem các khóa học mà bản thân đã và
thân

đang học

10

Xem các Blog

Xem các blog được đăng lên trang

11

Xem chi tiết blog

Xem thông tin chi tiết bên trong 1
blog đã chọn

SE122.N11.PMCL

Trang 11


12

Xem bài tập

Xem thông tin bài tập online

13

Nộp bài tập

Nộp bài tập online

14

Bình luận ở bài giảng

Để lại bình luận hoặc thắc mắc liên
quan đến bài giảng

15

Bình luận ở blog

Để lại bình luận hoặc thắc mắc liên
quan đến blog

1.4.

Đặc tả Use-case
1.4.1.

Đăng nhập

STT

01

Tên use case

Đăng nhập

Mục đích

Đăng nhập vào hệ thống.

Người dùng

Người dùng

Điều kiện kích hoạt

Người dùng khởi động hệ thống.

Trạng thái hệ thống trước khi - Email cá nhân
bắt đầu use-case
Trạng thái hệ thống sau khi thực - Người dùng đăng nhập ứng dụng thành cơng.

hiện use-case
Luồng sự kiện chính

1. Người dùng truy cập vào trang web.
2. Người dùng nhập tài khoản, mật khẩu và chọn
lệnh đăng nhập.

SE122.N11.PMCL

Trang 12


3. 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 truy cập ứng dụng. 
Luồng sự kiện phụ

Không 

Mở rộng

- 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.
+ TH1: Người dùng hủy đăng nhập.
 Use case dừng lại.

Các yêu cầu đặc biệt

1.4.2.

Khơng

Đăng xuất

STT

02

Tên use case

Đăng xuất

Mục đích

Đăng xuất khỏi hệ thống.

Người dùng

Người dùng

Điều kiện kích hoạt

Người dùng chọn chức năng đăng xuất

Trạng thái hệ thống trước khi - Tài khoản đã được đăng nhập
bắt đầu use-case
Trạng thái hệ thống sau khi thực - Người dùng đăng xuất thành công.
hiện use-case
Luồng sự kiện chính

1. Người dùng truy cập vào trang web.

2. Người dùng chọn chức năng đăng xuất.

SE122.N11.PMCL

Trang 13


3. Hệ thống xác thực và cho phép người dùng đăng
xuất khỏi hệ thống. 
Luồng sự kiện phụ

Không 

Mở rộng

- Hệ thống xác thực đăng xuất không thành công và
hiển thị thông báo.
+ TH1: Người dùng hủy đăng xuất.
 Use case dừng lại.

Các yêu cầu đặc biệt

1.4.3.

Không

Xem thông tin cá nhân

STT

03

Tên use case

Xem thơng tin cá nhân

Mục đích

Cho phép người dùng xem thơng tin cá nhân của
mình

Người dùng

Người dùng

Điều kiện kích hoạt

- Người dùng đã đăng nhập thành công vào phần
mềm.

Trạng thái hệ thống trước khi - Người dùng đã đăng nhập thành công.
bắt đầu use-case
Trạng thái hệ thống sau khi thực Không
hiện use-case
Luồng sự kiện chính

SE122.N11.PMCL

1. Người dùng mở màn hình cá nhân.

Trang 14


2. Người dùng chọn lệnh thông tin cá nhân
3. Hệ thống truy cập vào dữ liệu và cập nhật thông
tin người dùng trên màn hình.
Luồng sự kiện phụ

Khơng 

Mở rộng

Khơng

Các u cầu đặc biệt

Không

1.4.4.

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

STT

04

Tên use case

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

Mục đích

Cho phép người dùng chỉnh sửa thơng tin cá nhân
của mình.

Người dùng

Người dùng

Điều kiện kích hoạt

- Người dùng đã đăng nhập thành công vào phần
mềm.

Trạng thái hệ thống trước khi - Người dùng đã đăng nhập thành công.
bắt đầu use-case
Trạng thái hệ thống sau khi thực - Hệ thống cập nhật lại thông tin mới của người dùng
hiện use-case

vào dữ liệu

Luồng sự kiện chính

1. Người dùng chọn chỉnh sửa thơng tin cá nhân
trong màn hình thông tin cá nhân.
2. Người dùng nhập những thông tin muốn thay đổi

SE122.N11.PMCL

Trang 15