TỔNG QUAN
Lý do chọn đề tài
Với sự phát triển của khoa học kỹ thuật ngày nay, con người đã đạt được những thành tựu mới trong tất cả các lĩnh vực Đặc biệt là ngành công nghệ thông tin với việc tạo ra các phần mềm, những trang website hữu ích cho cuộc sống Trong đó, những trang website đang ngày một phổ biến, chỉ với việc sử dụng Internet ta dễ dàng tiếp cận được các thông tin mà chúng ta chưa biết được, đó chính là cơ sở để nhóm quyết định xây dựng website để hướng đến người dùng một cách nhanh chóng hiệu quả.
Lịch sử là vô cùng quan trọng đối với một đất nước, vì đó là sự đấu tranh và phát triển của đất nước đó, giúp ta biết được gốc gác tổ tiên, các nhà khoa học, vĩ nhân, vị tướng,… Nhưng ở Việt Nam hiện nay có nhiều học sinh không thích học môn Lịch
Sử dẫn đến hiện trạng “Lịch sử là môn có kết quả thi thấp nhất trong tất cả các môn thi của kỳ thi tốt nghiệp THPT năm 2021, khi có 52,03% số thí sinh có điểm thi dưới trung bình” (thống kê theo Bộ Giáo dục và Đào tạo) Hơn nữa học sinh thì bị nhiễu loạn thông tin khi tiếp thu kiến thức qua phim ảnh, trên mạng một cách thiếu chọn lọc.Chính điều đó dẫn học sinh đến hệ quả là học vẹt, học thuộc lòng nên không thể hệ thống hóa kiến thức và sự kiện Lịch sử.
Mục tiêu
Nhằm giúp học sinh dễ dàng tiếp cận và hứng thú học Lịch sử, đồng thời nâng cao năng lực tự học và sáng tạo của học sinh về bộ môn Lịch sử nhóm nghiên cứu đã
“Thiết kế website tìm hiểu và kiểm tra kiến thức Lịch sử Việt Nam”.
Xây dựng website tra cứu thông tin lịch sử và kiểm tra lịch sử Hệ thống hóa kiến thức lịch sử một cách trực quan, chính xác Giúp học sinh dễ dàng tiếp cận và hứng thú với môn Lịch sử thông qua hình ảnh và video Nâng cao năng lực và sáng tạo của học sinh Giải quyết tối ưu hóa thiết kế giao diện hiển thị nội dung cho người dùng, người tạo bài viết, người duyệt bài viết, quản trị trang website Lịch sử.
Công nghệ sử dụng
Xây dựng trang Lịch sử Việt Nam có các chức năng: trang nhân vật lịch sử, trang di tích lịch sử, trang phim truyện, sách, tính năng tìm kiếm, trang kiểm tra kiến thức lịch sử.
Sử dụng công nghệ hỗ trợ cho thiết kế trang web: HTML, JavaScript, CSS, Python, Framework Django, Ckeditor.
CỞ SỞ LÝ THUYẾT
Python
Python là ngôn ngữ lập trình thông dịch (interpreted), hướng đối tượng (objectoriented) và là ngôn ngữ bậc cao (high-level) ngữ nghĩa động (dynamic semantics) Python hỗ trợ các module và gói packages), khuyến khích chương trình module hóa và tài sử dụng mã Python được sáng tạo bởi Guido Van Rossum vào năm 1991.
Python có nguồn gốc từ nhiều ngôn nhữ khác, bao gồm ABC, Modula-3, C, C+ +, Algol-68, SmallTalk và Unix shell và các ngôn ngữ script khác.
Tên của ngôn ngữ Python này không liên quan đến loài rắn cùng tên (“rắn” nghĩa tiếng anh là “python”), mà nó là tên của một đoàn hài kịch nổi tiếng của Anh – Monty Python (từ những năm 19070) Bản thân Guido Van Rossum là một người hâm mộ lớn Monty Python’s Flying Circus.
Phiên bản Python 1.0 được phát hành vào tháng 1 năm 1994 Các tính năng mới chính trong bản phát hành này là các công cụ lập trình chức năng lamda, map, filter và reduce.
Phiên bản Python 2.0 được phát hành vào ngày 16 tháng 10 năm 2000 với nhiều tính năng mới quan trọng, bao gồm một bộ thu gom rác phát hiện chu kỳ (ngoài việc đếm tham chiếu) để quản lý bộ nhớ và hỗ trợ Unicode Tuy nhiên, thay đổi quan trọng nhất nhất là đối với quy trình phát triển, với dự chuyển sang một suy trình minh bạch hơn và được cộng đồng hỗ trợ.
Python 3.0 (còn được gọi là “Python 3000” hoặc “Py3k”) là một phiên bản mới của ngôn ngữ này và không tương thích với dòng phát hành 2.x Ngôn ngữ này phần lớn giống nhau, nhưng nhiều chi tiết, đặc biệt là cách các đối tượng được xây dựng như từ điển và chuỗi hoạt động, đã thay đổi đáng kể và rất nhiều tính năng đã lỗi thời cuối cùng cũng đã bị loại bỏ.
Python là một ngôn ngữ lập trình đa mẫu hình, hỗ trợ hoàn toàn lập trình hướng đối tượng và lập trình cấu trúc Nhiều tính năng của nó cũng hỗ trợ lập trình hàm và lập trình hướng khía cạnh Python được thiết kế để dễ đọc và viết, với cú pháp rõ ràng và đơn giản.
Python hoạt động bằng cách biên dịch mã nguồn thành bytecode, sau đó bytecode được thực thi bởi một máy ảo Python Điều này cho phép Python hoạt động trên nhiều nền tảng khác nhau.
Python có nhiều ưu điểm như:
- Dễ đọc và dễ học: Python có cú pháp đơn giản và rõ ràng, giúp người mới bắt đầu dễ dàng tiếp cận và học hỏi.
- Giảm chi phí bảo trì: Do tính đơn giản của nó, Python giúp bảo trì ứng dụng dễ dàng hơn và do đó, giảm chi phí liên quan.
- Tránh tác hại từ lỗi phần mềm: Python không để lỗi mã xảy ra phân đoạn trong ứng dụng.
- Khả năng ứng dụng rộng rãi: Python có thể được sử dụng trong nhiều lĩnh vực khác nhau như lập trình máy chủ web, tạo mẫu, phát triển trò chơi, khoa học dữ liệu và học máy.
Mặc dù Python có nhiều ưu điểm, nhưng cũng có một số nhược điểm:
- Không có khả năng mở rộng và quản lý tốt như Java khi làm việc với các dự án lớn.
- Cơ chế Global Interpreter Lock (GIL) khiến việc sử dụng đa luồng đòi hỏi đa tiến trình.
Mô hình MVT
2.2.1 Tổng quan mô hình MVT
MVT là viết tắt của cụm từ “Model-View-Template “ Đây là mô hình thiết kế được sử dụng trong kỹ thuật phần mềm MVT là một mẫu kiến trúc phần mềm để tạo lập giao diện người dùng trên máy tính MVT chia thành ba phần được kết nối với nhau và mỗi thành phần đều có một nhiệm vụ riêng của nó và nó đọc lập với các thành phần khác Tên gọi 3 thành phần:
- View (V): View is a request function process, this function nhận HTTP yêu cầu và trả về HTTP phản hồi Xem dữ liệu truy cập cần thiết để trả lời các yêu cầu thông qua các mô hình và quyền định dạng của phản hồi cho mẫu.
- Model (M): Model is the Python object has the task of the data structure of the application and cung cấp cơ chế quản lý (thêm, sửa, thay đổi, xóa) và truy vấn các bản ghi trong cơ sở dữ liệu.
- Template (T): Template is a file a file text set up the structure or layout of file(Chẳng hạn như HTML trang) Cùng với chỗ giữ, nó được sử dụng để thực hiện một nội dung.
Hình 2: Mô hình MVT MVT là viết tắt của Model-View-Template Mẫu là một tệp HTML được trộn với DTL (Ngôn ngữ mẫu Django) Django chăm sóc phần Bộ điều khiển, đây là mã điều khiển sự tương tác giữa hai phần khác, Model và View Về phương thức hoạt động sẽ giống với mô hình MVC, trong đó V (View) sẽ tương đương với C (Controller), T (Template) sẽ tương đương với V (View) ở các framework khác.
2.2.2 Ưu điểm mô hình MVT
- Dễ dàng mở rộng, tái sử dụng code (nhờ khả năng kế thừa tuyệt vời)
- Có thể lập trình hướng đối tượng dễ dàng (View kế thừa nhiều class)
- Xử lý truy vấn HTTP riêng ứng với từng phương thức GET, POST, v.v
- Django xây dựng sẵn nhiều class cho các tác vụ thông thường, thời gian code sẽ giảm đi đáng kể
2.2.3 Nhược điểm mô hình MVT
- Rất khó để đọc code, vì việc kế thừa khiến các class View chỉ còn rất ít code.
- Luồng dữ liệu không tường minh, bởi sử dụng các class kiểu kế thừa khiến nhiều xử lý không được thể hiện trên code.
- Những class được xây dựng sẵn là trong suốt với người dùng, rất khó debug.
- Các xử lý phức tạp cần ghi đè phương thức, hoặc sử dụng các decorators (yêu cầu import từ bên ngoài).
Framework Django
Django là một web framework miễn phí mã nguồn mở được viết bằng Python. Django sử dụng mô hình Model-View-Control (MVC) và được phát triển bởi Django Software Foundation (DSF) – một tổ chức phi lợi nhuận độc lập Mục tiêu chính của Django là đơn giản hóa việc tạo các website phức tạp có sử dụng cơ sở dữ liệu Một số website phổ biến được xây dựng từ Django là Pinterest, Instagram, Mozilla, và Bitbucket.
Django có nhiều tính năng như:
- Bảng admin hay còn gọi là admin panel để giúp lập trình viên quản trị dễ hơn so với các framework như Laravel hay Yii.
- Sử dụng cấu trúc US MVC.
- Bao gồm Batteries (tất cả những yếu tố cần để giải quyết các case thường thấy).
- Sở hữu Python Unit Test Framework.
2.3.2 Các tính năng của Django
Các tính năng chính của Django bao gồm:
- Giúp xây dựng cấu trúc URLs đơn giản nhưng mạnh mẽ.
- Hệ thống xác nhận thông tin người dùng có sẵn.
- Cơ sở dữ liệu hướng đối tượng giúp lưu trữ và phục hồi dữ liệu.
- Trình quản lý admin tự động giúp sửa, thêm và xóa các tính năng.
- Hệ thống cache mạnh mẽ.
Framework CKEditor
CKEditor (còn gọi là FCKeditor) là một trình soạn thảo mã nguồn mở theo kiểu WYSIWYG (tay làm - mắt thấy) của CKSource Chương trình này có thể tích hợp vào các website mà không cần cài đặt.
Cũng giống các trình soạn thảo dành cho web khác, CKEditor sử dụng JavaScript là nền tảng, riêng việc tương tác với server thì CKEditor sử dụng các ngôn ngữ sau: Active-FoxPro, ASP, ASP.NET, ColdFusion, Java, JavaScript, Lasso, Perl, PHP và Python.
2.4.2 Các ứng dụng phổ biến của CKEditor
CKEditor là một trình soạn thảo văn bản HTML sẵn sàng cho sử dụng được thiết kế để đơn giản hóa việc tạo ra nội dung web Đó là một trình soạn thảo WYSIWYG mang lại các tính năng xử lý văn bản phổ biến trực tiếp đến trang web của bạn CKEditor có thể được tích hợp vào các website để cung cấp cho người dùng một công cụ soạn thảo văn bản đầy đủ tính năng.
Một số ứng dụng phổ biến của CKEditor bao gồm:
- Tạo và chỉnh sửa nội dung cho các trang web và blog.
- Tạo và chỉnh sửa email và tin nhắn.
- Tạo và chỉnh sửa các tài liệu và báo cáo.
MySql
MySQL chính là hệ quản trị cơ sở dữ liệu mã nguồn mở Relational Database Management System – RDBMS hiện nay được sử dụng phổ biến trên phạm vi toàn cầu.
Hệ quản trị cơ sở dữ liệu này hoạt động dựa trên mô hình tiêu chuẩn là Client(Máy khách) – Server (Máy chủ) Nó được tạo bởi MySQL AB, là một công ty củaThụy Điển thành lập vào năm 1995 Năm 2000, MySQL đã phát hành phần mềm dựa trên các điều khoản của GPL đi theo hướng mã nguồn mở Hiện nay, MySQL thuộc sở hữu của Tập đoàn Oracle.
2.5.2 Tại sao cần sử dụng MySql
MySQL là một hệ thống quản trị cơ sở dữ liệu mã nguồn mở phổ biến hàng đầu trên thế giới và đặc biệt được ưa chuộng trong quá trình xây dựng, phát triển ứng dụng. Đây là hệ quản trị cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, có khả năng thay đổi mô hình sử dụng phù hợp với điều kiện công việc khả chuyển MySQL hoạt động trên nhiều hệ điều hành, cung cấp một hệ thống lớn các hàm tiện ích rất mạnh Với tốc độ và tính bảo mật cao, MySQL thích hợp với các ứng dụng có truy cập cơ sở dữ liệu trên internet.
KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU
Khảo sát hiện trạng
3.1.1 Trang website người kể sử
Hình 6: Giao diện trang chủ người kể sử
Hình 7: Giao diện trang nhân vật lịch sửNguồn: https://nguoikesu.com/
- Có khả năng responsive trên mobile
- Cung cấp màn hình giao diện tương tác dễ dàng cho những người mới dùng lần đầu tiên.
- Cung cấp đầy đủ các danh mục: dòng lịch sử, tư liệu, nhân vật, di tích, ngày nay, giới thiệu sách, Q&A, trắc nghiệm, video.
- Nội dung cung cấp trên tảng website khá chi tiết và rõ ràng.
- Không có tính năng đăng nhập
- Nội dung hiển thị trên nền trang website không được đầu tư đẹp mắt, làm người dùng cảm thấy không thích thú tham quan nội dung trang.
- Nội dung hiển thị phần mô tả thông tin trên mobile không đầy đủ để người dùng xem và đọc và cỡ chữ quá to.
- Không cung cấp hệ thống song ngữ.
- Không có tính năng đăng nhập.
- Nút nhấn chọn danh mục bị liệt khi ở trên giao diện mobile.
- Không có tính năng đăng nhập.
3.1.2 Trang webiste nghiên cứu lịch sử
Hình 8: Giao diện trang nghiên cứu lịch sử
Hình 9: Giao diện trang nghiên cứu lịch sử Việt NamNguồn: https://nghiencuulichsu.com/
- Bố cục đơn giản, hiển thị nội dung khá đầy đủ.
- Có khả năng responsive trên mobile.
- Cung cấp màn hình giao diện tương tác dễ dàng cho những người mới dùng lần đầu tiên.
- Cung cấp danh mục lịch sử phương Đông, phương Tây, lịch sử Việt Nam.
- Chức năng hiển thị các tác giả gửi bài đăng.
- Hiển thị cỡ chữ khá nhỏ.
- Phần hiển thi bài viết mới chỉ chỉ có chữ và thêm hover màu sắc khi đưa chuột kéo đến, làm rất rồi mắt và không có hiển thị hình ảnh của bài viết mới.
- Không có tính năng kiểm tra kiến thức lịch sử.
- Không có tính năng đăng nhập.
- Chỉ xem được nội dung tổng thể, không thể đào sâu vào nhân vật lịch sử, di tích.
- Không có tính năng giới thiệu sách, truyện, phim có liên quan đến lịch sử.
Wikipedia là dự án bách khoa toàn thư mở, đa ngôn ngữ mà mọi người đều có thể tham gia đóng góp Mục tiêu của Wikipedia là xây dựng một bách khoa toàn thư hoàn chỉnh, chính xác và trung lập Sự phát triển của Wikipedia tiếng Việt phụ thuộc vào sự tham gia của bạn.
Một trong những ưu điểm của Wikipedia là nó hoàn toàn miễn phí và cung cấp thông tin về hàng triệu chủ đề cho bất kỳ ai có khả năng truy cập Internet Nó được cập nhật liên tục theo giờ So sánh với các cuốn sách bách khoa toàn thư, chúng thường được cập nhật hàng năm Wikipedia là một nơi tuyệt vời để bắt đầu nghiên cứu của bạn, cung cấp thông tin nền về chủ đề của bạn và các từ khóa có thể giúp bạn tiến hành nghiên cứu sâu hơn ở nơi khác Các nguồn được sử dụng trong các bài viết được trích dẫn, cho phép điều tra thêm vào bất kỳ chủ đề nào.
Một trong những nhược điểm của Wikipedia là bất kỳ ai cũng có thể tạo, chỉnh sửa hoặc xóa các bài viết trên Wikipedia Các bài viết trên Wikipedia không thể được coi là học thuật, vì chúng ta không biết gì về người đóng góp Các bài viết đang được xây dựng, có nghĩa là thông tin đang liên tục thay đổi Khi một bài viết được xuất bản lần đầu tiên,thông tin có thể dao động giữa các quan điểm trước khi đạt được một tông trung lập Đôi khi các bài viết bị phá hoại, dù cho vui vẻ, như một trò lừa đảo hoặc vì chủ đề gây tranh cãi Đối tượng người đọc có thể thay đổi - một số bài viết được viết từ quan điểm của người trong cuộc, với ngôn ngữ kỹ thuật cao, trong khi một số được viết cho một khán giả chung hơn Điều này có thể cả gây khó chịu và có giá trị tùy thuộc vào điều mà người ta đang tìm kiếm và cảnh báo rằng thông tin có thể không nhất quán.
3.1.4 Kết luận về những tiêu chí cần đạt được
- Đa số các trang website đều thể hiện nội dung lịch sử Việt Nam, đặc biệt tập trung vào nội dung lịch sử được phổ cập ở sách giáo khoa Trung học cơ sở và Trung học phổ thông được mở rộng thêm nội dung để người dùng có thêm nhiều thông tin.
- Nội dung được kiểm duyệt bởi các nhà soạn sử nên khá chi tiết khi tìm hiểu Dữ liệu về lịch sử của các trang website rất lớn, cho thấy có người dùng quan tâm đến việc tìm hiểu lịch sử Việt Nam.
- Các trang đều có các tính năng dòng lịch sử, giúp người dùng có thể liệt kê được các sự kiện nào có trước và có sau.
- Các trang đều không có tính năng đăng nhập.
- Một số trang không có tính năng kiểm tra kiến thức lịch sử, có thì nội dung đề rất ít.
- Các trang hầu hết không đào xâu vào nhân vật lịch sử, di tích lịch sử, giới thiệu sách, giới thiệu phim truyện nhân vật lịch.
3.1.4.3 Mong muốn của nhóm sau khi khảo sát
- Tạo ra một trang webiste lịch sử cung cấp đầy đủ các tính năng cơ bản như trang nhân vật lịch sử, trang di tích lịch sử, trang phim truyện, sách, tính năng tìm kiếm, trang kiểm tra kiến thức lịch sử phục vụ mục đích tìm hiểu lịch sử phục vụ cho học tập.
- Nội dung đơn giản phù hợp, không nhiều nội dung không cần thiết Dễ dàng sử dụng, đơn giản
Xác định yêu cầu
- Học sinh, sinh viên, giáo viên, giảng viên, người dùng có nhu cầu muốn tìm hiểu về thông tin lịch sử và kiểm tra kiến thức.
- Giảng viên, giáo viên, nhà khoa học liên quan đến ngành lịch sử hỗ trợ viết sử.
- Những nhà người làm trong lĩnh văn hóa – đời sống như: các nhà làm phim, truyện tranh, soạn kịch, hướng dẫn viên du lịch, nhà xuất bản sách,… Cần tìm hiểu lịch sử để phục vụ cho công việc của họ và cũng là nhà đóng góp thông tin lịch sử.
- Người quản trị trang website (admin).
Chúng em phân cấp hai vị trí người dùng là:
- Người dùng tìm hiểu lịch sử: là những người dùng đã đăng kí tài khoản online và người dùng chưa đăng kí tài khoản.
- Nhân viên soạn lịch sử: là những nhà soạn sử như giáo viên, giảng viên, nhà khoa học, nhà báo, nhà làm phim,… Được super admin đảm bảo các thông tin như bằng cấp, giấy tờ có liên quan đến lĩnh vực lịch sử sẽ được cấp quyền nhân viên soạn lịch sử.
Chức năng dành cho người dùng tìm hiểu lích sử:
- Đăng kí mặc định với tài khoản người dùng.
- Tìm kiếm và hiển thị các thông tin cụ thể về lịch sử như: nhân vật, phim truyện, sách, di tích lịch sử, dòng lịch sử của một quốc gia.
- Người dùng đã đăng kí tài khoản sẽ có chức năng kiểm tra kiến thức lịch sử, đặt mua sách online, thanh toán xem phim có thu phí, bình luận bài viết, thả lượt thích bài viết và bình luận.
- Người dùng đã đăng kí tài khoản sẽ có chức năng xem thông tin lịch sử về nhật kí hoạt động như: danh sách các bài viết đã thả lượt thích, danh sách lịch sử tìm kiếm, danh sách các bài đã bình luận, danh sách điểm của các bài đã kiểm tra.
- Xem thông tin danh sách các đơn hàng đã đặt mua sách, danh sách phim đã thanh toán, lịch sử thanh toán, theo dõi vận chuyển.
- Chat với với nhân viên của trang website.
Chức năng dành cho nhân viên:
- Đăng nhập với mặc định với tài khoản nhân viên do super admin cấp quyền.
- Có tính năng tạo bài viết mới cho: Nhân vật lịch sử, di tích, phim truyện, sách, di tích lịch sử, dòng lịch sử của một quốc gia.
- Tính năng đóng góp bài viết: Các bài viết đã được đăng, hoặc chưa được đăng thì tất cả nhân viên đều có quyền đóng góp và sửa đổi để nội dung luôn được cập nhật nhanh nhất, cung cấp đầy đủ thông tin Hệ thống sẽ lưu lại thông tin những các cá nhân đã đóng góp và hiển thị trên bài viết.
- Trả lời bình luận với người dùng.
3.2.2 Phạm Vi Đối với người dùng:
- Giúp cho việc tìm hiểu một đối tượng lịch sử dễ dàng hơn và đẩy đủ thông tin nhất Ví dụ: người dùng muốn tìm hiểu về một nhân vật lịch sử sẽ thấy hệ thống đưa ra những nhân vật lịch sử có liên quan đến cuộc đời nhân vật đó, những di tích lịch sử, những bộ phim, sách có liên quan đến họ.
- Đem đến cho người dùng thông tin có nguồn gốc rõ ràng và mới nhất phục vụ cho việc tìm hiểu và nghiên cứu.
- Xem các đề trắc nghiệm và thi.
- Có thể đóng góp ý kiến hoặc hỏi bằng cách bình luận hoặc chat trực tiếp với nhân viên soạn sử Nội dung bình luận của người dùng sẽ được AI xử lý xem có tiêu cực hay không sau đó mới được hiển thị thông báo là đã được đăng hoặc không được đăng do vi phạm chính sách đạo đức.
- Có thể xem trang tường nhà của của nhân viên soạn soạn sử.
- Có thể thay đổi hoặc sửa thông tin cá nhân trên trên hệ thống khi đã đăng ký tài khoản. Đối với nhân viên:
- Phục vụ cho nhân viên viết sử nghiên cứu chuyên sâu một đối tượng, tạo một đối tượng mới, tìm kiếm các đối tượng liên quan, đồng tác giả với các nhà viết sử khác khi nhân viên đóng góp thông tin.
- Tạo các bài thi cho người dùng kiểm tra lịch sử.
- Chat và bình luận với người dùng.
- Có thể xem lịch sử hoạt động như lịch sử tìm kiếm, bình luận, thích. Đối với quản trị super admin:
- Cập nhật, xóa, thay đổi thông tin bài viết như nội dung bài viết, người đóng góp, bình luận, các tag liên quan đến bài viết.
- Cập nhật, xóa, thay đổi quyền của tài khoản người dùng và admin.
Đánh giá và sự lựa chọn công nghệ
Xây dựng website tra cứu thông tin lịch sử và kiểm tra lịch sử Hệ thống hóa kiến thức lịch sử một cách trực quan, chính xác Giúp học sinh dễ dàng tiếp cận và hứng thú với môn Lịch sử thông qua hình ảnh và video Nâng cao năng lực và sáng tạo của học sinh Giải quyết tối ưu hóa thiết kế giao diện hiển thị nội dung cho người dùng, người tạo bài viết, người duyệt bài viết, quản trị trang website Lịch sử.
Tìm hiểu lý thuyết về các công nghệ để thực hiện đề tài:
Phân tích yêu cầu và hiện thực hóa hệ thống:
- Mô hình hóa hệ thống.
Xây dựng trang Website lịch sử Việt Nam.
Thực hiện triển khai deploy trên server:
- Phần mềm bảng điều khiển lưu trữ website: Cpanel.
- Cài đặt Python 3, django, ckeditor-5, MySQL trên phần mềm Cpanel.
Sử dụng Visual studio code để lập trình quản lý code Front-end và Back-end:
- Visual Studio Code là một trình biên tập mã, là sản phẩm của Microsoft dành cho Windows, Linux, macOS, ra mắt vào tháng 4 năm 2015 ở hội nghị Build. Đặc điểm nổi bật là đơn giản, gọn nhẹ, dễ dàng cài đặt Visual Studio Code có thể cài đặt được trên cả Windows, Linux và Mac OS và hỗ trợ nhiều ngôn ngữ.
- Visual Studio Code có hỗ trợ chức năng debug, đi kèm với Git, có syntax highlighting, tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn Nó cũng cho phép tùy chỉnh, do đó, người dùng có thể thay đổi theme, phím tắt, và cá tùy chọn khác Nó miễn phí và là phần mềm mã nguồn mở.
Phương pháp tổng hợp lý thuyết:
- Nghiên cứu và tìm hiểu các tài liệu, các trang web liên quan đến nội dung đang tìm hiểu.
- Tham khảo ý kiến đóng góp từ Thầy hướng dẫn, cùng các anh, chị và bạn bè có kinh nghiệm liên quan đến các vấn đề công nghệ, kinh nghiệm thực tiễn trong quá trình thực hiện khóa luận để tạo tính chính xác và khoa học của đề tài. Phương pháp mô hình hóa:
- Mô phỏng ứng dụng từ bước thiết kế cài đặt cho đến kết quả thành phẩm của ứng dụng.
- Trang web có giao diện đơn giản, dễ nhìn và bố cục phân bố hợp lý.
- Các chức năng về cơ bản là tương đối đầy đủ của một nghiệp vụ tra cứu và học tập lịch sử, ngoài ra còn có thêm một số chức năng, tiện ích tích hợp khác.
Mô hình hóa hệ thống
- User-no-login: người dùng chưa đăng nhập.
- User-login: người dùng đã đăng.
- Super-Admin: quản trị viên, có các chức năng của quản trị viên.
- Admin (nhân viên): viết và chỉnh sửa bài viết, bình luận và chat.
3.4.2.2 Usecase dành cho user-login
Hình 13: Usecase dành cho User-login
Hình 14: Usecase user-login timeline
Hình 15: Usecase user-login film
Hình 16: Usecase user-login relic
Hình 17: Usecase user-login person
Hình 18: Usecase user-login book
Hình 19: Usecase user-login scientist
Hình 20: Usecase user-login seience_book
Hình 21: Usecase user-login scientific_research
Hình 22: Usecase user-login science_technology
3.4.2.3 Usecase dành cho user-no-login
Hình 23: Usecase user-no-login
3.4.2.4 Usecase dành cho admin (nhân viên)
Hình 24: Usecase dành cho Admin
Hình 30: Usecase Admin scientific_research
Hình 31: Usecase Admin science_technology
Hình 32: Usecase Admin science_book
3.4.2.5 Usecase dành cho super admin (quản trị viên)
Hình 33: Usecase dành cho super admin
Bảng 1: Bảng mô tả sơ đồ Usecase
STT TÊN CHỨC NĂNG MÔ TẢ
UC_01 Register Chức năng đăng ký tài khoản để truy cập vào trang web.
UC_02 Log In Chức năng đăng nhập tài khoản (đã đăng ký) để đăng nhập vào trang web.
UC_03 SendGmail Chức năng gửi xác nhận lại tài khoản qua gmail để tạo lại mật khẩu mới.
UC_04 LoutOut Chức năng thoát tài khoản
UC_05 CreatePerson Chức năng tạo mới nhân vật lịch sử
UC_05.1 EditDetailPerson Chức năng sửa nội dung chi tiết nhân vật lịch sử
UC_06 CreateRelics Chức năng tạo mới di tích lịch sử
UC_06.1 EditDetailRelics Chức năng sửa nội dung chi tiết di tích lịch sử
UC_07 CreateBook Chức năng tạo mới sách lịch sử
UC_07.01 EditDetailBook Chức năng sửa nội dung chi tiết sách lịch sử
UC_08 CreateFilm Chức năng tạo mới phim lịch sử
UC_08.1 EditDetailFilm Chức năng sửa nội dung chi tiết phim lịch sử
UC_09 CreateTimeLine Chức năng tạo mới dòng thời gian lịch sử
UC_09.1 EditDetailTimeLine Chức năng sửa nội dung chi tiết dòng thời gian lịch sử
UC_10 CreateScienceTechnology Chức năng tạo mới bài viết nghiên cứu khoa học công nghệ
UC_10.1 EditDetailScienceTechnology Chức năng sửa nội dung chi tiết bài viết khoa học công nghệ UC_11 CreateScientificResearch Chức năng tạo mới bài viết nghiên cứu khoa học
UC_11.1 EditDetailScientificResearch Chức năng sửa nội dung chi tiết bài viết nghiên cứu khoa học
UC_12 CreateScientist Chức năng tạo mới bài viết nhà khoa học
UC_12.1 EditDetailScientist Chức năng sửa nội dung chi tiết bài viết nhà khoa học
UC_13 ViewListPerson Xem danh sách bài viết về nhân vật lịch sử
UC_13.1 ViewDetailPerson Xem chi tiết bài viết về nhân vật lịch sử
UC_14 ViewListRelics Xem danh sách bài viết về di tích lịch sử
UC_14.1 ViewDetailRelics Xem chi tiết bài viết về nhân vật lịch sử
UC_15 ViewListBook Xem danh sách bài viết về sách lịch sử UC_15.1 ViewDetailBook Xem chi tiết bài viết về sách lịch sử
UC_16 ViewListFilm Xem danh sách bài viết về phim lịch sử
UC_16.1 ViewDetailFilm Xem chi tiết bài viết về phim lịch sử
UC_17 ViewListTimeLine Xem danh sách bài viết về dòng lịch sử
UC_17.1 ViewDetailTimeLine Xem chi tiết bài viết về dòng lịch sử
UC_18 ViewListScienceTechnology Xem danh sách bài viết về khoa học công nghệ
UC_18.1 ViewDetailScienceTechnology Xem chi tiết bài viết về về khoa học công nghệ
UC_19 ViewListScientificResearch Xem danh sách bài viết về nghiên cứu khoa học
UC_19.1 ViewDetailScientificResearch Xem chi tiết bài viết về nghiên cứu khoa học
UC_20 ViewListScientist Xem danh sách bài viết về nhà khoa học
UC_20.1 ViewDetailScientist Xem chi tiết bài viết về nhà khoa học
Đặc tả một số Usecase chính
Bảng 2: Bảng đặc tả Usecase Register
Actor Người dùng muốn đăng nhập vào hệ thống
Postconditions - Đăng ký không thành công: Hiển thị thông báo và quay lại trang đăng ký
- Đăng ký thành công: Hiển thị trang chủ và tài khoản được lưu vào CSDL
Alternative 1 Người dùng chọn mục đăng ký
Flow 2 Hệ thống hiển thị Form Đăng ký
3 Người dùng nhập đầy đủ thông tin cần thiết vào Form Đăng Ký
4 Người dùng nhấn nút đăng ký
5 Hệ thống kiểm tra thông tin được nhập(rẻ nhánh)
6 Hệ thống thông báo đăng ký thành công
5.1 Hệ thống đưa ra thông báo thông tin nhập không chính xác 5.3 Người dùng xác định thông báo.
5.4 Hệ thống sẽ quay lại về bước 3.
3.5.1.2 Lược đồ chức năng đăng ký
Hình 34: Lược đồ chức năng đăng ký
Bảng 3: Bảng đặc tả Usecase Login
Actor Người dùng đã có tài khoản (user-login),
Pre-conditions Có tài khoản, mật khẩu
Postconditions Success: Hệ thống thông báo đăng nhập thành công.
Fail: Hệ thống thông báo sai tài khoản hoặc mật khẩu.
Alternative 1 Người dùng chọn chức năng đăng nhập từ website.
Flow 2 Hệ thống hiển thị form để nhập tài khoản, mật khẩu cũng
(Success) như là button đăng nhập.
3 Người dùng click vào đăng nhập
4 Hệ thống sẽ kiểm tra xem tài khoản, mật khẩu và hiện ra thông báo thành công.
Exception 4.1 Hệ thống hiển thị thông báo Tài khoản hoặc mật
Flow (Fail) khẩu không chính xác
3.5.2.2 Lược đồ chức năng đăng nhập
Hình 35: Lược đồ chức năng đăng nhập
Bảng 4: Bảng đặc tả Usecase CreatePerson
Use Case Name Tạo nhân vật lịch sử mới
Actor Nhân viên viết sử (admin)
Pre-conditions đã đăng nhập thành công vào trang web
Post-conditions Nhân vật được thêm sẽ hiển thị trong mục Nhân vật
Alternative 1 Admin chọn chức năng tạo nhân vật lịch sử
Flow (Success) 2 Hệ thống hiển thị form tạo nhân vật lịch sử
3 Người dùng thực hiện điền đầy đủ thông tin về nhân vật lịch sử
4 Hệ thống sẽ kiểm tra thông tin dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo tạo nhân vật thành công và lưu vào CSDL
Exception Flow 4.1 Hệ thống thông báo tạo không thành công nhân vật
3.5.3.2 Lược đồ chức năng tạo nhân vật lịch sử
Hình 36: Lược đồ chức năng tạo nhân vật lịch sử
Bảng 5: Bảng đặc tả Usecase EditDetailPerson
Use Case Name Chỉnh sửa thông tin nhân vật lịch sử
Actor Nhân viên viết sử (admin)
Pre-conditions Đã đăng nhập vào trang web với quyền admin hoặc quyền người viết sử
Post-conditions Cập nhật thông tin vừa được chỉnh sửa nhân vật lịch sử
Alternative 1 Admin chọn chức năng chỉnh sửa nhân vật lịch sử
Flow (Success) 2 Hệ thống hiển thị form chỉnh sửa nhân vật lịch sử
3 Admin cập nhật thông tin nhân vật lịch sử
4 Hệ thống kiểm tra các dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo chỉnh sửa thành công nhân vật lịch sử
Exception flow 5.1 Hiển thị thông báo chỉnh sửa không thành công
3.5.4.2 Lược đồ chức năng chỉnh sửa nhân vật lịch sử
Hình 37: Lược đồ chức năng chỉnh sửa nhân vật lịch sử 3.5.5.1 Usecase ViewListPerson
Bảng 6: Bảng đặc tả Usecase ViewListPerson
Use Case Name Xem danh sách nhân vật lịch sử
Actor Nhân viên viết sử (admin), người dùng chưa đăng kí tài khoản (user- nologin), người dùng đã đăng ký tài khoản (user-login)
Post-conditions Hệ thống hiển thị trang danh sách nhân vật lịch sử
Alternative 1 Người dùng chọn danh sách nhân vật lịch sử
2 Hệ thống hiển thị trang danh sách nhân vật lịch sử
3.5.5.2 Lược đồ chức năng xem danh sách nhân vật lịch sử
Hình 38: Lược đồ chức năng xem danh sách nhân vật lịch sử 3.5.6.1 Usecase ViewDetailPerson
Bảng 7: Bảng đặc tả Usecase ViewDetailPerson
Use Case Name Xem chi tiết nhân vật lịch sử
Actor Nhân viên viết sử (admin), người dùng chưa đăng kí tài khoản (user- nologin), người dùng đã đăng ký tài khoản (user-login)
Post-conditions Hệ thống hiển trang chi tiết nhân vật lịch sử
Alternative 1 Người dùng chọn nhân vật
Flow (Success) 2 Hệ thống hiển thị trang nội dung nhân vật lịch sử được chọn
3.5.6.2 Lược đồ chức năng xem chi tiết nhân vật lịch sử
Hình 39: Lược đồ chức năng xem chi tiết nhân vật lịch sử
3.5.7.1 Usecase cập nhật thông tin cá nhân
Bảng 8: Bảng đặc tả Usecase cập nhật thông tin cá nhân
Use Case Name Cập nhật thông tin cá nhân
Actor Người dùng có tài khoản, admin
Pre-conditions Đã đăng nhập vào trang web
Post-conditions Cập nhật thông tin vừa được chỉnh sửa
Alternative 1 Người chọn chức năng cập nhật thông tin cá nhân
Flow (Success) 2 Hệ thống hiển thị form thông tin cá nhân
3 Người dùng cập nhật thông tin cá nhân
4 Hệ thống kiểm tra các dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo cập nhật thành công
Exception flow 5.1 Hiển thị thông báo cập nhật không thành công
3.5.7.2 Lược đồ chức năng cập nhật thông tin cá nhân
Hình 40: Lược đồ chức năng cập nhật thông tin cá nhân 3.5.8.1 Usecase CreateRelics
Bảng 9: Bảng đặc tả Usecase CreateRelics
Use Case Name Tạo di tích lịch sử mới
Actor Nhân viên viết sử (admin)
Pre-conditions đã đăng nhập thành công vào trang web
Post-conditions Di tích được thêm vào CSDL
Alternative 1 Admin chọn chức năng tạo di tích lịch sử
Flow (Success) 2 Hệ thống hiển thị form tạo di tích lịch sử
3 Người dùng thực hiện điền đầy đủ thông tin về di tích lịch sử
4 Hệ thống sẽ kiểm tra thông tin dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo tạo nhân vật thành công và lưu vào CSDL
Exception Flow 4.1 Hệ thống thông báo tạo không thành công di tích
3.5.8.2 Lược đồ chức năng thêm di tích lịch sử
Hình 41: Lược đồ chức năng thêm di tích lịch sử
Bảng 10: Bảng đặc tả Usecase CreatePerson
Use Case Name Thêm sách lịch sử mới
Actor Nhân viên viết sử (admin)
Pre-conditions đã đăng nhập thành công vào trang web
Post-conditions Sách được thêm sẽ lưu vào CSDL
Alternative 1 Admin chọn chức năng thêm sách lịch sử
Flow (Success) 2 Hệ thống hiển thị form thêm sách lịch sử
3 Người dùng thực hiện điền đầy đủ thông tin về sách lịch sử
4 Hệ thống sẽ kiểm tra thông tin dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo thêm sách thành công và lưu vào CSDL
Exception Flow 4.1 Hệ thống thông báo thêm không thành công
3.5.9.2 Lược đồ chức năng thêm sách lịch sử
Hình 42: Lược đồ chức năng thêm sách
Bảng 11: Bảng đặc tả Usecase CreatePerson
Use Case Name Thêm video lịch sử mới
Actor Nhân viên viết sử (admin)
Pre-conditions đã đăng nhập thành công vào trang web
Post-conditions Video được thêm sẽ lưu vào CSDL
Alternative 1 Admin chọn chức năng thêm film lịch sử
Flow (Success) 2 Hệ thống hiển thị form thêm film lịch sử
3 Người dùng thực hiện điền đầy đủ thông tin về film lịch sử
4 Hệ thống sẽ kiểm tra thông tin dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo thêm film thành công và lưu vào CSDL
Exception Flow 4.1 Hệ thống thông báo thêm không thành công
3.5.10.2 Lược đồ chức năng thêm video lịch sử
Hình 43: Lược đồ chức năng thêm video
Bảng 12: Bảng đặc tả Usecase CreateTimeLine
Use Case Name Thêm dòng lịch sử
Actor Nhân viên viết sử (admin)
Pre-conditions đã đăng nhập thành công vào trang web
Post-conditions Dòng lịch sử được thêm sẽ lưu vào CSDL
Alternative 1 Admin chọn chức năng thêm dòng lịch sử
Flow (Success) 2 Hệ thống hiển thị form thêm dòng lịch sử
3 Người dùng thực hiện điền đầy đủ thông tin về dòng lịch sử
4 Hệ thống sẽ kiểm tra thông tin dữ liệu được nhập (rẽ nhánh)
5 Hiển thị thông báo thêm dòng thành công và lưu vào CSDL
Exception Flow 4.1 Hệ thống thông báo thêm không thành công
3.5.11.2 Lược đồ chức năng thêm dòng lịch sử
Hình 44: Lược đồ chức năng thêm dòng lịch sử
THIẾT KẾ DỮ LIỆU VÀ GIAO DIỆN
Lược đồ thực thể ER Diagram
Sơ đồ lớp
Thiết kế giao diện
Bảng 1: Bảng danh sách giao diện
STT Tên giao diện Mô tả
UI_01 Trang chủ Hiển thị tất cả bài viết mới của một quốc gia
UI_02 Bản đồ lịch sử Hiển thị thông tin của một quốc gia, vị trí quốc gia đó trên bản đồ thế giới
UI_03 Trang danh sách nhân vật Hiển thị tất cả danh sách nhân vật tại một quốc gia
UI_04 Trang danh sách sách Hiển thị tất cả danh sách sách tại một quốc gia, hiển thị tất cả các thể loại sách
UI_05 Trang danh sách di tích Hiển thị tất cả danh sách di tích tại một quốc gia
UI_06 Trang danh sách phim truyện Hiển thị tất cả danh sách phim truyện tại một quốc gia
UI_07 Trang danh sách dòng lịch sử Hiển thị tất cả danh sách dòng lịch sử tại một quốc gia
UI_08 Trang lịch sử trái đất Hiển thị tất cả danh sách thời gian lịch sử hình thành trái đất
UI_09 Trang danh sách thông tin Hiển thị tất cả danh sách thông tin khám phá vũ trụ khám phá vũ trụ tại một quốc gia
UI_10 Trang danh sách thông tin Hiển thị tất cả danh sách thông tin công khoa học công nghệ nghệ tại một quốc gia
UI_11 Trang danh sách thông tin Hiển thị tất cả danh sách thông tin nghiên cứu khoa học nghiên cứu tại quốc gia
UI_12 Trang danh sách thông tin nhà Hiển thị tất cả danh sách các nhà khoa khoa học học tại quốc gia
UI_13 Trang danh sách sách khoa học Hiển thị tất cả danh sách khoa học tại một quốc gia, hiển thị tất cả các thể loại sách
UI_14 Trang danh sách các đề thi Hiển thị tất cả danh sách các đề thi tại kiểm tra một quốc gia
UI_15 Trang chi tiết hiển thị bài nội Hiển thị nội dung tiết mà bài viết đã dung bài viết được chọn Ví dụ: vào trang danh sách nhân vật chọn nhân vật Võ Nguyên Giáp, trong trang chi tiết nhân vật sẽ hiển thị các nhân vật có liên quan đến đại tướng như Chủ Tịch Hồ Chí Minh, cụ Phan Bội Châu, Các di tích lịch sử như Điện Biên Phủ, thành cổ Quảng Trị, Dinh Độc Lập, Các loại sách có liên quan đến nhân vật Võ Nguyên Giáp, và những bộ phim liên quan.
UI_16 Trang chi tiết đặt sách Đặt sách
UI_17 Trang thêm bài viết mới Trang này danh cho admin, có thể bài viết mới cho nhân vật lịch sử, phim truyện, sách, dòng lịch sử,
UI_18 Trang xem lịch sử Trang hiển thị lịch sử tìm kiếm, lượt thích, bình luận,
UI_19 Trang Đăng nhập Nhập email, Mật khẩu
UI_20 Trang Đăng ký Nhập email, password, họa và tên
UI_21 Trang quên mật khẩu Nhập email xác thực
UI_22 Trang thông báo đăng xuất Thông báo đăng xuất thành công
Hình 47: Giao diện trang chủ
Hình 48: Giao diện trang chủ
Bảng 8: Mô tả giao diện trang chủ
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách bài viết Nhấn vào sẽ hiện chi tiết mới bài viết.
2 Danh sách di tích Link
Nhấn vào sẽ hiển thị chi tiết di tích.
Danh sách video lịch Nhấn vào sẽ hiển thị chi tiết sử video.
4.3.2.2 Giao diện trang bản đồ lịch sử
Hình 49: Giao diện bản đồ lịch sử Việt Nam
Bảng 9: Mô tả giao diện bản đồ lịch sử Việt Nam
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Image Hiển thị bản đồ Việt Nam.
Bản đồ lịch sử Việt
Hình 50: Giao diện bản đồ thế giới Bảng 10: Mô tả giao diện bản đồ thế giới
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Image Hiển thị bản đồ thế giới.
Bản đồ lịch sử thế giới
Hình 51: Giao diện lịch sử Việt Nam Bảng 11: Mô tả giao diện lịch sử Việt Nam
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Lịch sử Việt Nam Text
Hiển thị bài viết lịch sử ViệtNam.
4.3.2.3 Giao diện trang danh sách nhân vật
Hình 52: Giao diện nhân vật lịch sử Bảng 12: Mô tả giao diện nhân vật lịch sử
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách nhân vật Nhấn vào sẽ hiển chi tiết lịch sử nhân vật.
Danh sách dòng thời Nhấn vào sẽ hiển thị chi tiết gian dòng thời gian.
4.3.2.4 Giao diện trang danh di tích khảo cổ
Hình 53: Giao diện di tích khảo cổ Bảng 13: Mô tả giao diện di tích khảo cổ
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách di tích Nhấn vào sẽ hiển thị chi tiết khảo cổ dòng lịch sử.
Hình 54: Giao diện di tích khảo cổ
4.3.2.5 Giao diện trang danh sách phim truyện
Hình 55: Giao diện phim truyện
Bảng 14: Mô tả giao diện phim truyện
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách phim Nhấn vào sẽ hiện chi tiết truyện lịch sử video phim truyện.
Hình 56: Giao diện chi tiết phim truyện
4.3.2.6 Giao diện trang sách sách
Hình 57: Giao diện sách Bảng 15: Mô tả giao diện sách
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách sách lịch Nhấn vào sẽ hiện chi tiết sử sách.
Hình 58: Giao diện chi tiết sách
4.3.2.7 Giao diện trang dòng lịch sử
Hình 59: Giao diện dòng lịch sử
Bảng 16: Mô tả giao diện dòng lịch sử
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách dòng lịch Nhấn vào sẽ hiện chi tiết sử dòng lịch sử.
4.3.2.8 Giao diện trang lịch sử hình thành trái đất
Hình 60: Giao diện lịch sử hình thành trái đất
Bảng 17: Mô tả giao diện lịch sử hình thành trái đất
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
Lịch sử hình thành Hiển thị thông tin chi tiết trái đất lịch sử hình thành trái đất.
2 Dòng thời gian của Link trái đất Nhấn vào sẽ hiện thị thông tin chi tiết dòng thời gian trái đất.
4.3.2.9 Giao diện trang khoa học công nghệ và khám phá vũ trụ
Hình 61: Giao diện khoa học công nghệ
Hình 62: Giao diện khám phá vũ trụ Bảng 18: Mô tả giao diện khám phá vũ trụ
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Danh sách tin tức Link khoa học công nghệ Nhấn vào sẽ hiện chi tiết thông tin khoa học công nghệ.
4.3.2.10 Giao diện trang danh sách và kiểm tra kiến thức lịch sử
Hình 63: Giao diện kiểm tra Bảng 19: Mô tả giao diện kiểm tra
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
Danh sách bài kiếm Nhấn vào sẽ hiện chi tiết bài tra lịch sử kiểm tra.
Hình 64: Giao diện chi tiết kiểm tra
Bảng 20: Mô tả giao diện chi tiết kiểm tra
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Bài kiểm tra Text Hiển thị bài làm kiểm tra.
2 Thời gian kiểm tra Label Hiển thị thời gian kiểm tra.
3 Số câu hỏi kiểm tra Label
Hiển thị số câu hỏi bài kiểm tra.
Nhấn vào sẽ hoàn thành và nộp bài.
Bảng 21: Mô tả giao diện Admin
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
Nhấn vào sẽ hiện thị form thay đổi avatar.
Nhấn vào sẽ hiển thị những quốc gia để chọn.
3 Link Nhấn vào sẽ hiển thị các
Danh sách các chức chức năng. năng của website (bài viết, giới thiệu, bản đồ, )
4.3.2.12 Giao diện trang thêm bài viết mới và chi tiết sản phẩm
Hình 66: Giao diện thêm bài viết mới và chi tiết sản phẩm
Bảng 22: Mô tả giao diện thêm nhân vật lịch sử
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Tao nhân vật mới Button
Nhấn vào sẽ hiển thị form thêm mới nhân vật.
2 Danh sách nhân vật Link
Nhấn vào sẽ hiển thị chi tiết nhân vật lịch sử.
Hình 67: Giao diện thêm nhân vật mới
Bảng 23: Mô tả giao diện thêm nhân vật mới
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Tên nhân vật Input Nhập tên nhân vật.
2 Nội dung giới thiệu Input Nhập nội dung giới thiệu.
3 Chèn ảnh đại diện Input, Image
Nhấn vào để thêm ảnh đại diện.
Hình 68: Giao diện thêm bài viết mới
4.3.2.13 Giao diện trang thêm, sửa thông tin người dùng
Hình 69: Giao diện xem thông tin cá nhân Bảng 24: Mô tả giao diện xem thông tin cá nhân
STTTÊN ĐỐI TƯỢNGLOẠI ĐỐI TƯỢNG MÔ TẢ
1 Thông tin giới thiệu Button
Nhấn vào sẽ hiện chi form chi tiết thông tin.
Hình 70: Giao diện chỉnh sửa thông tin cá nhân
Hình 71: Giao diện chỉnh sửa thông tin cá nhân
Hình 72: Giao diện thay đổi ảnh đại diện
Hình 73: Giao diện thay đổi ảnh bìa Bảng 25: Mô tả giao diện chỉnh sửa thông tin cá nhân
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Thông tin giới thiệu Form, Input
Nhấn vào để nhập thông tin giới thiệu.
4.3.2.14 Giao diện trang đăng nhập, đăng ký, quên mật khẩu, đăng xuất
Hình 74: Giao diện đăng nhập
Bảng 26: Mô tả giao diện đăng nhập
ST TÊN ĐỐI LOẠI ĐỐI
1 Tên tài khoản Label, Input Nhập tên tài khoản.
2 Mật khẩu Label, Input Nhập mật khẩu.
Khi nhấn vào sẽ lưu mật khẩu.
Khi nhấn vào sẽ chuyển đến trang đăng ký.
Khi nhấn vào sẽ chuyển đến trang chủ.
Nhấn vào sẽ chuyển đến trang quên mật khẩu.
Hình 75: Giao diện đăng ký
Bảng 27: Mô tả giao diện đăng ký
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Tên tài khoản Label, Input Nhập tên tài khoản.
2 Email Label, Input Nhập email.
3 Mật khẩu Label, Input Nhập mật khẩu.
4 Nhập lại mật khẩu Label, Input Nhập lại mật khẩu.
Nhấn vào sẽ đăng ký tài khoản và chuyển đến trang đăng nhập.
Hình 76: Giao diện đặt lại mật khẩu
Bảng 28: Mô tả giao diện đặt lại mật khẩu
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Địa chỉ email Label, Input Nhập địa chỉ email.
2 Đặt lại mật khẩu Label, Input
Nhấn vào sẽ chuyển đến trang đặt lại mật khẩu.
Khi nhấn vào sẽ chuyển đến trang đăng nhập.
4.3.2.15 Giao diện chat giữ user-login, admin, superadmin
Hình 77: Giao diện chatBảng 29: Mô tả giao diện chat
STT TÊN ĐỐI TƯỢNG LOẠI ĐỐI TƯỢNG MÔ TẢ
1 Khung chat Input Nhập địa chỉ email.
2 Nút gửi Button, submit Nhấn vào sẽ tin nhắn
CÀI ĐẶT KIỂM THỬ
Cài đặt
- Môi trường lập trình ngôn ngữ python: https://www.python.org/
- Môi trường quản lý các package: https://www.anaconda.com/download
- Cài đặt IDE code visual studio: https://code.visualstudio.com/download
- Cài đặt framework django: https://www.djangoproject.com/download/
- Cài đặt framework CKEditor-5: https://pypi.org/project/django-ckeditor-5/
- Cài đặt môi trường MySQL: https://dev.mysql.com/downloads/installer/ - Cài đặt MySQL Workbench: https://downloads.mysql.com/archives/workbench/ -
Tải project tại github: https://github.com/PhamManhDinh/websiteHistoryViet
Các bước chạy hệ thống
- Bước 1: vào Visual studio code mở open folder, chọn thư mục code git bạn đã tải về.
- Bước 2: mở terminal: cd đến đến thư mục history, cú pháp: cd history
- Bước 3: cài framework django: cú pháp: pip install django
- Bước 4: cài framework CKEditor-5: cú pháp: pip install django-ckeditor-5
- Bước 3: gõ cú pháp chạy server, cú pháp: python manage.py runserver
Kiểm thử
Trang người dùng chưa đăng nhập:
Bảng 2: Kiểm thử người dùng chưa đăng nhập
Test Test Title Test Steps Test Expected Actual Result Status case Data Result
Bình Thông báo 1 Vào - Hiện textbox Hiện textbox Pass luận bình luận trang chủ hoặc Nhập message message thông báo yêu thông báo thất bại, yêu trang danh sách ô cầu đăng nhập yêu cầu đăng cầu đăng bài viết bình để được bình nhập để được luận bình luận luận: nhập để 2 Chọn được bình đối tượng bài Điền luận viết muốn nội tìm dung bất kì hiểu.
4 Nhấn vào gửi bình luận
Thả Thông báo 1 Vào - Hiện textbox Hiện textbox Pass thích thả thích thất trang chủ hoặc Nhập message message bài bại, yêu cầu ô thông báo viết đăng nhập trang danh sách thông báo yêu cầu đăng để được bình bài viết bình cầu đăng nhập nhập để được luận để được luận: thả thích thả thích 2 Chọn để được thả đối tượng bài Điền thích viết muốn nội tìm dung bất kì hiểu.
3 Thả thích bài viết. Đặt Thông 1 Vào - Hiện textbox Hiện textbox Pass sách báo trang chủ hoặc Nhấn message message vào đặt hàng thất nút thông báo yêu thông báo giỏ bại, yêu cầu trang danh cầu đăng nhập yêu cầu đăng hàng đăng nhập sách thêm để được đặt nhập để được để được đặt sách hàng đặt hàng hàng sách vào giỏ
2 Chọn hàng. sách bạn muốn tìm hiểu.
3 Nhấn nút thêm sách vào giỏ hàng.
Trang người dùng đã đăng nhập:
Bảng 3: Kiểm thử người dùng đã đăng nhập
Test Test Test Test Data Expecte Actual Statu case Title Steps d Result Result s
Bình Thông 1 Vào trang - Nhập ô bình Hiện Hiện Pass luận báo đã chủ hoặc trang luận: textbox textbox gửi +Bài viết hay message bình danh sách bài viết thông message luận 2 Chọn báo thông thành đ công đối tượng ã gửi báo đã bình gửi bình bài viết muốn luận luận tìm hiểu. thành thành
3 Bình luận công công bài viết
4 Nhấn vào gửi bình luận Đặt Sách 1 Vào trang - Nhấn nút thêm Hiện Hiện Pass sách đã chủ hoặc trang sách vào giỏ hàng textbox textbox vào được message giỏ thêm danh sách sách thông message hàng vào giỏ 2 Chọn sách báo đã thông hàng thêm thành bạn muốn tìm sách vào báo đã công hiểu giỏ hàng thêm thành sách vào
3 Nhấn nút công giỏ hàng thêm sách vào giỏ thành hàng. công Đặt Đặt 1 Vào trang đặt - Nhấn chọn nút Hiện Hiện Pass hàng hàng hàng thanh toán textbox textbox thanh message message toán với 2 Nhấn chọn thông thông sau phươn thêm số lượng báo đặt báo đặt khi g thức hàng hàng với nhận thanh sách nếu có với phương hàng toán 3 Cập nhật lại phương thứcthức thanh sau giỏ hàng nếu có thanh toán sau khi thêm số lượng toán sau khi nhận nhận sách khi hàng hàng 4 Nhấn chọn nhận thành thành thanh toán sau hàng công công khi nhận hàng thành
5 Nhấn chọn nút công thanh toán
Chat Gửi tin 1.Vào trang - Nhấn chọn một Hiện Hiện Pass với nhắn tài khoản nhân viên chat bất kì thông thông tin nhân chat tin dưới viên thành của tôi - Gửi nội dung cho textboxt dưới lịch công 2 Chọn nhân viên Chat chat đã textboxt sử gửi mục chat - Nhấn nút gửi đoạn thành chat đã công gửi thành
3 Chọn chat công nhân viên Chat bất kì.
5 Nhấn nút hoặc bấm enter gửi tin nhắn chat. Đăng Đăng nhập nhập thành thành công công
1 Vào - Nhập tài khoản trang chủ email:
2 Nhấn dinh.it.software@gmail.co vào nút m tài - Nhập password: khoản, chọn meomeo11223344 đăng nhập.
3 Đi đến trang đăng nhập.
4 Nhập email và password đã khởi tạo trước đó.
5.Nhấn vào nút đăng nhập
Hiện Hiện textbox textbox message message thông thông báo báo đăng đăng nhập nhập thành thành công công
Pass Đăng Đăng nhập nhập nhập thất thất bại bại
1 Vào - Nhập tài khoản Hiện Hiện trang chủ email: textbox textbox
2 Nhấn dinhcu.it.software@gmail.c message message vào nút om thông thông báo báo đăng tài - Nhập password: khoản, chọn meomeo11223344 đăng nhập đăng nhập nhập không không thành
3 Đi đến trang thành công, công, yêu cầu đăng nhập. yêu cầu nhập lại
4 Nhập nhập lại tài khoản email và tài và passwor d đã khởi tạo khoản m trước đó và mật ật
5 Nhấn khẩu vào nút khẩu đăng nhập
Pass Đăng Đăng 1 Vào - Nhập họ và tên: Hiện Hiện ký ký thất trang chủ Phạm Mạnh Đình textbox textbox message bại vì thất 2 Nhấn - Nhập tài khoản message thông bại vì tài vào nút email: thông báo đăng ký không khoản tài tài dinh.it.software@gmail.co báo thành đã công, vì khoả được khoản, chọn m đăng ký tài khoản n đã đăng đăng ký không đã được được ký - Nhập password: đăng ký đăng trước 3 Đi meomeo11223344 thành trước đó. ký đó công, vì trước đến trang tài đó đăng ký. khoản
4 Nhập đã được usernam e, đăng ký trước email và đó. passwor d.
Pass Đăng Đăng ký ký thành thành công công
1 Vào - Nhập tài khoản Hiện trang chủ email: chưa đăng ký lần textbox message
2 Nhấn nào thông vào nút - Nhập password: bất báo đăng ký tài kì mà phải là mật khẩu thành mạnh công. khoản, chọn đăng ký.
3 Đi đến trang đăng ký.
4 Nhập usernam e, email và passwor d.
Hiện textbox message thông báo đăng ký thành công.
Quên Tạo mật mật khẩu khẩu mới thành công
2 Nhấn vào nút tài khoản, chọn đăng nhập.
3 Đi đến trang đăng nhập.
4 Chọn mục quên mật khẩu.
5 Nhập email để nhận link đi đến trang tạo lại mật khẩu.
6 Nhập lại mật khẩu mới
7 Nhấn vào nút tạo mật khẩu
-Nhập password: bất kì mà phải là mật khẩu mạnh Hiện textbox message thông báo tạo mật khẩuthành công. Đi đến Pass trang dashboar d người dùng và hiện textbox message thông báo tạ o mật khẩu thành công.
Trang nhân viên lịch sử đã đăng nhập:
Bảng 4: Kiếm thử nhân viên lịch sử
Test Test Test Steps Test Expected Actual Result Status case Title Data Result
Tạo Tạo 1 Đăng - Nhập Hiện textbox Chuyển sang Pass bài viết nhân nhập vào tên nhân vật message trang thêm nội nhân vật mới dung chi tiết thành trang thông báo nhân vật lịch sử vật lịch công dashboard - Nhập tạo nhân và Hiện textbox sử mới message thông admin nội dung vật báo tạo nhân vật thành công
2 Đi tóm tắt bài thành công đến viết. trang tạo - Thêm nhân vật ảnh nhân
3 Nhất vật. nút tạo nhân vật.
Tạo Tạo di 1 Đăng - Nhập Hiện Chuyển sang Pass bài tích nhập vào tên nhân vật textbox trang thêm nội viết di lịch sử mới message dung chi tiết di trang thông báo tích lịch sử và tích thành tạo di tích Hiện textbox lịch sử công dashboard - Nhập thành công message thông mới admin nội dung báo tạo di tích
2 Đi tóm tắt bài thành công đến trang tạo viết. di tích - Thêm
3 Nhất ảnh nhân nút tạo di vật. tích.
