Website luyện thi vào lớp 10 (đồ án 1 SE121 l21)

Để có được sự thành công trong môn học và hoàn thành tốt đồ án 1 “Website luyện thi vào lớp10” em đã nhận được rất nhiều sự giúp đỡ của các quý thầy cô và bạn bè.. Tỏ lòng biết ơn sâu sắ

=

ĐẠ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 1

WEBSITE LUYỆN THI VÀO LỚP 10

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

ThS.Huỳnh Hồ Thị Mộng Trinh

Sinh viên thực hiện:

Trần Huy Win -18521686

Phạm Thiên Long-18521052

Tp Hồ Chí Minh, 6/2021

Nhận Xét Của Giáo Viên

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

1

………

………

………

………

… , ngày tháng năm 2021

Người nhận xét

(Ký tên)

2

Lời cảm ơn

Để có được sự thành công trong môn học và hoàn thành tốt đồ án 1 “Website luyện thi vào lớp10” em đã nhận được rất nhiều sự giúp đỡ của các quý thầy cô và bạn bè Tỏ lòng biết ơn sâu sắc em xinchân thành cảm ơn những giảng viên ở khoa Công nghệ phần mềm – Đại học Công Nghệ Thông Tin đãcùng với tri thức và tâm huyết của mình truyền đạt vốn kiến thức quý báu cho em trong suốt thời gianhọc tập tại trường

Em xin chân thành cảm ơn Cô Huỳnh Hồ Thị Mộng Trinh đã tận tâm hướng dẫn chúng em quatừng buổi học trên lớp Nếu không có những lời hướng dẫn, chỉ bảo của thầy cô thì em nghĩ quá trìnhhoàn thiện bài báo cáo này của chúng em sẽ gặp nhiều vấn đề và khó khăn hơn

Do kiến thức và khả năng của em còn nhiều hạn chế, vì vậy không tránh khỏi những thiếu sót,yếu kém Em rất mong nhận được những ý kiến đóng góp quý báu của thầy cô để kiến thức của emđược hoàn thiện hơn

Sau cùng, em xin kính chúc quý thầy cô ở khoa Công nghệ phần mềm và Cô Huỳnh Hồ Thị Mộng Trinh thật dồi dào sức khỏe, niềm tin để tiếp tục thực hiện sứ mệnh cao đẹp của mình là truyền đạt kiến thức cho thế hệ mai sau

Trân trọng cảm ơn.

3

Mục Lục

1 Tổng quan đề tài 6 1.1 Đặt vấn đề 6 1.2 Giải pháp 6 1.3 Mục tiêu 6 1.4 Phạm vi 7 1.5 Công cụ sử dụng 7

2 Xác định và phân tích yêu cầu 7 2.1 Khảo sát hiện trạng 7 2.2 Phân tích yêu cầu 8

2.2.1 Yêu cầu chức năng 8 2.2.2 Yêu cầu phi chức năng 8 3 Thiết kế

hệ thống 9 3.1 Sơ đồ usecase 9 3.2 Danh sách tác nhân hệ thống 13 3.3 Danh sách

usecase 13 3.4 Đặc tả usecase 14 3.4.1 Module Lịch sử làm bài 14 3.4.2 Module Làm bài thi 15 3.4.3 Module Tạo bài kiểm tra 16 3.4.4 Module Duyệt bài kiểm tra 17 3.4.5 Module đăng nhập 18 3.4.7 Module tạo tài khoản

19 a Sơ đồ tuần tự 20 2 Thiết kế dữ liệu 23 a Mô tả chi tiết

các kiểu dữ liệu trong sơ đồ logic 23 i Bảng Ghi Chú 23 ii Mô tả chi tiết

các kiểu dữ liệu 23 1 Kiến trúc 25 2 Thiết kế giao diện 27 2.1 Danh sách màn hình 27 2.2 Chi tiết màn hình 28 Màng hình trang chủ website 28 Màn hình chọn đề(luyện thi) 28 Màn hình

làm bài thi( sau khi chọn đề) 29

4

Màn hình chấm điểm và xem giải thích

30 Màn hình quản lý user 33 Màn hình bảng điểm 33 Màn hình điền thông tin đề thi( đăng đề) 34 Màn hình tạo câu hỏi( đăng đề) 35 Màn hình xem trước đề thi( đăng đề) 36 Màn hình duyệt đề(admin) 37 Màn hình đăng nhập 37

3 Kết luận 38 3.1 Môi trường phát triển và môi trường triển khai 38 3.2 Kết quả đạt được 38 3.3 Hướng phát triển 38

5

1 Tổng quan đề tài

1.1 Đặt vấn đề

Dựa trên nhu cầu thực tế của xã hội ngày càng bùng nổ bệnh dịch covid 19 nên cần có nhiều thêm các website để các em nhỏ ôn tập cũng như luyện thi cho các kì thi lớn như thi đại học, thituyển sinh cấp 3 Nhằm giải quyết những vấn giúp đỡ các em có một môi trường rèn luyện các bài thi thử thật tốt, tham khảo các dạng bài thi cũng như các loại bài tập Đó là những nội dung

cơ bản đề cập đến trong đề tài này

Website luyện thi vào lớp 10 sẽ giúp ích cho các bạn học sinh rất nhiều, đặc biệt là trong thời buổi dịch bệnh hoành hành, không thể đến trường lớp thường xuyên Bạn không cần thiết phải biết nhiều về tin học, bạn vẫn có thể sử dụng trang web một cách hiệu quả Giao diện thuận tiện dễ sử dụng của chương trình sẽ luôn khiến bạn cảm thấy thật thoải mái khi sử dụngwebsite

1.2 Giải pháp

Để có thể hoàn thành được đề tài thì cần phải nghiên cứu những nội dung như sau: • Tìm hiểu cách thức vận hành 1 bài thi thử

• Tìm hiểu về các nghiệp vụ liên quan tới quá trình thực hiện bài kiểm tra, đăng bài kiểm tra lên trang web, cách thức chấm điểm

• Cần phải tìm hiểu nghiên cứu về những nhu cầu có thể phát sinh của người dùng để có giải pháp phù hợp

1.3 Mục tiêu

Xây dựng website luyện thi lớp 10 đáp ứng những nhu cầu sau:

• Thực hiện được các chức năng cơ bản của một website học tập

• Trang bảng giúp chủ học sinh có thể quản lý, cập nhật thông tin các bài kiểm tra •

Có hình thức chấm điểm chính xác, phù hợp với các loại bài thi

• Có thể giúp các giáo viên đăng đề lên trang web dễ dàng.

6

1.4 Phạm vi

Thời gian thực hiện đồ án có hạn, việc xây dựng website sẽ tập trung vào các chức năng chính bao gồm : thống kê bảng điểm,luyện thi, quản lý đề thi, đăng đề thi, duyệt đề thi, quản lí thông tin tài khoản

1.5 Công cụ sử dụng

Trong quá trình xây dựng phần mềm, nhóm đã sử dụng phần mềm sau:

• Visual Studio Code: IDE xây dựng phần mềm

• ReactJS: Xây dựng giao diện website

• Redux: State management

• Bootstrap: Built-in styles

• Firebase: Database

2 Xác định và phân tích yêu cầu

2.1 Khảo sát hiện trạng

Yêu cầu

Nắm rõ các thành phần của thông tin nghiệp vụ

Nắm rõ những đề thi, môn học mà nhiều người muốn luyện tập, tìm ra cách thức chấm điểm tự động phù hợp cho các dạng bài thi

Tìm hiểu kỹ về tài nguyên máy móc, trang thiết bị, phần mềm, hệ điều hành phần lớn của các bạn

7

2.2 Phân tích yêu cầu

2.2.1 Yêu cầu chức năng

Yêu cầu lưu trữ:

Tính năng lưu trữ là yêu cầu quan trọng nhất của hệ thống là cơ sở để thực hiện phầnlớn tính năng của hệ thống, để đảm bảo việc quản có hiệu quả hệ thống lưu trữ cần lưu trữnhững thông tin sau:

• Thông tin đề bài, đáp án, câu trả lời

• Thông tin user, phân quyền các user

•

Yêu cầu tính năng:

• Chức năng tìm kiếm đề kiểm tra

• Chức năng thống kê báo cáo kết quả làm bài kiểm tra

• Chức năng cập nhật

• Chức năng đăng đề bài, kiểm duyệt đề bài

• Chức năng tham gia bài kiểm tra

2.2.2 Yêu cầu phi chức năng

Yêu cầu về giao diện: giao diện phải thân thiện với người dùng, phù hợp Người dùng có thể dễ dàng sử dụng cũng như thap tác

Yêu cầu chất lượng:

• Tính tiến hóa

• Tính tiện dụng

• Tính hiệu quả

• Tính tương thích

8

3 Thiết kế hệ thống

3.1 Sơ đồ usecase

9

10

11

12

3.2 Danh sách tác nhân hệ thống

STT Tác nhân của hệ thống Ý nghĩa

2 Thầy giáo Quản lý các nghiệp vụ chính của luyện thi,

đăng đề bài

3 Học sinh Thực hiện được các chức năng cơ bản khi vào

một website luyện thi

3.3 Danh sách usecase

STT Usecase Ý nghĩa

1 Lịch sử làm bài Giúp quản lý thông tin các bài thi đã được học

sinh tham gia

2 Luyện thi Thực hiện chức năng tham gia bài thi

3 Quản lý user Giúp quản lý thông tin user

4 Đăng đề Thực hiện chức năng tạo mới đề bài thi của

giáo viên, sửa đề bài

5 Duyệt đề Thực hiện chức năng phê duyệt, xóa bài thi

trên hệ thống

13

3.4 Đặc tả usecase

3.4.1 Module Lịch sử làm bài

Lịch sử làm bài

Tác nhân chính Học sinh Tác nhân phụ

Mô tả Tra cứu thông tin các bài kiểm tra đã được học sinh làmXảy ra khi Truy cập mục Lịch sử làm bài

Điều kiện trước PRE-1: Học sinh đã đăng nhập vào hệ thống

Điều kiện sau

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung

Ngầm định Không có

14

3.4.2 Module Làm bài thi

Làm bài thi

Tác nhân chính Học sinh Tác nhân phụ

Mô tả Học sinh tiến hành làm bài kiểm tra thì sẽ hiện ra giao diện bắt

đầu làm bài thiXảy ra khi Khi học sinh muốn bắt đầu làm bài kiểm tra

Điều kiện trước PRE-1: Học sinh đã chọn bài kiểm tra

Điều kiện sau POST-1: Học sinh đã xác nhận chắc chắn muốn hoàn thành bài

thi POST-2: Thông tin được lưu trữ vào hệ thốngDòng sự kiện

cơ bản

1 Bắt đầu làm bài kiểm tra

2 Trả lời các câu hỏi có trong bài kiểm tra trong thời gian quy định

3 Xác nhận kết thúc bài kiểm tra

4 Xác nhận lại thông tin

5 Hệ thống ghi nhận kết quả bài làmDòng sự kiện

ngoài lề

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung 1 Học sinh có thể bỏ trống câu hỏi

Ngầm định Không có

15

3.4.3 Module Tạo bài kiểm tra

Tạo bài kiểm tra

Tác nhân chính Giáo viên Tác nhân phụ Admin

Mô tả Khi giáo viên có nhu cầu tạo 1 bài kiểm tra và bấm vào tạo bài

kiểm tra thì giao diện sẽ hiện raXảy ra khi Khi giáo viên có nhu cầu tạo 1 bài kiểm tra

Điều kiện trước PRE-1: Khi actor đã điền thông tin bài thi (Nơi ra đề, dạng đề,

thời gian, môn,lần ra đề) PRE-2: Khi actor đã tạo đủ các câu hỏiĐiều kiện sau POST-1: Yêu cầu xác nhận kết thúc tạo bài kiểm tra

POST-2: Thông tin được lưu trữ vào hệ thốngDòng sự kiện

cơ bản

1 Điền thông tin bài thi(Nơi ra đề, dạng đề, thời gian, môn,lần ra đề)

2 Actor tạo bộ câu hỏi kèm đáp án

3 Xác nhận lại bộ câu hỏi

4 Gửi đề chờ admin phê duyệtDòng sự kiện

ngoài lề

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung 1 Actor có thể thêm gợi ý trả lời

Ngầm định Không có

16

3.4.4 Module Duyệt bài kiểm tra

Duyệt bài kiểm tra

Tác nhân chính Admin Tác nhân phụ

Mô tả Khi actor có nhu cầu kiểm duyệt bài kiểm tra để đăng lên

website và bấm vào phần duyệt đề thì sẽ hiện ra giao diện duyệt bài

Xảy ra khi Khi actor có nhu cầu kiểm duyệt bài kiểm tra

Điều kiện trước PRE-1: Actor đã đăng nhập vào website, có quyền được truy

cập là admin PRE-2: Actor đã chọn bài kiểm traĐiều kiện sau POST-1: Hệ thống sẽ đăng bài kiểm tra lên hệ thống

POST-2: Thông tin được lưu trữ vào hệ thốngDòng sự kiện

cơ bản

1 Actor vài giao diện duyệt bài kiểm tra

2 Actor chọn bài kiểm tra muốn kiểm duyệt

3 Actor click vào duyệt đề

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung

Ngầm định Không có

17

3.4.5 Module đăng nhập

Điều kiện trước PRE-1: Nhập đúng tài khoản, mật khẩu hoặc dùng tài khoản liên

kết của googleĐiều kiện sau POST-1:Điều hướng đến trang chủ

Dòng sự kiện

cơ bản

1 Actor bấm vào đăng nhập

2 Actor nhập tài khoản mật khẩu Dòng sự kiện

ngoài lề

1 Actor sử dụng đăng nhập qua tài khoản google 1.1 Actor chọn tài khoản google để đăng nhập

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung

Ngầm định Không có

18

3.4.7 Module tạo tài khoản

Tạo tài khoản

Tác nhân chính Học sinh,

admin, giáo viên

Tác nhân phụ

Mô tả Khi khách hàng có nhu cầu tạo tài khoản

Xảy ra khi Khi actor có nhu cầu muốn tìm kiếm và click tạo tài khoản ở

trang chủĐiều kiện trước

Điều kiện sau POST-1: Thông tin tài khoản được lưu trữ vào hệ thống

Dòng sự kiện

cơ bản

1 Có nhu cầu tạo tài khoản

2 Actor vào giao diện website click tạo tài khoản 3 Điền đầy đủ các thông tin cần thiết(Email, tên tài khoản, mật khẩu)

4 Xác nhận lại thông tin

5 Actor nhấn hoàn tất và hệ thống lưu thông tin tài khoản mới

Dòng sự kiện

ngoài lề

Độ ưu tiên Cao

Quy định liên qua

Thông tin bổ sung

Ngầm định Không có

19

a Sơ đồ tuần tự

• Sơ đồ tuần tự làm bài kiểm tra

20

• Sơ đồ tuần tự tạo đề kiểm tra

21

• Sơ đồ tuần tự duyệt đề(admin)

22

2 Thiết kế dữ liệu

a Mô tả chi tiết các kiểu dữ liệu trong sơ đồ logic

i Bảng Ghi Chú

STT Tên bảng Ý Nghĩa

3 HomeworkHistory Lưu thông tin lịch sử bài kiểm tra

4 ListQuestion Lưu thông tin chi bộ câu hỏi

5 CorrectAnswer Lưu thông tin câu trả lời đúng

6 MultipleChoieAnswers Lưu thông tin các câu trả lời

ii Mô tả chi tiết các kiểu dữ liệu

1 User

23

2 HomeworkHistory

3 Exam

24

4 ListQuestion

5 CorrectAnswer

STT Thuộc tính Kiểu

3 MultipleChoieAnswer string

6 MultipleChoieAnswers

STT Thuộc tính Kiểu

1 Kiến trúc

Kiến trúc Client – Server:

25

Kiến trúc Client-Server (máy khách-máy chủ) là một mô hình máy tính, trong đó máy chủ (server), cung cấp và quản lý hầu hết các nguồn lực và dịch vụ cho máy khách (client) Kiểu kiến trúc này có một hoặc nhiều máy khách kết nối với máy chủ trung tâm thông qua mạng hoặc Internet

Kiến trúc Client-Server cũng có thể được gọi là mạng mô hình tính toán vì tất cả các yêu cầu và dịch vụ là được phân phối qua mạng

Client:

• Các ứng dụng di động (mobile apps)

• Các ứng dụng trên máy tính bảng (tablet apps)

• Trình duyệt (Windows)

Sever:

• Server của trang web (Web server)

Ưu điêm: Ưu điểm của mô hình client server là với mô hình client server thì mọi thứ dường như đềunằm trên bàn tay của người sử dụng, nó có thể truy cập dữ liệu từ xa (bao gồm các công việc như gửi và nhận file, tìm kiếm thông tin, …) với nhiều dịch vụ đa dạng mà mô hình cũ không thể làm được Mô hình client/server cung cấp một nền tảng lý tưởng cho phép tích hợp các kỹ thuật hiện đại như mô hình thiết kế hướng đối tượng, hệ chuyên gia, hệ thông tin địa lý (GIS)…

26

Nhược điểm: Một trong những vấn đề nảy sinh trong mô hình này đó là tính an toàn và bảo mật thông tin trên mạng Do phải trao đổi dữ liệu giữa 2 máy ở 2 khu vực khác nhau cho nên dễ dàng xảy ra hiện tượng thông tin truyền trên mạng bị lộ

2 Thiết kế giao diện

2.1 Danh sách màn hình

STT Tên màn hình Ý nghĩa/Ghi chú

2 Chọn đề luyện thi Học sinh chọn đề để thi thử

3 Làm bài thi Sau khi học sinh chọn đề thì học sinh bắt đầu làm

bài thi

4 Chấm điểm và xem giải thích Sau khi hoàn thành bài thi, học sinh bắt đầu xem

lời giải của trang web và xem điểm của mình đạt

được

5 Quản lý user Người dung có thể chỉnh sửa chi tiết của mình

6 Màn hình bảng điểm Hiển thị lịch sử làm bài của học sinh

7 Điền thông tin đề Đề thông tin đề thi cần đăng

8 Tạo câu hỏi Sau khi điền thông tin đề sẽ đến tạo câu hỏi, điền

đầy đủ thông tin của từng câu hỏi muốn themvào Đây cũng là làm hình sửa câu hỏi sau khi

click sửa câu hỏi

9 Xem trước đề Sẽ hiển thị toàn bộ câu hỏi để xem qua trước khi

gửi đề cho admin

10 Duyệt đề Sẽ hiển thị toàn bộ đề cần duyệt để hiển thị cho

cá học sinh làm, có thể “xem trước” đề trước khi

27

2.2 Chi tiết màn hình

Màng hình trang chủ website

Màn hình chọn đề(luyện thi)

28

Màn hình làm bài thi( sau khi chọn đề)

29

Màn hình chấm điểm và xem giải thích

30

31

32

Màn hình quản lý user

Màn hình bảng điểm

33

Màn hình điền thông tin đề thi( đăng đề)

34

Màn hình tạo câu hỏi( đăng đề)

35

Màn hình xem trước đề thi( đăng đề)

36

Màn hình duyệt đề(admin)

Màn hình đăng nhập

7

3 Kết luận

3.1 Môi trường phát triển và môi trường triển khai

3.1.1 Môi trường phát triển

• Hệ điều hành: Microsoft Win 10

• Ngôn ngữ: JavaScript

• FameWork: ReactJS

• Cần cài đặt: NodeJS

• Hệ quản trị cơ sở dữ liệu: Firebase

• Công cụ phân tích thiết kế: LucidChart

• Công cụ chạy ứng dụng: Visual studio code

3.1.2 Môi trường triển khai

• Cần cài đặt: NodeJS

• Khi chạy ứng dụng cần chép và cài đặt đầy đủ các tập tin

3.2 Kết quả đạt được

• Website đã thực hiện được những chức năng cơ bản của một website luyện thi lớp 10, giúp cho việc quản lý,học tập của giáo viên, học sinh trở nên dễ quản lý và dễ dàng tiếp cận các dạng đề thi hơn cho học sinh

• Xây dựng được website có giao diện thân thiện với người dùng cũng như dễ dàng tương tác

• Website hỗ trợ những tính năng giúp cho người dùng dễ trải nghiệm việc thi cử bằng hình thức online

3.3 Hướng phát triển

• Sẽ tiếp tục nghiên cứu để phát triển phần mềm hoàn thiện hơn nữa, sửa chửa các sai xót khi website được đưa vào hoạt động thực tiễn

• Thêm các tính năng như chatbox để học sinh dễ trao đổi hơn với giáo viên • Cải tiến chức năng chấm điểm, có thề tự động chấm được các bài làm tự luận.

38