đồ án tốt nghiệp XÂY DỰNG WEBSITE HỌC VÀ KIỂM TRA TIẾNG ANH

Điều kiện sau - Thành công: Đăng nhập vào hệ thống - Thất bại: Hiển thị thông báo lỗi và trở về giao form đăng nhập Đăng xuất: Use-case này thực hiện chức năng thành viên đăng xuất khỏi

Trang 1

TRƯỜNG ĐẠI HỌC BÁCH KHOA

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN TỐT NGHIỆP NGÀNH: CÔNG NGHỆ THÔNG TIN CHUYÊN NGÀNH: HỆ THỐNG NHÚNG

ĐỀ TÀI:

XÂY DỰNG WEBSITE

HỌC VÀ KIỂM TRA TIẾNG ANH

Người hướng dẫn: TS BÙI THỊ THANH THANH

Sinh viên thực hiện: THÁI VĂN LỢI

Số thẻ sinh viên: 102130168

Lớp: 13T4

Đà Nẵng, 05/2018

Trang 2

ĐẠI HỌC ĐÀ NẴNG

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

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

NHẬN XÉT ĐỒ ÁN TỐT NGHIỆP

1 Thông tin chung:

1 Họ và tên sinh viên: Thái Văn Lợi

2 Lớp: 13T4 Số thẻ SV: 102130168

3 Tên đề tài: Xây dựng website học và kiểm tra tiếng Anh

4 Người hướng dẫn: Bùi Thị Thanh Thanh Học hàm/ học vị: Tiến sĩ

II Nhận xét, đánh giá đồ án tốt nghiệp:

1 Về tính cấp thiết, tính mới, khả năng ứng dụng của đề tài: (điểm tối đa là 2đ)

1 Điểm đánh giá: …… /10 (lấy đến 1 số lẻ thập phân)

2 Đề nghị: ☐ Được bảo vệ đồ án ☐ Bổ sung để bảo vệ ☐ Không được bảo vệ

Đà Nẵng, ngày tháng năm 201

Người hướng dẫn

Trang 3

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

NHẬN XÉT PHẢN BIỆN ĐỒ ÁN TỐT NGHIỆP

I Thông tin chung:

1 Họ và tên sinh viên: Thái Văn Lợi

2 Lớp: 13T4 Số thẻ SV: 13T4

3 Tên đề tài: Xây dựng website học và kiểm tra tiếng Anh

4 Người phản biện: Bùi Thị Thanh Thanh Học hàm/ học vị: Tiến sĩ

II Nhận xét, đánh giá đồ án tốt nghiệp:

tối đa

Điểm đánh giá

1 Sinh viên có phương pháp nghiên cứu phù hợp, giải quyết

1a

- Tính mới (nội dung chính của ĐATN có những phần mới so với

các ĐATN trước đây)

- Đề tài có giá trị khoa học, công nghệ; có thể ứng dụng thực tiễn

15

1b

- Kỹ năng giải quyết vấn đề; hiểu, vận dụng được kiến thức cơ

bản, cơ sở, chuyên ngành trong vấn đề nghiên cứu

- Chất lượng nội dung ĐATN (thuyết minh, bản vẽ, chương trình,

mô hình,…)

50

1c

- Có kỹ năng vận dụng thành thạo các phần mềm ứng dụng trong

vấn đề nghiên cứu;

- Có kỹ năng đọc, hiểu tài liệu bằng tiếng nước ngoài ứng dụng

trong vấn đề nghiên cứu;

- Có kỹ năng làm việc nhóm;

15

2a - Bố cục hợp lý, lập luận rõ ràng, chặt chẽ, lời văn súc tích 15

2b - Thuyết minh đồ án không có lỗi chính tả, in ấn, định dạng 5

3 Tổng điểm đánh giá theo thang 100:

Quy về thang 10 (lấy đến 1 số lẻ)

- Các tồn tại, thiếu sót cần bổ sung, chỉnh sửa: ………

………

- Câu hỏi đề nghị sinh viên trả lời trong buổi bảo vệ: ………

………

- Đề nghị: ☐ Được bảo vệ đồ án ☐ Bổ sung để bảo vệ ☐ Không được bảo vệ

Đà Nẵng, ngày tháng năm 201…

Người phản biện

Trang 4

TÓM TẮT

Tên đề tài: Xây dựng website học và kiểm tra tiếng Anh

Sinh viên thực hiện: Thái Văn Lợi

Số thẻ SV: 102130168

Lớp: 13T4

Website học và kiểm tra tiếng Anh là website giúp cho người dùng có thể học và kiểm tra các kỹ năng tiếng Anh về từ vựng, ngữ pháp, nghe, đọc hiểu Ngoài ra, người dùng có thể chơi game tiếng Anh cùng nhau và chat với nhau

Website được xây dựng dựa trên ReactJS, Redux, NodeJS, Socket.IO, hệ quản trị

cơ sở dữ liệu PostgreSQL

Source dự án được quản lý bằng Git và được lưu trữ trên Bitbucket

Trang 5

CỘNG HÒA XÃ HÔI CHỦ NGHĨA VIỆT NAM

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

Họ tên sinh viên: Thái Văn Lợi Số thẻ sinh viên: 102130168

Lớp: 13T4 Khoa: Công nghệ thông tin Ngành: Công nghệ thông tin

1 Tên đề tài đồ án: Xây dựng website học và kiểm tra tiếng Anh

2 Đề tài thuộc diện: ☐ Có ký kết thỏa thuận sở hữu trí tuệ đối với kết quả thực hiện

3 Các số liệu và dữ liệu ban đầu:

……… ……… ……

………

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

4 Nội dung các phần thuyết minh và tính toán: … ………

… ………

5 Các bản vẽ, đồ thị (ghi rõ các loại và kích thước bản vẽ): … ………

… ………

6 Họ tên người hướng dẫn: TS Bùi Thị Thanh Thanh 7 Ngày giao nhiệm vụ đồ án: …… /……./2018

8 Ngày hoàn thành đồ án: …… /……./2018

Đà Nẵng, ngày 19 tháng 05 năm 2018

Trang 6

LỜI NÓI ĐẦU

Từ khi bắt đầu làm Đồ án tốt nghiệp đến nay, em đã nhận được nhiều sự quan tâm, giúp đỡ và động viên tận tình từ cô Bùi Thị Thanh Thanh Với lòng biết ơn sâu sắc nhất,

em xin gửi đến cô vì cô đã dành hết tâm huyết của mình để truyền đạt kiến thức cho em trong suốt thời gian làm Đồ án tốt nghiệp Nếu không có sự ủng hộ và góp ý của cô thì

Đồ án của em khó có thể hoàn thiện được

Đồng thời, em cũng xin gửi lời cảm ơn đến lãnh đạo trường Đại học Bách khoa - Đại học Đà Nẵng, lãnh đạo khoa Công nghệ thông tin và toàn thể các thầy cô đã cung cấp các kiến thức bổ ích cho em từ khi em vào trường cho đến bây giờ Chính những kiến thức quý giá đó đã hổ trợ em rất nhiều trong việc hoàn thành Đồ án tốt nghiệp

Dù đã kiểm tra nhiều lần, nhưng trong Đồ án tốt nghiệp khó tránh khỏi sai sót, rất mong các thầy cô bỏ qua và em rất mong nhận được những đóng góp của thầy cô để giúp sản phẩm của em được hoàn thiện hơn

Em xin chân thành cảm ơn

Trang 7

CAM ĐOAN

Tôi xin cam đoan:

1 Nội dung trong đồ án này là do tôi thực hiện dưới sự hướng dẫn trực tiếp của T.S Bùi Thị Thanh Thanh

2 Các tham khảo dùng trong đồ án đều được trích dẫn rõ ràng tên tác giả, tên công trình, thời gian, địa điểm công bố

3 Nếu có những sao chép không hợp lệ, vi phạm, tôi xin chịu hoàn toàn trách nhiệm

Sinh viên thực hiện

Thái Văn Lợi

Trang 8

MỤC LỤC

TÓM TẮT

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

LỜI NÓI ĐẦU i

CAM ĐOAN ii

MỤC LỤC iii

DANH SÁCH CÁC BẢNG, HÌNH VẼ v

DANH SÁCH CÁC KÝ HIỆU, CHỮ VIẾT TẮT viii

MỞ ĐẦU 1

Chương 1: CƠ SỞ LÝ THUYẾT 3

1.1 NodeJS 3

1.1.1 Giới thiệu NodeJS 3

1.1.2 Đặc điểm của NodeJS 3

1.1.3 Những ứng dụng thường sử dụng NodeJS 3

1.2 Express Framework 3

1.2.1 Giới thiệu về Express Framework 3

1.2.2 Các tính năng cơ bản của Express Framework 3

1.2.3 Một số ưu điểm của Express Framework 4

1.3 React JS 4

1.3.1 Giới thiệu 4

1.3.2 Các khái niệm cơ bản 4

1.4 Redux 5

1.4.1 Giới thiệu 5

1.4.2 Các khái niệm cơ bản 5

1.4.3 Tính ứng dụng của Redux 5

1.5 Socket.IO 5

1.5.1 Giới thiệu về WebSocket 5

1.5.2 Giới thiệu về Socket.IO 6

1.6 Redis 6

1.7 PostgreSQL 6

Chương 2: PHÂN TÍCH 7

2.1 Phát biểu bài toán 7

2.2 Phân tích 7

2.2.1 Phân tích yêu cầu người dùng và quản trị viên 7

2.2.2 Biểu đồ ca sử dụng 7

2.2.3 Biểu đồ tuần tự của chức năng 22

Trang 9

2.2.4 Tạo bảng cơ sở dữ liệu 28

Chương 3: TRIỂN KHAI VÀ ĐÁNH GIÁ 34

3.1 Triển khai 34

3.1.1 Cài đặt môi trường 34

3.1.2 Triển khai 34

3.2 Đánh giá 45

3.2.1 Ưu điểm 45

3.2.2 Nhược điểm 45

KẾT LUẬN 46

1 Kết quả đạt được 46

2 Hướng phát triển 46

TÀI LIỆU THAM KHẢO 47

Trang 10

DANH SÁCH CÁC BẢNG, HÌNH VẼ

Danh sách các bảng

Bảng 1.1 Sự khác nhau giữa state và props 4

Bảng 2.1 Use-case – Xem hướng dẫn sử dụng 8

Bảng 2.2 Use-case – Đăng ký tài khoản 9

Bảng 2.3 Use-case – Đăng nhập 10

Bảng 2.4 Use-case – Đăng xuất 10

Bảng 2.5 Use-case – Xem bảng xếp hạng 10

Bảng 2.6 Use-case – Xem trang cá nhân 11

Bảng 2.7 Use-case – Xem thành tích 11

Bảng 2.8 Use-case – Cập nhật tài khoản 11

Bảng 2.9 Use-case – Học tiếng Anh 12

Bảng 2.10 Use-case – Kiểm tra tiếng Anh 12

Bảng 2.11 Use-case – Xem kết quả kiểm tra 12

Bảng 2.12 Use-case – Chơi game 13

Bảng 2.13 Use-case – Chat với bạn trong phòng 13

Bảng 2.14 Use-case – Đăng nhập 14

Bảng 2.15 Use-case – Đăng xuất 14

Bảng 2.16 Use-case – Cập nhật tài khoản 14

Bảng 2.17 Use-case – Quản lý bài học 15

Bảng 2.18 Use-case – Tạo mới bài học 15

Bảng 2.19 Use-case – Sửa bài học 15

Bảng 2.20 Use-case – Xóa bài học 16

Bảng 2.21 Use-case – Quản lý câu hỏi 16

Bảng 2.22 Use-case – Tạo mới câu hỏi 16

Bảng 2.23 Use-case – Sửa câu hỏi 17

Bảng 2.24 Use-case – Xóa câu hỏi 17

Bảng 2.25 Use-case – Quản lý thành viên 18

Bảng 2.26 Use-case – Tạo mới thành viên 18

Bảng 2.27 Use-case – Sửa thành viên 18

Bảng 2.28 Use-case – Xóa thành viên 19

Bảng 2.29 Use-case – Quản lý cấp bậc thành viên 19

Bảng 2.30 Use-case – Tạo mới cấp bậc thành viên 19

Bảng 2.31 Use-case – Sửa cấp bậc thành viên 20

Bảng 2.32 Use-case – Xóa cấp bậc thành viên 20

Bảng 2.33 Use-case – Quản lý quản trị viên 21

Trang 11

Bảng 2.34 Use-case – Tạo mới quản trị viên 21

Bảng 2.35 Use-case – Sửa quản trị viên 21

Bảng 2.36 Use-case – Xóa quản trị viên 22

Bảng 2.37 Các trường của bảng Student 29

Bảng 2.38 Các trường của bảng Users 29

Bảng 2.39 Các trường của bảng Lessons 30

Bảng 2.40 Các trường của bảng Vocabularies 30

Bảng 2.41 Các trường của bảng DetailLessons 31

Bảng 2.42 Các trường của bảng Questions 31

Bảng 2.43 Các trường của bảng Answers 32

Bảng 2.44 Các trường của bảng Scores 32

Bảng 2 45 Các trường của bảng Achievements 33

Danh sách các hình Hình 2.1 Sơ đồ các tác nhân 7

Hình 2.2 Biểu đồ use-case của Khách 8

Hình 2.3 Biểu đồ Use-case của Moderator 13

Hình 2.4 Biểu đồ Use-case của Super Moderator 17

Hình 2.5 Biểu đồ Use-case của Administrator 20

Hình 2.6 Biểu đồ tuần tự của chức năng đăng ký 22

Hình 2.7 Biểu đồ tuần tự của chức năng đăng nhập 23

Hình 2.8 Biểu đồ tuần tự của chức năng chỉnh sửa tài khoản 24

Hình 2.9 Biểu đồ tuần tự của chức năng tìm kiếm bài học, bài kiểm tra 25

Hình 2.10 Biểu đồ tuần tự của chức năng học tiếng Anh 26

Hình 2.11 Biểu đồ tuần tự của chức năng kiểm tra tiếng Anh 27

Hình 2.12 Lược đồ quan hệ các bảng dữ liệu 28

Hình 3.1 Kiểm tra cài đặt NodeJS và NPM 34

Hình 3.2 Màn hình chính của website khi chưa đăng nhập 35

Hình 3.3 Màn hình đăng nhập dành cho thành viên 35

Hình 3.4 Màn hình chọn các kỹ năng tiếng Anh 36

Hình 3.5 Danh sách các chủ đề phần Từ vựng 36

Hình 3.6 Nội dung bài học về phần Từ vựng 37

Hình 3.7 Bài kiểm tra về Từ vựng 37

Hình 3.8 Kết quả kiểm tra của người dùng về phần Từ vựng 38

Hình 3.9 Danh sách các bài học phần Đọc hiểu 38

Hình 3.10 Bài kiểm tra phần Nghe 39

Hình 3.11 Nội dung bài học phần Ngữ pháp 39

Hình 3.12 Bài kiểm tra chung 40

Trang 12

Hình 3.13 Màn hình xem bảng xếp hạng các thành viên có tổng điểm cao nhất 40

Hình 3.14 Màn hình xem các phòng game 41

Hình 3.15 Màn hình phòng game khi chưa chơi game 41

Hình 3.16 Màn hình chat của phòng game 42

Hình 3.17 Màn hình chơi game 42

Hình 3.18 Màn hình thống kê về bài học, bảng xếp hạng 43

Hình 3.19 Màn hình quản lý các chủ đề về từ vựng 43

Hình 3.20 Màn hình tạo từ vựng mới 44

Hình 3.21 Màn hình tạo mới câu hỏi cho bài học 44

Trang 13

DANH SÁCH CÁC KÝ HIỆU, CHỮ VIẾT TẮT

JS JavaScript

ECMA European Computer Manufacturers Association

ES ECMAScript

API Application Programming Interface

URL Uniform Resource Locator

UI User Interface

OOP Object Oriented Programing

Npm Node package manage

CSDL Cơ sở dữ liệu

Trang 14

MỞ ĐẦU

1 Bối cảnh đề tài

Ngày nay, tiếng Anh là ngôn ngữ phổ biến, là ngôn ngữ chính của nhiều quốc gia trên thế giới, dùng để giao tiếp giữa các nước với nhau Đặc biệt, trong môi trường công việc thì tiếng Anh lại trở nên cần thiết cho giao dịch và mở rộng quan hệ hợp tác kinh doanh Tiếng Anh càng ngày càng khẳng định được vị trí của mình, trong cuộc sống cũng như công việc Vì vậy, việc học tiếng Anh trở nên vô cùng quan trọng

Hơn nữa, với sự bùng nổ của công nghệ thông tin và Internet, việc sử dụng máy tính hay các thiết bị di động để kết nối với nhau ngày càng được cải thiện Tận dụng lợi thế từ Internet và công nghệ thông tin, chúng ta có thể học và kiểm tra tiếng Anh trên mạng dễ dàng hơn

Đề tài của em thực hiện là Xây dựng website học và kiểm tra tiếng Anh nhằm giúp người dùng có thể học và kiểm tra trình độ tiếng Anh thông qua các kỹ năng: Từ vựng, Ngữ pháp, Nghe, Đọc hiểu

2 Mục tiêu, mục đích

2.1 Mục tiêu

- Hiểu rõ hơn về React JS và Redux

- Hiểu rõ hơn về Node JS

- Hiểu rõ hơn về Socket IO

- Hiểu rõ hơn về cách thực hiện một dự án

2.2 Mục đích

Đề tài được xây dựng nhằm mục đích giúp người dùng học và kiểm tra tiếng Anh

tốt hơn

3 Phạm vi và đối tượng nghiên cứu

Học sinh THPT và sinh viên

4 Phương pháp triển khai

- Thu thập thông tin các học sinh, sinh viên

- Xây dựng ý tưởng, các chức năng và lịch trình thực hiện đề tài

- Xây dựng biểu đồ ca sử dụng, các tác nhân và các biểu đồ cần thiết

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

- Xây dựng chức năng quản trị viên

- Xây dựng chức năng người dùng

- Kiểm tra hoàn thiện các chức năng còn thiếu và phát triển thêm

- Hoàn thành báo cáo + đĩa CD

Trang 15

5 Cấu trúc của đồ án tốt nghiệp

Đồ án bao gồm các nội dung như sau:

Mở đầu

Giới thiệu về đề tài, mục tiêu, mục đích, phạm vi và đối tượng nghiên cứu của đề tài đã chọn

Chương 1: CƠ SỞ LÝ THUYẾT

Giới thiệu sơ lược về ngôn ngữ, các công nghệ sử dụng để thực hiện đề tài

Chương 2: PHÂN TÍCH

Trình bày các biểu đồ use-case, biểu đồ tuần tự của chức năng và xây dựng cơ sở

dữ liệu

Chương 3: TRIỂN KHAI VÀ ĐÁNH GIÁ

Trình bày về cách cài đặt các ứng dụng liên quan, các chức năng của website và kết quả đạt được

Kết luận

Trình bày về những kết quả bản thân đạt được sau khi thực hiện đề tài, hướng phát triển của website

Trang 16

Chương 1: CƠ SỞ LÝ THUYẾT

1.1 NodeJS

1.1.1 Giới thiệu NodeJS

NodeJS là một mã nguồn được xây dựng dựa trên nền tảng Javascript V8 Engine,

là mã nguồn mở được sử dụng bởi hàng ngàn lập trình viên trên toàn thế giới, có thể chạy trên nhiều nền tảng hệ điều hành khác nhau từ Window cho đến Linux, OS X

1.1.2 Đặc điểm của NodeJS

- Bất đồng bộ: Tất cả các API của NodeJS đều bất đồng bộ, nó chủ yếu dựa trên nền tảng của NodeJS Server và chờ đợi Server trả dữ liệu về

- Xử lý nhanh: NodeJS dựa trên nền tảng V8 JavaScript Engine nên thực thi chương trình rất nhanh, tận dụng tối đa tài nguyên của server, không tạo ra độ trễ như các ngôn ngữ phía server khác

- Đơn luồng nhưng khả năng mở rộng cao: NodeJS sử dụng một mô hình đơn luồng duy nhất với sự kiện lặp Cơ chế tổ chức sự kiện giúp các máy chủ để đáp ứng một cách không ngăn chặn và làm cho máy chủ có khả năng mở rộng cao, trái ngược với các máy chủ truyền thống

- Không cache: NodeJS không đệm lên các dữ liệu nào và các ứng dụng này chủ yếu là đầu ra dữ liệu

1.1.3 Những ứng dụng thường sử dụng NodeJS

- Các ứng dụng về I/O

- Các ứng dụng về luồng dữ liệu

- Các ứng dụng về dữ liệu hướng đến thời gian thực

- Các ứng dụng dựa vào JSON APIs

- Các ứng dụng Single Page Application

1.2 Express Framework

1.2.1 Giới thiệu về Express Framework

Express là một framework dành cho NodeJS Nó cung cấp nhiều tính năng mạnh

mẽ trên nền tảng web cũng như trên các ứng dụng di động Express hỗ trợ các phương thức HTTP và middleware tạo ra một API vô cùng mạnh mẽ và dễ sử dụng

1.2.2 Các tính năng cơ bản của Express Framework

- Cho phép thiết lập các lớp trung gian để trả về các HTTP request

- Định nghĩa bảng routing có thể được sử dụng với các hành động khác nhau dựa trên phương thức HTTP và URL

- Cho phép trả về các trang HTML dựa vào các tham số truyền vào đến template

Trang 17

1.2.3 Một số ưu điểm của Express Framework

- Express hỗ trợ phát triển theo mô hình MVC

- Cho phép định nghĩa các middleware

- Định nghĩa rõ ràng các request method trong route

React cho phép các nhà phát triển tạo ra các web-application sử dụng dữ liệu và có thể thay đổi chúng theo thời gian mà không cần phải load lại trang với mục đích nâng cao tốc độ, đơn giản hóa và khả năng mở rộng cao

1.3.2 Các khái niệm cơ bản

Components

Components giúp chúng ta chia UI thành các thành phần độc lập, để chúng ta có thể sử dụng lại và quản lý nó Component giống như các hàm trong JavaScript Nó chấp nhận các input tùy ý, gọi là props, và trả về React element mô tả những gì sẽ xuất hiện

Có thể nhận được giá trị ban đầu từ Component cha Có Có

Có thể thay đổi bởi Component cha Có Không

Có thể set giá trị mặt định bên trong Component Có Có

Có thể thay đổi bên trong Component Không Có

Có thể thiết lập giá trị ban đầu cho Component con Có Có

Có thể thay đổi trong Component con Có Không

Trang 18

1.4 Redux

1.4.1 Giới thiệu

Redux là một thư viện JavaScript giúp tạo ra thành một lớp quản lý trạng thái của ứng dụng Redux được dựa trên nền tảng tư tưởng của ngôn ngữ Elm và kiến trúc Flux

do Facebook giới thiệu, do vậy, Redux thường là bộ đôi kết hợp hoàn hảo với React

Ba nguyên tắc của Redux

- Nguồn dữ liệu tin cậy duy nhất: State của toàn bộ ứng được chứa trong một object tree nằm trong Store duy nhất

- Trạng thái chỉ được phép đọc: Cách duy nhất để thay đổi State của ứng dụng là phát một Action (là 1 object mô tả những gì xảy ra)

- Thay đổi chỉ bằng hàm thuần túy: Để chỉ ra cách mà State được biến đổi bởi Action chúng ta dùng các pure function gọi là Reducer

1.4.2 Các khái niệm cơ bản

- Quản lý trạng thái: như một bản replay có thể undo/redo trạng thái của ứng dụng

- Tăng tốc phát triển: với webpack đã có Hot Module Replacement, khi kết hợp với Redux, tạo thành sự kết hợp ăn ý, chúng ta có thể viết code và debug rất dễ dàng, nếu chúng ta không áp dụng Redux, đồng nghĩa chúng ta phải debug lặp đi lặp lại việc nhập

dữ liệu, mà chưa chắc lỗi do code gây ra mà do dữ liệu nhập vào

- Ứng dụng offline: tất cả các thao tác của người dùng được lưu vào một cây trạng thái, khi có kết nối Internet, chương trình sẽ được đồng bộ lên server bởi một loạt các

sự kiện

1.5 Socket.IO

1.5.1 Giới thiệu về WebSocket

WebSocket là một phần của HTML5, là giao thức giúp truyền dữ liệu hai chiều giữa server-client qua một kết nối TCP duy nhất Vì vậy, WebSocket có thể hoạt động trên các cổng web tiêu chuẩn, nên không có rắc rối về việc mở cổng cho các ứng dụng,

lo lắng về việc bị chặn bởi tường lửa hay proxy server

Trang 19

1.5.2 Giới thiệu về Socket.IO

Socket.IO là một bộ thư viện dành để phát triển các ứng dụng realtime trên web

hoặc ứng dụng mobile Socket.IO càng ngày càng được sử dụng rộng rãi vì đặc trưng mạnh mẽ và dễ sử dụng Với Socket.IO, việc làm việc với Websockets trở nên đơn giản hơn nhiều

Thư viện Socket.IO gồm hai phần:

- Phía Client: gồm bộ thư viện viết cho web, iOS và Android

- Phía Server: Viết bằng JavaScript, dùng cho các máy chủ Node JS

1.6 Redis

Redis là hệ thống hỗ trợ caching data trên RAM, cho phép lưu trữ dữ liệu dưới dạng key/value

Đặc điểm nổi bật:

- Data lưu trên RAM với hiệu suất truy xuất cao

- Định kỳ sao lưu dữ liệu ra đĩa cứng

- Hỗ trợ thêm, sửa, xóa dữ liệu đơn giản và nhanh chóng

Trang 20

Chương 2: PHÂN TÍCH

2.1 Phát biểu bài toán

Đây là website học và kiểm tra tiếng Anh Người dùng có thể đăng ký tài khoản để học và kiểm tra tiếng Anh về các kỹ năng: Từ vựng, Ngữ pháp, Nghe, Đọc hiểu

Bên cạnh đó, người dùng có thể chơi game tiếng Anh và chat với nhau trong các phòng game

2.2 Phân tích

2.2.1 Phân tích yêu cầu người dùng và quản trị viên

Người dùng:

- Giao diện dễ sử dụng, có tính thẩm mỹ cao

- Cho phép người dùng đăng ký thành viên và đảm bảo bí mật thông tin của người dùng Có thể dùng tài khoản Facebook để đăng ký

- Xem và thay đổi thông tin tài khoản

- Học và kiểm tra các kỹ năng tiếng Anh Có thể biết số điểm của bài kiểm tra và biết được những bài học người dùng đã vượt qua

- Người dùng có thể tìm kiếm các bài học

- Có thể trao đổi với các thành viên khác

- Có thể xem bảng xếp hạng những người dùng cao điểm nhất

Trang 21

- Khách: Là những người truy cập vào hệ thống, không có tài khoản hoặc chưa

đăng nhập

- Thành viên: Là những người có tài khoản bằng cách đăng ký, đã đăng nhập vào

hệ thống và sử dụng các chức năng mà hệ thống cung cấp

- Moderator: Là những người được chủ hệ thống cung cấp tài khoản, có quyền

quản lý các bài học, nội dung và các câu hỏi, câu trả lời cho từng bài học

- Super Moderator: Là quản trị viên cấp cao hơn Moderator, có quyền quản lý

thành viên, quản lý các cấp bậc người dùng và các quyền của Moderator, nhưng không

có quyền quản lý tài khoản của quản trị viên (Moderator, Super Moderator và

Administrator)

- Administrator: Là người quản trị cao nhất của hệ thống, có quyền quản lý tài

khoản của các quản trị viên (Moderator, Super Moderator và Administrator) và các chức năng của Super Moderator

Biểu đồ ca sử dụng và các tác nhân

- Khách

Hình 2.2 Biểu đồ use-case của Khách

Xem hướng dẫn sử dụng: Use-case này thực hiện chức năng xem hướng dẫn sử

dụng website

Bảng 2.1 Use-case – Xem hướng dẫn sử dụng

Use-case liên quan Không có use-case nào liên quan đến

Điều kiện sau - Thành công: Hiển thị hướng dẫn sử dụng website

- Không thành công: Thông báo lỗi

Trang 22

Đăng ký tài khoản: Use-case này thực hiện chức năng đăng ký tài khoản để trở thành

thành viên

Bảng 2.2 Use-case – Đăng ký tài khoản

Mô tả chung Cho phép khách đăng ký tài khoản để trở thành thành viên

Điều kiện sau - Thành công: Thông báo tài khoản được tạo thành công

Thành viên

Hình 2.1 Biểu đồ use-case của Thành viên

Trang 23

Đăng nhập: Use-case này thực hiện chức năng thành viên đăng nhập vào hệ thống

Bảng 2.3 Use-case – Đăng nhập

Mô tả chung Cho phép thành viên đăng nhập vào hệ thống để sử dụng các chức

năng

Điều kiện sau - Thành công: Đăng nhập vào hệ thống

- Thất bại: Hiển thị thông báo lỗi và trở về giao form đăng nhập

Đăng xuất: Use-case này thực hiện chức năng thành viên đăng xuất khỏi hệ thống

Bảng 2.4 Use-case – Đăng xuất

Use-case liên quan Đăng nhập

Mô tả chung Cho phép thành viên đăng nhập vào hệ thống để sử dụng các chức

năng

Xem bảng xếp hạng: Use-case này thực hiện chức năng xem bảng xếp hạng những

thành viên có tổng điểm số cao nhất qua các lần kiểm tra

Bảng 2.5 Use-case – Xem bảng xếp hạng

Mô tả chung Cho phép xem bảng xếp hạng những thành viên có tổng điểm số

cao nhất qua các lần kiểm tra

Điều kiện trước Đã đăng nhập tài khoản thành viên

Điều kiện sau - Thành công: Hiển thị bảng xếp hạng thành viên

Trang 24

Xem trang cá nhân: Use-case này thực hiện chức năng thành viên xem trang cá nhân

của chính mình

Bảng 2.6 Use-case – Xem trang cá nhân

Mô tả chung Cho phép thành viên xem trang cá nhân của chính mình

Điều kiện sau - Thành công: Hiển thị trang cá nhân của thành viên

Xem thành tích: Use-case này thực hiện chức năng thành viên xem thành tích của chính

mình

Bảng 2.7 Use-case – Xem thành tích

Use-case liên quan Đăng nhập, Xem trang cá nhân

Mô tả chung Cho phép thành viên xem thành tích của chính mình

Điều kiện sau - Thành công: Hiển thị thành tích của thành viên

Cập nhật tài khoản: Use-case này thực hiện chức năng thành viên cập nhật tài khoản

của chính mình

Bảng 2.8 Use-case – Cập nhật tài khoản

Use-case liên quan Đăng nhập, Xem trang cá nhân

Mô tả chung Cho phép thành viên cập nhật tài khoản của chính mình

Điều kiện sau - Thành công: Hiển thị kết quả cập nhật tài khoản của thành viên

Trang 25

Học tiếng Anh: Use-case này thực hiện chức năng thành viên học tiếng Anh

Bảng 2.9 Use-case – Học tiếng Anh

Mô tả chung Cho phép thành viên học tiếng Anh trong hệ thống

Điều kiện sau - Thành công: Hiển thị nội dung bài học của hệ thống

Kiểm tra tiếng Anh: Use-case này thực hiện chức năng thành viên kiểm tra kỹ năng

tiếng Anh của mình

Bảng 2.10 Use-case – Kiểm tra tiếng Anh

Use-case liên quan Đăng nhập, Học tiếng Anh

Mô tả chung Cho phép thành viên kiểm tra kỹ năng tiếng Anh

Điều kiện sau - Thành công: Hiển thị nội dung bài kiểm tra tiếng Anh

Xem kết quả kiểm tra: Use-case này thực hiện chức năng thành viên xem kết quả kiểm

tra của mình

Bảng 2.11 Use-case – Xem kết quả kiểm tra

Use-case liên quan Đăng nhập, Kiểm tra từ vựng, Kiểm tra ngữ pháp, Kiểm tra đọc

hiểu, Kiểm tra nghe, Kiểm tra chung

Mô tả chung Thành viên xem kết quả kiểm tra sau khi nộp bài

Điều kiện sau - Thành công: Hiển thị điểm số và kết quả của thành viên

Trang 26

Chơi game: Use-case này thực hiện chức năng các thành viên chơi game với nhau

Bảng 2.12 Use-case – Chơi game

Mô tả chung Thành viên chơi game với các thành viên khác

Điều kiện sau - Thành công: Hiển thị màn hình chơi game của thành viên

Chat với bạn trong phòng: Use-case này thực hiện chức năng thành viên chat với các

thành viên khác trong phòng game

Bảng 2.13 Use-case – Chat với bạn trong phòng

Use-case liên quan Đăng nhập, Chơi game

Mô tả chung Thành viên có thể chat với các thành viên khác trong phòng game

Điều kiện sau - Thành công: Hiển thị màn hình chat giữa các thành viên

Moderator

Hình 2.3 Biểu đồ Use-case của Moderator

Trang 27

Đăng nhập: Use-case này thực hiện chức năng quản trị viên đăng nhập vào hệ thống

Bảng 2.14 Use-case – Đăng nhập

Mô tả chung Cho phép quản trị viên đăng nhập vào hệ thống để sử dụng các

chức năng

Đăng xuất: Use-case này thực hiện chức năng quản trị viên đăng xuất khỏi hệ thống

Bảng 2.15 Use-case – Đăng xuất

Mô tả chung Cho phép quản trị viên đăng nhập vào hệ thống để sử dụng các

chức năng

Điều kiện trước Đã đăng nhập tài khoản quản trị viên

Cập nhật tài khoản: Use-case này thực hiện chức năng quản trị viên cập nhật tài khoản

Bảng 2.16 Use-case – Cập nhật tài khoản

Mô tả chung Cho phép quản trị viên cập nhật tài khoản của chính mình

Điều kiện sau - Thành công: Thông báo cập nhật thành công

- Thất bại: Hiển thị thông báo lỗi

Trang 28

Quản lý bài học: Use-case này thực hiện chức năng quản trị viên quản lý bài học

Bảng 2.17 Use-case – Quản lý bài học

Mô tả chung Cho phép quản trị viên quản lý bài học

Điều kiện sau - Thành công: Hiển thị thông báo thành công

Tạo mới bài học: Use-case này thực hiện chức năng quản trị viên thêm bài học

Bảng 2.18 Use-case – Tạo mới bài học

Use-case liên quan Đăng nhập, Quản lý bài học

Mô tả chung Cho phép quản trị viên tạo mới bài học

Điều kiện sau - Thành công: Hiển thị thông báo tạo mới thành công

Sửa bài học: Use-case này thực hiện chức năng quản trị viên sửa bài học

Bảng 2.19 Use-case – Sửa bài học

Mô tả chung Cho phép quản trị viên sửa bài học

Điều kiện sau - Thành công: Hiển thị thông báo sửa thành công

Trang 29

Xóa bài học: Use-case này thực hiện chức năng quản trị viên xóa bài học

Bảng 2.20 Use-case – Xóa bài học

Mô tả chung Cho phép quản trị viên xóa bài học

Điều kiện sau - Thành công: Hiển thị thông báo xóa thành công

Quản lý câu hỏi: Use-case này thực hiện chức năng quản trị viên quản lý câu hỏi

Bảng 2.21 Use-case – Quản lý câu hỏi

Mô tả chung Cho phép quản trị viên quản lý câu hỏi của bài học

Điều kiện sau - Thành công: Hiển thị thông báo thành công

Tạo mới câu hỏi: Use-case này thực hiện chức năng quản trị viên thêm câu hỏi

Bảng 2.22 Use-case – Tạo mới câu hỏi

Use-case liên quan Đăng nhập, Quản lý câu hỏi

Mô tả chung Cho phép quản trị viên tạo mới câu hỏi của bài học

Điều kiện sau - Thành công: Hiển thị thông báo tạo mới thành công

Trang 30

Sửa câu hỏi: Use-case này thực hiện chức năng quản trị viên sửa câu hỏi

Bảng 2.23 Use-case – Sửa câu hỏi

Mô tả chung Cho phép quản trị viên sửa câu hỏi của bài học

Điều kiện sau - Thành công: Hiển thị thông báo sửa thành công

Xóa câu hỏi: Use-case này thực hiện chức năng quản trị viên xóa câu hỏi

Bảng 2.24 Use-case – Xóa câu hỏi

Mô tả chung Cho phép quản trị viên xóa câu hỏi của bài học

Điều kiện sau - Thành công: Hiển thị thông báo xóa thành công

Super Moderator

Hình 2.4 Biểu đồ Use-case của Super Moderator

Định dạng
Số trang	60
Dung lượng	2,39 MB