Trung phú NA báo cáo website học tiếng anh online bằng php laravel đồ án

ĐẠI HỌC CÔNG NGHỆ GTVT
KHOA CÔNG NGHỆ THÔNG TIN

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ GIAO THÔNG VẬN TẢI
KHOA CÔNG
THÔNG TIN
Kim NGHỆ
Văn Tiến

PHÂN TÍCH THIẾT KẾ VÀ XÂY DỰNG WEBSITE
HỌC TIẾNG ANH

ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC

ĐỒ TÀI TỐT NGHIỆP ĐẠI HỌC HỆ CHÍNH QUY
Ngành:
tin WEBSITE
PHÂN TÍCH THIẾT
KẾHệ
VÀthống
XÂYthơng
DỰNG
HỌC TIẾNG ANH

Giảng viên hướng dẫn: ThS. Xxx xxx
VĨNH YÊN - 2022


ĐẠI HỌC CÔNG NGHỆ GTVT
KHOA CÔNG NGHỆ THÔNG TIN

Kim Văn Tiến

PHÂN TÍCH THIẾT KẾ VÀ XÂY DỰNG WEBSITE
HỌC TIẾNG ANH

ĐỒ TÀI TỐT NGHIỆP ĐẠI HỌC HỆ CHÍNH QUY
Ngành: Hệ thống thông tin

Cán bộ hướng dẫn: Lê Thị Hà

VĨNH YÊN - 2022


MỤC LỤC

Phần 1: PHẦN MỞ ĐẦU....................................................................................1
1.1. Lý do chọn đề tài.....................................................................................1
1.2. Mục tiêu của đề tài..................................................................................1
1.3. Giới hạn và phạm vi của đề tài..............................................................1
1.4. Kết quả dự kiến đạt được.......................................................................2
Phần 2: PHẦN NỘI DUNG................................................................................3
Chương 1: Cơ sở lý thuyết...............................................................................3
1.1. Phân tích và thiết kế hướng đối tượng:................................................3
1.1.1. Định nghĩa:..........................................................................................3
1.1.2. Phần mềm hỗ trợ thiết kế Draw.io trực tuyến:................................3
1.2. UML trong phân tích thiết kế hướng đối tượng:.................................4
1.2.1. Định nghĩa UML:................................................................................4
1.2.2. Phân tích thiết kế hướng đối tượng sử dụng UML:.........................4
1.3. Ngôn ngữ thiết kế web HTML và CSS:................................................5
1.3.1. HTML:.................................................................................................5

1.3.2. CSS:......................................................................................................5
1.4. Ngôn ngữ kịch bản JavaScript:.............................................................5
1.4.1. Khái niệm:...........................................................................................5
1.4.2. Kết hợp của HTML, CSS và JavaScript:.........................................7
1.4.3. Thư viện JQuery:................................................................................7
1.5. Các ngôn ngữ lập trình PHP:................................................................8
1.5.1. Các khái niệm:.....................................................................................8
1.5.2. Framework Laravel:...........................................................................9
1.5.3. Mơ hình MVC:....................................................................................9
1.6. Hệ quản trị cơ sở dữ liệu MySQL:......................................................10
1.6.1. Các khái niệm:...................................................................................10
1.6.3. MySQL:..............................................................................................11
Chương 2: PHÂN TÍCH HỆ THỐNG.........................................................12


2.1. Khảo sát hệ thống:................................................................................12
2.1.1. Mô tả hệ thống:...............................................................................12
2.1.2. Yêu cầu với hệ thống triển khai:...................................................13
2.2. Biểu đồ Use Case của hệ thống:...........................................................13
2.2.1. Các tác nhân của hệ thống:............................................................13
2.2.2. Use Case tổng quát:........................................................................14
2.2.3. Use Case hệ thống:..........................................................................15
2.2.4. Use Case của tác nhân USER(người dùng):.................................17
2.2.5. Use Case quản lý loại chứng chỉ:...................................................22
2.2.6. Use Case quản lý cấp học:..............................................................24
2.2.7. Use Case quản lý bộ câu hỏi:.........................................................25
2.2.8. Use Case quản lý người dùng:.......................................................27
2.2.9. Use Case quản lý giáo viên:...........................................................28
2.2.10. Use Case quản lý bình luận:..........................................................30
2.2.11. Use Case quản lý silde:...................................................................31

2.2.12. Use Case quản lý tìm kiếm:...........................................................33
2.2.13. Use Case báo cáo thống kê:............................................................35
2.3. Biểu đồ hoạt động của hệ thống:.........................................................36
2.4. Biểu đồ tuần tự của hệ thống:..............................................................41
2.5. Biểu đồ trạng thái:................................................................................48
2.6. Thiết kế cơ sở dữ liệu:..........................................................................52
2.6.1. Biểu đồ lớp:.....................................................................................52
2.6.2. Xác định các bảng thực thể:..........................................................53
Chương 3: Thiết kế hệ thống............................................................................60
3.1. Giao diện quản trị.................................................................................60
3.1.1. Giao diện quản lý từ khóa..............................................................60
3.1.2. Giao diện quản lý danh mục..........................................................60
3.1.3. Giao diện quản lý giáo viên............................................................61
3.1.4. Giao diện quản lý nội dung bài học..............................................61
3.1.5. Giao diện quản lý admin................................................................62


3.2. Giao diện người dùng...........................................................................62
3.2.1. Giao diện trang chủ........................................................................62
3.2.2. Giao diện học phát âm...................................................................63
3.2.3. Giao diện học cấu trúc...................................................................63
3.2.4. Giao diện học cú pháp....................................................................64
3.2.5. Giao diện thảo luận........................................................................64
3.2.6. Giao diện thông tin người dùng....................................................65
Kết luận..............................................................................................................66
Tài liệu tham khảo.............................................................................................67


DANH MỤC HÌNH

Hình 1.1. Minh họa HTML – CSS – JavaScript
Hình 1.2. Mơ hình MVC của Laravel9
Hình 2.1. Các tác nhân của hệ thống
Hình 2.2. Use Case tổng quát
Hình 2.3. Use Case hệ thống
Hình 2.4. Use Case của tác nhân USER(người dùng)
Hình 2.6. Use Case quản lý loại chứng chỉ
Hình 2.11. Use Case quản lý cấp học
Hình 2.7. Use Case quản lý bộ câu hỏi
Hình 2.5. Use Case quản lý người dùng
Hình 2.12. Use Case quản lý giảng viên
Hình 2.9. Use Case quản lý bình luận
Hình 2.10. Use Case quản lý slide
Hình 2.13. Use Case quản lý tìm kiếm
Hình 2.14. Use Case báo cáo thống kê
Hình 2.12. Biểu đồ hoạt động tìm kiếm bộ câu hỏi
Hình 2.13. Biểu độ hoạt động đăng ký
Hình 2.14. Biểu đồ hoạt động đăng nhập
Hình 2.15. Biểu đồ hoạt động thêm bộ câu hỏi
Hình 2.16. Biểu đồ hoạt động cập nhật thơng tin cá nhân
Hình 2.17. Biểu đồ hoạt động bình luận
Hình 2.18. Biểu đồ tuần tự đăng ký
Hình 2.19. Biểu đồ tuần tự đăng nhập
Hình 2.20. Biểu đồ tuần tự xem bộ câu hỏi
Hình 2.21. Biểu đồ tuần tự thêm bộ câu hỏi
Hình 2.22. Biểu đồ tuần tự cập nhật bộ câu hỏi
Hình 2.23. Biểu đồ tuần tự xóa bộ câu hỏi


Hình 2.24. Biểu đồ tuần tự tìm kiếm bộ câu hỏi

Hình 2.25. Biểu đồ tuần tự bình luận
Hình 2.26. Biểu đồ trạng thái Đăng nhập
Hình 2.27. Biểu đồ trạng thái Thêm câu hỏi
Hình 2.28. Biểu đồ trạng thái Cập nhật câu hỏi
Hình 2.29. Biểu đồ trạng thái Xóa câu hỏi
Hình 2.30. Biểu đồ lớp
Hình 3.1. Giao diện quản lý từ khóa
Hình 3.2. Giao diện quản lý danh mục
Hình 3.3. Giao diện quản lý giáo viên
Hình 3.4. Giao diện quản lý nội dung bài học
Hình 3.5. Giao diện quản lý admin
Hình 3.6. Giao diện trang chủ
Hình 3.7. Giao diện học phát âm
Hình 3.8. Giao diện học cấu trúc
Hình 3.9. Giao diện học cú pháp
Hình 3.10. Giao diện thảo luận
Hình 3.11. Giao diện thông tin người dùng


DANH MỤC BẢNG

Bảng 2.1. Bảng users (người dùng)
Bảng 2.2. Bảng admins (quản trị)
Bảng 2.3. Bảng courses (khóa học)
Bảng 2.4. Bảng courses_content (nội dung khóa học)
Bảng 2.5. Bảng courses_video (video khóa học)
Bảng 2.6. Bảng keywords (từ khóa)
Bảng 2.7. Bảng course_keywords (từ khóa khóa học)
Bảng 2.8. Bảng articles (bài viết)
Bảng 2.9. Bảng votes (đánh giá)

Bảng 2.10. Bảng categories (danh mục)
Bảng 2.11. Bảng teacher (giảng viên)
Bảng 2.12. Bảng orders (đơn hàng)
Bảng 2.13. Bảng transactions (giao dịch)
Bảng 2.14. Bảng roles (vai trò)
Bảng 2.15. Bảng permissions (quyền)
Bảng 2.16. Bảng model_has_role
Bảng 2.17. Bảng role_has_permission
Bảng 2.18. Bảng model_has_permission


LỜI CẢM ƠN
Qua một thời gian tìm hiểu và thực hiện đến nay đề tài “Phân tích thiết kế
và xây dựng WEBSITE Học Tiếng Anh” đã hoàn thành. Trong suốt quá trình
thực hiện đề tài, em đã nhận được rất nhiều sự giúp đỡ nhiệt tình của thầy cơ và
các bạn.
Em xin chân thành cảm ơn các thầy cô đã trang bị những kiến thức quý báu
cho em trong suốt q trình học tập tại trường Đại học Giao thơng vận tải . Đặc
biệt là các thầy các cô trong Khoa Cơng nghệ thơng tin đã tận tình giảng dạy, chỉ
bảo, trang bị cho em những kiến thức cần thiết nhất trong suốt quá trình học tập
và nghiên cứu tại khoa.
Em xin cảm ơn giảng viên hướng dẫn Cô Lê Thị Hà đã tận tình hướng dẫn,
chỉ bảo và giúp đỡ em trong suốt thời gian qua. Nhờ vào sự giúp đỡ chỉ bảo của
cơ mà em đã hồn thành đồ án.
Mặc dù em đã cố gắng nỗ lực hết mình để thực hiện để tài nhưng em khơng
thể tránh khỏi thiếu sót, kính mong sự đóng góp và hướng dẫn của các thầy cô.
Em xin chân thành cảm ơn!


LỜI CAM ĐOAN

Em xin cam đoan đồ án này là cơng trình của riêng em, các kết quả có tính
độc lập riêng, không sao chép bất kỳ tài liệu nào và chưa công bố nội dung này
ở đâu. Các tài liệu trong đồ án được sử dụng trung thực, nguồn trích dẫn có chú
thích rõ ràng, minh bạch, có tính kế thừa, phát triển từ các tài liệu, các website.
Em xin hoàn toàn chịu trách nhiệm về lời cam đoan danh dự của em.
Vĩnh Yên, Ngày 28 tháng 05 năm 2022
Sinh viên thực hiện

Kim Văn Tiến


Phần 1: PHẦN MỞ ĐẦU
1.1.

Lý do chọn đề tài
Tiếng anh là ngôn ngữ phổ biến nhất hiện nay và được dùng trong mọi

lĩnh vực của cuộc sống. Việc học và luyện từ vựng tiếng anh là rất cần thiết.
Việc thành thạo ngơn ngữ này có thể giúp chúng ta tìm kiếm các nguồn tài
liệu phục vụ việc học tập tốt hơn, hơn thế nữa người giỏi tiếng anh có rất
nhiều cơ hội tìm kiếm cơng việc. Việc tự học tiếng anh ln là các đề tài
nóng của giới trẻ, có rất nhiều cách tự học tiếng anh khác nhau. Trong thời
điểm dịch bệnh như hiện nay, người dùng ngày càng có xu hướng tìm hiểu
và học tập qua mạng Internet. Tuy nhiên, nhiều phần mềm học tiếng anh
trên thiết bị di động chưa có nhiều, hoặc chưa thật sự đáp ứng được nhu cầu
học của người dùng. Nên việc xây dựng website học tiếng anh với các cấp
độ, các chủ đề đa dạng là rất cần thiết.
Với mục đích giúp người dùng tiếp cận nhiều hơn nữa với các bài học
tiếng anh đa dạng chủ đề và giao lưu với những người học khác, em quyết
định chọn đề tài “Phân tích thiết kế và xây dựng website học tiếng anh”.

Việc xây dựng website này sẽ đáp ứng nhu cầu học tập tiếng anh của mọi
người.
1.2.

Mục tiêu của đề tài

- Trình bày được các vấn đề liên quan đến ngôn ngữ PHP, cơ sở dữ liệu
Mysql, mơ hình MVC...
- Khảo sát thực trạng các chương trình học tiếng anh và nhu cầu học tập
của người dùng hiện nay
- Phân tích hệ thống chương trình bao gồm các giao diện, các activity nhằm
đáp ứng nhu cầu người dùng
- Triển khai và cài đặt chương trình
1


1.3.

Giới hạn và phạm vi của đề tài

- Xây dựng chương trình dựa vào ngơn ngữ lập trình PHP với Framework
Laravel và cơ sở dữ liệu Mysql
- Chương trình tập chung chức năng nghiệp vụ từ khảo sát thực trạng
1.4.

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

- Tìm hiểu nhu cầu, nghiệp vụ tìm kiếm những chương trình học tiếng anh
của người dùng
- Hiểu về ngơn ngữ lập trình PHP và áp dụng cho xây dựng website

- Hoàn thành website học tiếng anh với các tính năng như:
o Admin: thực hiện các chức năng như quản trị hệ thống, quản lý các
chứng chỉ, quản lý bộ câu hỏi, quản lý slide, quản lý người dùng,
quản lý bình luận, quản lý giáo viên, quản lý cấp học, xem thống
kê.
o Người dùng: có thể thực hiện các chức năng như cập nhật thông tin
cá nhân, bình luận, đăng ký, đăng nhập tài khoản trên hệ thống, học
thử theo các cấp độ, đăng ký khóa học, test bài và thi thử.

2


Phần 2: PHẦN NỘI DUNG
Chương 1: Cơ sở lý thuyết
1.1.

Phân tích và thiết kế hướng đối tượng:
1.1.1. Định nghĩa:
- Phân tích thiết kế hướng đối tượng(OOAD) là giai đọan phát triển
một mơ hình chính xác và súc tích của vấn đề, có thành phần là các đối
tượng và khái niệm đời thực, dễ hiểu đối với người sử dụng.
- Năm nguyên tắc trong thiết kế hướng đối tượng:
 Một lớp chỉ nên có một lý do để thay đổi, tức một lớp chỉ nên xử lý một
chức năng đơn lẻ, duy nhất. Nếu đặt nhiều chức năng vào một lớp sẽ dẫn
đến sự phụ thuộc giữa các chức năng với nhau và mặc dù sau đó thay đổi
một chức năng cũng phá vỡ các chức năng còn lại.
Các lớp, module, chức năng nên dễ dàng Mở(Open) cho việc thêm chức
năng mới, và Đóng(Close) cho việc thay đổi.
Lớp dẫn xuất phải có khả năng thay thế được lớp cha.
Chương trình khơng nên buộc phải cài đặt một Interface mà nó khơng sử

dụng đến.

3


Các module cấp cao không nên phụ thuộc vào các module cấp thấp. Cả
hai nên phụ thuộc thông qua lớp trừu tượng. Lớp trừu tượng không nên
phụ thuộc vào chi tiết. Chi tiết nên phụ thuộc vào trừu tượng.
1.1.2. Phần mềm hỗ trợ thiết kế Draw.io trực tuyến:
- Draw.io là một ứng dụng vẽ biểu đồ miễn phí cho phép người dùng
tạo và chia sẻ các sơ đồ trên trình duyệt web. Công cụ trực tuyến này hoạt
động với G Suite / Google Drive và Dropbox. Cũng có thể làm việc trên sơ
đồ ngoại tuyến và lưu trữ cục bộ.
- Draw.io cung cấp giao diện trực quan với tính năng kéo và thả, các
mẫu sơ đồ có thể tùy chỉnh và thư viện hình khối mở rộng. Người dùng có
thể tạo và chỉnh sửa một loạt các sơ đồ, biểu đồ bao gồm biểu đồ luồng,
biểu đồ quy trình, sơ đồ tổ chức, sơ đồ ER, UML, sơ đồ mạng, ...
- Hệ thống chức năng phong phú của draw.io cho phép người dùng
theo dõi và khôi phục các thay đổi, nhập và xuất các định dạng khác nhau,
đồng thời tự động xuất bản và chia sẻ công việc.
1.2.

UML trong phân tích thiết kế hướng đối tượng:
1.2.1. Định nghĩa UML:
- UML là ngơn ngữ mơ hình hố hợp nhất dùng để đặc tả, trực quan
hóa và tư liệu hóa phần mềm hướng đối tượng, có phần chính bao gồm
những ký hiệu hình học, được các phương pháp hướng đối tượng sử dụng
để thể hiện và miêu tả các thiết kế của một hệ thống.
1.2.2. Phân tích thiết kế hướng đối tượng sử dụng UML:
- Phân tích thiết kế hướng đối tượng cần các bản vẽ để mô tả hệ thống

được thiết kế, cịn UML là ngơn ngữ mơ tả các bản vẽ nên cần nội dung thể
hiện. Do vậy, chúng ta phân tích và thiết kế theo hướng đối tượng và sử
dụng UML để hiểu diễn các thiết kế đó nên chúng thường đi đôi với nhau.
OOAD sử dụng UML với các phương thức như sau:
4


View(góc nhìn): Mỗi góc nhìn thể hiện một khía cạnh. Trong phần mềm
OOAD sử dụng UML có các góc nhìn: Về ca sử dụng, về cấu trúc, về
triển khai hệ thống, về các thành phần trong hệ thống
Diagram(bản vẽ): Các bản vẽ dùng để thể hiện các góc nhìn của hệ
thống. Bản vẽ mô tả về các ca sử dụng, mô tả cấu trúc hệ thống, mô tả sự
tương tác của các đối tượng trong hệ thống...
Notations(các ký hiệu): Các kí hiệu để vẽ, nó là từ vựng trong ngơn ngữ
tự nhiên.
Mechanisms(các quy tắc): Mỗi bản vẽ có quy tắc riêng và cần nắm được
quy tắc đó để tạo nên bản thiết kế đúng và nhất quán.

1.3.

Ngôn ngữ thiết kế web HTML và CSS:
1.3.1. HTML:
- HTML(Hypertext Markup Language) là mã được dùng để xây dựng
nên cấu trúc và nội dung của trang web. Ví dụ, nội dung có thể được cấu
thành bởi một loạt các đoạn văn, một danh sách liệt kê, hoặc sử dụng
những hình ảnh và bảng biểu... Hiện nay, phiên bản mới nhất của HTML là
HTML5.
1.3.2. CSS:
- CSS(viết tắt của Cascading Style Sheets) dùng để miêu tả cách trình
bày các tài liệu viết bằng ngơn ngữ HTML và XHTML. CSS được hiểu đơn

giản đó là cách mà chúng ta thêm các kiểu hiển thị (font chữ, màu sắc, kích
thước...) cho một tài liệu web.
- Tác dụng chính của CSS:

5


Hạn chế tối thiểu việc làm rối HTML của trang Web bằng các thẻ quy
định kiểu dáng(chữ đậm, in nghiêng,...), giúp mã nguồn của trang Web
trở nên gọn gàng hơn.
Tách biệt nội dung trang Web và định dạng hiển thị, dễ dàng cho việc
thay đổi.
Tạo ra các kiểu dáng áp dụng được cho nhiều trang Web, tránh lặp lại
việc định dạng cho các trang Web giống nhau.
1.4.

Ngôn ngữ kịch bản JavaScript:

1.4.1. Khái niệm:
- Javascript là một ngơn ngữ lập trình của HTML và ứng dụng Web.
Nó nhẹ và được sử dụng phổ biến nhất, như một phần của các trang web.
Chúng cho phép client-server script tương tác với người sử dụng và tạo các
trang web động. Nó là một ngơn ngữ chương trình thơng dịch với các khả
năng hướng đối tượng.
- Một số ưu điểm của JavaScript:
Tiêt kiệm băng thông máy chủ:
Javascript sử dụng trong thiết kế website có thể giúp tiết kiệm băng
thông máy máy chủ vô cùng tốt bởi chúng được chạy trực tiếp trên máy
của người dùng.
Các dịng Script đều được thực thi trên trình duyệt người dùng để gia

tăng hiệu suất, kéo dài tuổi thọ máy chủ và tiết kiệm diện tích băng
thơng.
Linh hoạt vận hành, tương thích tốt:
Để thực thi, trình duyệt web chỉ cần tải file JavaScript về máy chủ từ một
tên miền riêng biệt hoặc nhúng thẳng vào file HTML và chạy mà không

6


cần tải thêm. Javascript có thể chạy được trên hầu hết các trình duyệt phổ
biến hiện nay như Cốc Cốc, Chrome, Firefox, Safari...
Khơng những thế, hầu hết các trình duyệt web đều có tích hợp sẵn trình
thơng dịch ngơn ngữ JavaScript, đảm bảo người dùng có thể sử dụng
ngay mà khơng mất cơng tải về trình duyệt, giảm tỷ lệ thực thi các chức
năng của JavaScript. Điều này vô cùng tiện lợi cho người dùng khi
khơng có mạng.
Dễ dàng kiểm tra, xử lý vấn đề:
Với lợi thế có nhiều trình duyệt hỗ trợ nên việc kiểm tra và xử lý vấn đề
dễ dàng hơn. Đa số các trình duyệt web hiện nay đều có cài sẵn các cơng
cụ xử lý lỗi Javascript trong bảng điều khiển trình duyệt.
Javascript sở hữu cấu trúc dễ đọc với cácnguyên tắc rõ ràng nên việc xác
định và gỡ lỗi trở nên đơn giản hơn nhiều.
Nâng cao trải nghiệm người dùng:
Website sử dụng ngôn ngữ lập trình giúp thu hút người dùng bởi những
tính năng hay ho, hình ảnh sinh động hấp dẫn, chức năng lướt và tương
tác nhanh nhạy. Nhờ những tính năng đó, người dùng cảm thấy thoải
mái, thích thú và tin dùng trang web hơn.
1.4.2. Kết hợp của HTML, CSS và JavaScript:
- Một website thường có 3 phần cơ bản gồm HTML, CSS và
Javascript. Trong đó, HTML quyết định nội dung và cấu trúc trang web;

CSS quyết định màu sắc, hình dáng, kiểu chữ,… Hầu hết các thay đổi của
HTML và CSS đều được thể hiện dưới dạng tĩnh, không thể thực hiện các
hành động với chuyển động bắt mắt như xoay hình, kiểm tra thơng tin hợp
lệ, hiển thị thơng báo người dùng...
- Tất cả các hành động này được chuyển thể từ trạng thái tĩnh sang
trạng thái động nhờ vào thành phần thứ 3 là Javascript. Ba thành phần này
7


kết hợp với nhau tạo nên website hoàn chỉnh với giao diện (UI) và trải
nghiệm người dùng (UX) chất lượng.

Hình 1.1. Minh họa HTML – CSS – JavaScript

1.4.3. Thư viện JQuery:
- JQuery là một thuật ngữ được dùng rất nhiều trong thời đại công
nghệ hiện nay. Kể từ khi phát triển 2.0, cụm từ này đã được dùng khá phổ
biến. Vậy JQuery là gì? JQuery là một thư viện được xây dựng trên
Javascript. Chúng được tạo ra với mục đích hỗ trợ các lập trình viên giải
quyết các khó khăn khi sử dụng Javascript. JQuery được tích hợp từ nhiều
module chuyên biệt, bao gồm cả module hiệu ứng, đến module truy cấp
selector.
- Có thể hiểu JQuery là thư viện Javascript đa tính năng, nhanh chóng
và tiện lợi. Thư viện này được tạo bởi John Resig với phương châm ưu
việt: “Write less, do more” - Viết ít hơn, năng suất hơn. JQuery đơn giản
hóa các thao tác duyệt tài liệu HTML, tăng cường tương tác Ajax để có thể

8

nâng cao tối đa hiệu quả phát triển Website. Hiện nay, công cụ hỗ trợ này
được sử dụng vô cùng rộng rãi.
- Một số tính năng quan trọng được hỗ trợ bởi JQuery:
Thao tác DOM: JQuery giúp dễ dàng lựa chọn các phần tử DOM để
duyêt một cách dễ dàng như sử dụng CSS, và chỉnh sửa nội dung của
chúng sử dụng Selector mã nguồn mở.
Hỗ trợ AJAX: JQuery giúp phát triển một site giàu tính năng và phản hồi
tốt bởi công nghệ AJAX.
Xử lý sự kiện: JQuery giúp tương tác người dùng tốt hơn bằng việc xử lý
các sự kiện đa dạng mà không làm cho HTMl code rối tung lên.
Hiệu ứng động: JQuery đi kèm rất nhiều hiệu ứng đẹp có thể sử dụng
cho các website.
Gọn nhẹ: JQuery là thư viện gọn nhẹ, nó chỉ có kích cỡ khoảng 19KB.
Hỗ trợ hầu hết các trình duyệt hiện đại: JQuery hỗ trợ hầu hết các trình
duyệt hiện đại, làm việc tốt trên IE 6.0+, Safari 3.0+, Opera 9.0+, FF
2.0+ và Chrome.
Cập nhật và hỗ trợ các công nghệ mới nhất: JQuery hỗ trợ CSS3 Selector
và cú pháp XPath cơ bản.
1.5.

Các ngơn ngữ lập trình PHP:
1.5.1. Các khái niệm:
- PHP là ngôn ngữ script được tạo cho các giao tiếp phía server. Do
đó, nó có thể xử lý các giao tiếp phái server như thu thập dữ liệu, biểu mẫu,
quản lý file trên server, sửa đổi cơ sở dữ liệu và nhiều hơn.

9


1.5.2. Framework Laravel:

- Framework chính là một thư viện với các tài nguyên có sẵn cho từng
lĩnh vực để lập trình viên sử dụng thay vì phải tự thiết kế. Với Framework,
lập trình viên chỉ cần tìm hiểu và khai thác những tài nguyên đó, gắn kết
chúng lại với nhau và hồn chỉnh sản phẩm của mình.
1.5.3. Mơ hình MVC:
- MVC (Model-View-Controller) là mẫu kiến trúc phần mềm trên máy
tính nhằm mục đích tạo lập giao diện cho người dùng. Hệ thống MVC
được chia thành ba phần có khả năng tương tác với nhau và tách biệt các
nguyên tắc nghiệp vụ với giao diện người dùng. Ba thành phần ấy bao
gồm:
Controller: Giữ nhiệm vụ nhận điều hướng các yêu cầu từ người dùng và
gọi đúng những phương thức xử lý chúng.
Model: Là thành phần chứa tất cả các nghiệp vụ logic, phương thức xử
lý, truy xuất database, đối tượng mô tả dữ liệu như các Class, hàm xử
lý…
View: Đảm nhận việc hiển thị thông tin, tương tác với người dùng, nơi
chứa tất cả các đối tượng GUI như textbox, images…

10


Hình 1.2. Mơ hình MVC của Laravel

- Mơ hình MVC phù hợp với các dự án với các đội ngũ làm việc độc
lập với nhau, như vậy các công việc đều có thể được thực hiện một cách
linh hoạt.
- Như vậy, mơ hình này nổi bật nhờ những ưu điểm:
Hỗ trợ q trình phát triển nhanh chóng:
Các phần hoạt động độc lập, nên các lập trình viên có thể làm việc đồng
thời trên từng bộ phận khác nhau của mô hình này. MVC giúp tiết kiệm

rất nhiều thời gian.
Khả năng cung cấp đồng thời nhiều View:
Với mơ hình MVC, có thể tạo ra đồng thời nhiều khung View cho
Model.
Hỗ trợ các kỹ thuật khơng đồng bộ:
MVC có thể hoạt động trên nền tảng JavaScript. Có nghĩa là các ứng
dụng MVC có thể hoạt động với các file PDF, các trình duyệt web cụ thể
và cả widget máy tính.
11


Dễ dàng thao tác chỉnh sửa:
Model hoạt động tách biệt với View, đồng nghiac với việc có thể đưa ra
các thay thế, chỉnh sửa hoặc cập nhật dễ dàng ở từng bộ phận.
Giữ ngun trạng thái data:
Mơ hình MVC truyền lại dữ liệu nhưng không định dạng lại dữ liệu. Do
đó, các dữ liệu này cố thể được dùng lại cho các thay đổi sau.
Hỗ trợ nền tảng phát triển SEO:
Với mơ hình MVC, có thể dễ dàng tạo ra các mã SEO URL để thu hút
lượng truy cập đối với ứng dụng bất kỳ.
1.6.

Hệ quản trị cơ sở dữ liệu MySQL:
1.6.1. Các khái niệm:
- Cơ sở dữ liệu (Database) là một tập hợp các dữ liệu có tổ chức,
thường được lưu trữ và truy cập điện tử từ hệ thống máy tính. Khi cơ sở dữ
liệu phức tạp hơn, chúng thường được phát triển bằng cách sử dụng các kỹ
thuật thiết kế và mơ hình hóa chính thức.
- Hệ quản trị cơ sở dữ liệu (viết tắt của Database Management
System) là hệ thống được thiết kế để quản lý một khối lượng dữ liệu nhất

định một cách tự động và có trật tự. Các hành động quản lý bao gồm chỉnh
sửa, xóa, lưu và tìm kiếm thơng tin trong một nhóm dữ liệu nhất định.
- Nói ngắn gọn, Hệ quản trị cơ sở dữ liệu đề cập đến công nghệ lưu trữ
và truy xuất dữ liệu của người dùng với hiệu quả tối đa cùng với các biện
pháp bảo mật thích hợp.
1.6.3. MySQL:
- MySQL là hệ quản trị cơ sở dữ liệu sử dụng mã nguồn mở phổ biến
nhất thế giới và được các chuyên gia lập trình rất ưa chuộng trong quá trình
phát triển web, phát triển ứng dụng của mình. Với tốc độ và tính bảo mật
cao, MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên
Internet.
- Một số lý do chính khiến MySQL trở nên quan trọng:
Linh hoạt và dễ dùng:

12


Có thể sửa sourch code để đánh ứng nhu cầu sử dụng mà khơng phải
thanh tốn thêm chí phí nào, q trình cài đặt cũng đơn giản.
An tồn:
An tồn dữ liệu luôn là vấn đề quan trọng nhất khi chọn phần mềm
RDBMS. Với hệ thống phân quyền truy cập và quản lý tài khoản,
MySQL đặt tiêu chuẩn bảo mật rất cao.
Tốc độ rất nhanh:
Đánh giá chung của các nhà phát triển đều cho rằng MySQL là cơ sở dữ
liệu nhanh nhất. Đây là nơi để các website có thể trao đổi thường xuyên
các dữ liệu bởi nó có engine xử lý tốc độ cao.
Khả năng chèn dữ liệu cực nhanh và hỗ trợ mạnh mẽ các chức năng
chuyên dụng cho trang web.
Hiệu năng cao:

Bất kể lưu trữ dữ liệu lớn của các trang thương mại điện tử hoặc những
hoạt động kinh doanh lớn liên quan đến công nghệ thông tin, MySQL
cũng có thể đáp ứng với tốc độ cao và mượt mà.

Chương 2: PHÂN TÍCH HỆ THỐNG
2.1.

Khảo sát hệ thống:
2.1.1. Mô tả hệ thống:
Giáo dục ngày càng phát triển để đáp ứng với sự thay đổi của cơng
nghệ mới. Ngồi hình thức học tập theo phương thức truyền thống, thì hình
thức học và làm bài tập trực tuyến qua Internet ngày càng phổ biến. Nhất là
13


trong tình hình dịch bệnh Covid-19 phức tạp như hiện nay. Website học
tiếng anh trực tuyến ra đời, nó đáp ứng hầu hết nhu cầu học tập và nâng cao
vốn từ tiếng anh cho mọi người.
Website cung cấp thông tin các topic(chủ đề) bao gồm một số các
topic như chào hỏi, mua sắm, hỏi đường… với các mẫu câu thường dùng
trong giao tiếp thường ngày. Người dùng có thể lựa chọn các topic để học
tập. Mỗi topic sẽ có nhiều cấp độ học với các bộ câu hỏi khác nhau, kết
thúc từng giai đoạn của topic, các cấp độ học sẽ nâng cao dần. Mỗi topic sẽ
có tiêu đề, các cấp độ và tổng số câu hỏi. Mỗi câu hỏi sẽ lưu các thông tin
như nội dung câu hỏi, câu trả lời đúng, topic của câu hỏi.
Để có thể học trên website người dùng cần đăng nhập, nếu chưa có tài
khoản có thể thực hiện đăng ký. Đăng nhập website thành cơng, người
dùng có thể thực hiện đăng ký các topic bài học muốn học. Sau khi học
xong người dùng có thể xem các thơng tin về tiến độ học, cũng như thơng
tin cá nhân của mình trên trang chủ. Sau khi học các topic, người dùng có

thể làm các bài test theo từng topic và thi thử. Hệ thống sẽ thực hiện chấm
điểm và trả về kết quả cho người dùng và lưu thông tin các bài test, thi thử
của người dùng.
Để nâng cao chất lượng, website đã chọn lọc nhưng topic hay, gần gũi
với tất cả mọi người, tích hợp nhiều hình thức học khác nhau như nghe,
nói, viết… giúp bổ sung đầy đủ nhưng kĩ năng người dùng cịn thiếu sót.
Website phù hợp với mọi người, đặc biệt với những người bận rộn và phù
hợp trong tình hình dịch bệnh hiện nay.
2.1.2. Yêu cầu với hệ thống triển khai:
Một số yêu cầu rút ra:

 Về thông tin:
- Các thông tin phải được lưu trữ lâu dài, đầy đủ và chính xác.

14


- Các thơng tin được nhập vào phải chính xác, đúng định dạng và đầy đủ.

 Về quy trình nghiệp vụ:
- Kiểm tra các lỗi cập nhật thông tin và có phản hồi tới người dùng.
- Phân quyền trang người dùng và trang quản lý.
- Người dùng có thể xem nội dung và học các loại chứng chỉ, xem tiến
trình học của mình và bình luận giao lưu với mọi người.
- Quản lý có thể theo dõi thơng tin người dùng, danh sách các loại chứng
chỉ, bộ câu hỏi, bình luận và xem các báo cáo thống kê.

 Về website:
- Giao diện thân thiện, dễ sử dụng, cập nhật thường xuyên các thông tin
loại chứng chỉ và bộ câu hỏi.

- Tương thích đa thiết bị.

2.2.

Biểu đồ Use Case của hệ thống:
2.2.1.

Các tác nhân của hệ thống:

Hình 2.1. Các tác nhân của hệ thống

2.2.2. Use Case tổng quát:
15